I have question with ajax.
my ajax script :
{
"data": "noInduk",
"width": "100px",
"sClass": "text-center",
"orderable": false,
"mRender": function(data) {
return 'Edit';
}
How to do this so that I can make more than one variable to review the data request.
return 'Edit';
be like this
return 'Edit';
One solution is that get the whole data with concatenating with a specific delimiter like | and on ajax response split data, so you will have two responses.
{
"data": "noInduk",
"width": "100px",
"sClass": "text-center",
"orderable": false,
"mRender": function(data) {
var newData = data.split('|');
'Edit';
}
Related
I have a 20,0000+ data in sever side I have to plot in datatable based on their gender.
I have three categories
All-show all data in list
women+kids data list
men data list
First time load Its all fine by choosing radio button ,In some cases I got all previous data list but the count still shows
Code :
function load_data(preferredGender) {
$("#user_table").DataTable({
"processing": true,
"serverSide": true,
"dataType": "json",
"deferRender": true,
"ajax": {
"url": "<?php echo base_url(); ?>user/list_customers",
"data": {
preferredGender
},
},
"columns": [
{
"data": "row"
},
{
"data": "email"
},
],
});
}
$('#table-id').DataTable({
"processing": true,
"serverSide": true,
"ajax": {
"url": "URL",
"type": "POST",
"data": function ( data ) {
data.gender = $('#gender').val();
},
"dataSrc": function ( json ) {
return json.data;
}
},
"columnDefs": [
{
"targets": [ ],
"orderable": false,
},
],
"fnDrawCallback": function() {
},
});
Hi all Thanks for your valuable time.I have fixed the issue
Issue in Sending request to get data on each click and the responding time and data.
on before send in ajax call aborting if any previous request exits and aborting
beforeSend:function(){
if (userTable && userTable.hasOwnProperty('settings')) {
userTable.settings()[0].jqXHR.abort();
}
}
If you have any alternative for this please suggest me
Thanks
I have this code for jQuery Datatables, it works fine, everything is working as it should aside from the order function is not sorting the column on page load (or at all).
What am I doing wrong here? I've read Datatables documentation and this appears to be correct.
$(document).ready(function() {
$('#data').DataTable( {
"ajax": {
"dataType": 'json',
"url": "package.json",
"dataSrc": "search_result",
"order": [ 0, "desc" ]
},
"columns": [
{ "data": "num" },
{ "data": "domain_name",
"render": function(data, type, row, meta)
{
if(type === 'display')
{
data = '<a class="intel_link" href="http://www.' + data + '" target="_blank">' + data + '</a>';
}
return data;}
},
{ "data": "query_time"},
{ "data": "create_date" },
{ "data": "update_date" },
{ "data": "expiry_date" }
]
} );
} );
Problem is with sort attr, its written inside ajax block.
$(document).ready(function() {
$('#data').DataTable( {
"ajax": {
"dataType": 'json',
"url": "package.json",
"dataSrc": "search_result"
},
"order": [ 0, "desc" ]
"columns": [
{ "data": "num" },
{ "data": "domain_name",
"render": function(data, type, row, meta)
{
if(type === 'display')
{
data = '<a class="intel_link" href="http://www.' + data + '" target="_blank">' + data + '</a>';
}
return data;}
},
{ "data": "query_time"},
{ "data": "create_date" },
{ "data": "update_date" },
{ "data": "expiry_date" }
]
} );
} );
For more detail ref Datable Order
I need to make a table dynamically with DataTable Jquery, the table must be Server-side processing type and in the same request (Ajax) and answer the columns are made and obviously the results.
DatosColumna=""//Json with Response of ajax
$('#table_query_info').dataTable({
columnDefs: DatosColumna,//Here its the headers
destroy: true,
processing: true,
serverSide: true,
ajax: {
url: myBaseUrl + "consults/find_docs",
type: "post",
data: function (d) {
d.datos = make_info()//Send Json with info
},
statusCode: {
200: function (resp) {
alert("OK");//That Good
}
}
}
});
I tried with this code but it has not worked
Thank you very much
steps for resolution:
make a html code
<table class="table" id="tablaindex" style="width:100%"></table>
Obtengo las columnas, antes de inicializar la tabla
$.ajax({
type: "POST",
url: "AtencionTurno/ColumnasDatatable",
data: TblOficina,
success: function (response) {
inicializarTabla(response);
}, error: function (request, status, error) {
console.log("Error");
}
});
The reques obtain the follow json
[
{
"title": "Column 1",
"data": "Id_Turno",
"orderable": false
},
{
"title": "Column 2",
"data": "Turno",
"orderable": false
},
{
"title": "Column 3",
"data": "Clasificacion",
"orderable": false
},
{
"title": "Column 4",
"data": "Concepto",
"orderable": false
},
{
"title": "Column 5",
"data": "Hora",
"orderable": false
}]
now I initialize the table with the columns that were obtained
inicializarTabla = function (columnas) {
var dataTable = $('#tablaindex').DataTable({
"processing": true,
"serverSide": true,
stateSave: true,
orderable: false,
"order": [],
columns: columnas,
"lengthChange": false,
searching: false,
colReorder: false,
"ajax": {
url: "AtencionTurno/IndexTurnos",
type: "post",
data: TblOficina
}
});
};
response from server:
{
"draw": "1",
"recordsTotal": 4,
"recordsFiltered": 4,
"data": [
{
"Id_Turno": "358",
"Turno": "ALAT1",
"Clasificacion": "euismod",
"Concepto": "Convallis",
"Hora": "11:00:12",
"Tiempo_Espera": "2018/07/03 11:00:12",
"Tipo_Cliente": "Calendario",
"Transferencia": "",
"null": "358"
},
{
"Id_Turno": "354",
"Turno": "ALAK23",
"Clasificacion": "euismod",
"Concepto": "Pagos",
"Hora": "16:36:14",
"Tiempo_Espera": "2018/06/29 16:36:14",
"Tipo_Cliente": "Utiles Escolares ",
"Transferencia": "",
"null": "354"
}
]
}
Working a Project here and I need some help. I have a php page and an html page, trying to pass the username of the php into a DataTable that is in my html file. The code that I have for each is:
PHP is below:
public function __construct(Guard $auth)if (Auth::check() ||Auth::attempt()) {
$auth_id = Auth::user()->id;}
My HTML portion is the following:
var table = $('#example').DataTable( {
// Makes one continuous line
"autoWidth": false,
// How many rows to return
"pageLength": 25,
// Setup the search box with the current username to filter the values on the screen - jsg 2/12/2016
"search": {
"search": $('auth')
}, dom: "Bfrtip",
ajax: "../php/staff.php",
columns: [
{
data: null,
defaultContent: '',
className: 'select-checkbox',
orderable: false
},
{ data: "instructor", visible: false },
{ data: "first_name" },
{ data: "last_name" },
{ data: "category" },
{ data: "Metric_text" },
{ data: "response_value" },
{ data: "fkey_course_id", visible: false },
{ data: "course_code" },
{ data: "course_number" },
{ data: "course_section"}
],
My Question is how can I get $auth_id into the search portion of the HTML coding. As you can see I've tried this with $('auth') but its giving me an object error. If I trying a name like "search": "Test" then test populates and it works. Basically I want to pass the username into the search box of the DataTable so it ill show only the usernames rows.
you can use Ajax.
The code looks like this:
$(document).ready(function() {
$('#example').DataTable( {
"processing": true,
"serverSide": true,
"ajax": "scripts/ids-objects.php",
"columns": [
{ "data": "first_name" },
{ "data": "last_name" },
{ "data": "position" },
{ "data": "office" },
{ "data": "start_date" },
{ "data": "salary" }
]
} );
} );
Look at this sample.
Hope it can help you.
I'm using jsTree 1.0. And have this code :
$(document).ready(function () {
$("#folders_tree").jstree({
"core": {
"initially_open": ["root"]
}, "html_data": {
"data": '<?= $folders; ?>'
}, "themes": {
"theme": "default",
"dots": true,
"icons": true,
"url": "<?= Yii::app()->request->baseUrl ?>/css/jstree/themes/default/style.css"
}, "contextmenu": {
"items": {
"create": {
"label": "Create",
"action": function (obj) {
this.create(obj);
}, "_disabled": false,
"_class": "add",
"separator_before": false,
"separator_after": false,
"icon": false
}, "rename": {
"label": "Rename",
"action": function (obj) {
this.rename(obj);
}, "_disabled": false,
"_class": "rename",
"separator_before": false,
"separator_after": false,
"icon": false
}, "remove": {
"label": "Delete",
"action": function (obj) {
this.remove(obj);
}, "_disabled": false,
"_class": "delete",
"separator_before": true,
"separator_after": false,
"icon": false
}, "ccp": false
}
},
"plugins": ["themes", "html_data", "ui", "crrm", "contextmenu"]
});
/* Callbacks */
var folders = $("#folders_tree");
folders.bind("create.jstree", function (e, data) {
var parent_id = data.rslt.parent[0].id;
var name = data.rslt.name;
var node = data.args[0];
var dataArray = {
"ref_folder": parent_id,
"name": name
};
var dataString = JSON.stringify(dataArray);
$.ajax({
type: 'POST',
url: '<?= Yii::app()->createUrl('
ajax / createfolder ') ?>',
data: {
data: dataString
}, success: function (jdata) {
var json_data = JSON.parse(jdata);
// Here's! This code is not working. Id is not set.
$(node).attr("id", json_data.new_id);
}, dataType: 'text'
});
});
});
$(node).attr("id", json_data.new_id) // this code is not working.
I'm stuck on this :( How can I set this id?
The node variable must be declared as :
var node = data.rslt.obj;
And called as :
node.attr("id", json_data.new_id);
I would do alert(jdata) in the success callback.
Be sure the server is returning safe JSON and that the actual new_id attribute exists.