I try following code but its give error.
My code:
Dt = $('#mylist').dataTable({
"dom": "<'row no-gutters'<'col-md-4'l><'col-md-4'r><'col-md-4'f>>t<'row no-gutters'<'col-md-4'i><'col-md-4'><'col-md-4'p>>",
"processing": true,
"ajax": "{{ URL::to('product/list') }}",
"columnDefs": [
{"orderable": false, "targets": [3, 4]},
],
"order": [[0, "asc"]]
});
Try this:
You missed serverside : true in your code.
oTable = $('#mylist').dataTable({
"dom": "<'row no-gutters'<'col-md-4'l><'col-md-4'r><'col-md-4'f>>t<'row no-gutters'<'col-md-4'i><'col-md-4'><'col-md-4'p>>",
"processing": true,
"serverSide": true,
"ajax": "{{ URL('product/list') }}",
"columnDefs": [
{"orderable": false, "targets": [3, 4]},
],
"order": [[0, "asc"]]
});
Related
After passing json_encode variable, not able to loading "sProcessing" text before loading data. I am trying to load more than 50000 records.
Javascript Code
<script>
var data = <?php echo json_encode($data); ?>;
$(document).ready(function() {
$('#datatable').dataTable({
"aaData": data,
"bProcessing": true,
"aoColumns": [
{ "data": "submissions_dt" },
{ "data": "pettycash_dt" },
{ "data": "type" },
{ "data": "description" },
{ "data": "voucher_no" },
{ "data": "amount", className: "right" }
],
"oLanguage": {
"sProcessing": "Fetching Data, Please wait..."
},
order: [[2, 'desc']],
"lengthMenu": [[50, 100, -1], [50, 100, "All"]],
"columnDefs": [
{ "orderable": false, "targets": [0,1,2,3,4,5] },
{"targets": [ 2 ], "visible": false }
]
});
});
</script>
"tgl_dok":{"date":"2018-07-02 00:00:00.000000","timezone_type":3,"timezone":"Europe\/Berlin"}
jQuery code
$(document).ready(function(){
$('#table').DataTable({
"paging": true,
"lengthChange": true,
"searching": false,
"ordering": true,
"info": false,
"responsive": true,
"autoWidth": false,
"pageLength": 10,
"ajax": {
"url": "../adapter/ArReport/rptPenerimaanHarian/data.php",
type: "POST",
data: ({kd_entitas: kd_entitas,
tglAwal: tglAwal,
tglAkhir: tglAkhir})
},
"columns": [
{
title: 'Date',
data: "tgl_dok",
"type": "date",
},
{
title: 'Receipt. No',
data: "no_dok"
},
]
})
});
How can I show date format like DD/MM/YY in datatables?
UPDATE MyTable SET MyDate = CONVERT(datetime, '2018-07-02 00:00:00.000000', 121)
about convert rules look here
I'm using "bSortable": false and "orderable": false but still sort asc icon visible in first column header. I have tried "bsort":false and "orderable": false, "targets": "_all" but still the icon is visible.
If i use "aaSorting":[] this it throws
Undefined variable: orderColumn
Mycode:
var test_table = $('#testDataTable').DataTable({
// "lengthMenu": [[10, 50, 100,150,200], [10, 50, 100,150,200]],
"lengthMenu": [[25, 50, 100], [25, 50, 100]],
"iDisplayLength": 25,
"sScrollX" : "100%",
"scrollX" : true,
"processing" : true,
"serverSide" : true,
"destroy":true,
"ajax" : {
url: "/test/datatable.php",
type: 'POST',
data: { status: 'ok' }
},
'columnDefs' : [{"searchable": true, "orderable": false, "targets": '_all' }, {"width": "12%", 'targets': [3,4,5] }]
});
Thanks in advance.
Change your code to this:
For me this works all the time ;)
var test_table = $('#testDataTable').DataTable({
// "lengthMenu": [[10, 50, 100,150,200], [10, 50, 100,150,200]],
"lengthMenu": [[25, 50, 100], [25, 50, 100]],
"iDisplayLength": 25,
"sScrollX" : "100%",
"scrollX" : true,
"processing" : true,
"serverSide" : true,
"destroy":true,
"ajax" : {
url: "/test/datatable.php",
type: 'POST',
data: { status: 'ok' }
},
"aoColumnDefs": [{ "bSortable": false, "aTargets": [ "_all" ] }],
"aaSorting": []
});
i'm using datatables with codeigniter
and it looked like this on localhost
datatables on localhost
and looked like this on server, i can't get the columns on the right side
even if i enabled scrollX
datatables on server
my java-script code
$(document).ready(function () {
var oTable = $('#tb').dataTable({
"bProcessing": true,
"bServerSide": true,
"bStateSave": true,
"autoWidth": false,
"colReorder": true,
"responsive": true,
"scrollX": true,
"sAjaxSource": '<?php echo base_url(roleURIUser()); ?>/leads/viewdata',
"bJQueryUI": false,
"sDom": 'T<"clear">Rlfrtip',
"tableTools": {
"sSwfPath": "<?= locationPlugin('url'); ?>datatables/extensions/TableTools/swf/copy_csv_xls_pdf.swf"
},
"sPaginationType": "full_numbers",
"iDisplayStart ": 10,
"aoColumns": [{
"mData": "name"
}, {
"mData": "mobile"
}, {
"mData": "phone"
}, {
"mData": "branch"
}, {
"mData": "code"
}, {
"mData": "email"
}, {
"mData": "university"
}, {
"mData": "faculty"
}, {
"mData": "address"
}, {
"mData": "date_created"
}, {
"mData": "status"
}, {
"mData": "comment"
}, {
"mData": "date_followup"
}],
"aoColumnDefs": [
{"bSearchable": false, "aTargets": [5, 6, 7, 8, 9, 10, 11, 12]},
{"bSortable": false, "aTargets": [5, 6, 7, 8, 9, 11, 12]},
{"width": "30%", "aTargets": [11]}
],
"order": [[0, "desc"]],
"oLanguage": {
"sProcessing": "<img src='<?= locationUpload('url'); ?>/ajax-loader.gif'>"
},
"fnInitComplete": function () {
//oTable.fnAdjustColumnSizing();
},
'fnServerData': function (sSource, aoData, fnCallback) {
$.ajax
({
'dataType': 'json',
'type': 'GET',
'url': sSource,
'data': aoData,
'success': fnCallback
});
}
});
Check the image path of button next to your name.(+) and (-) image path.
I can not understand well at all.
If the problem is that you can not get the data on the server, check your config data in application/config/database.php
$db['default']['hostname'] = "host";
$db['default']['username'] = "username";
$db['default']['password'] = "password";
$db['default']['database'] = "database_name";
$db['default']['dbdriver'] = "mysqli";
If your CONECCION is correct, then the problem is in your model or your controller, eg
controller.php
function do_somthing(){
$this->load->library('database');
$this->load->model('model_file');
$info = $this->model_file->get_data();
var_dump($info);
}
model_file.php
function get_data(){
return $this->db->get('table')->result();
}
is there anyway to search the columns only second col without using filter?
i've tried using:
"aoColumnDefs": [
{ "bSearchable": false, "aTargets": [ 1 ] }]
"searchCols":[null, {"search":""}, null]
here is my complete script:
$(document).ready(function(){
oTable = $("#roles").dataTable({
"processing":"true",
"serverSide": "true",
"ajax": "roles",
"columns":[
{data: 'id', name:'id'},
{data: 'name', name:'name'},
{data: 'link', name:'link'}
{data: 'actions', name:'actions'}
],
"oClasses": {
"sFilter": "pull-right",
"sFilterInput": "form-control input-rounded ml-sm"
},
"Dom": "<'row'<'col-md-6 hidden-xs'l><'col-md-6'f>r>t<'row'<'col-md-6'i><'col-md-6'p>>",
"oLanguage": {
"sLengthMenu": "_MENU_",
"sInfo": "Showing <strong>_START_ to _END_</strong> of _TOTAL_ entries"
},
"searchCols":[null, {"search":""}, null]
});
});
is there anyway so i can only filter name column without using footer filter?
because if i not specific a column to be filter, when i tried to search it will get an error because there is actions column.