jquery datatables ajax json example – Ajax source

jquery datatables ajax json example – Ajax source

datatables ajax example – jquery datatables ajax json example

Basically all of the paging data to pagination, filtering data to pagination, sorting data to pagination etc that DataTables does can be handed of the off to a Server-side data server.
Server-side all the data processing is enabled by virtual setting the serverSide data-table option to true or false and providing an simple jquaey Ajax data source through the all the data content ajax option.jquery datatables ajax json example – Ajax source

How to update your data object for AJAX JSON data retrieval Example

 

        

            

                
No
                
DataName
                
web
                
Address
                
Status
                
Action
            
        
        

            

               
No
                
DataName
                
web
                
Address
                
Status
                
Action
            
        
    

Using a Json object to create an Html table using Datatables

$(document).ready(function() {
    $('#example').DataTable( {
        "ajax":  "http://mor.tax/external/test.txt",
        "columns": [
            { "data": "no" },
            { "data": "dataname" },
            { "data": "web" },
            { "data": "home.address" },
            { "data": "status" },
            { "data": null }
        ],
        "columnDefs": [ {
            "targets": -1,
            "data": null,
            "defaultContent": "Click!"
        } ]
    } );
} );

display data using jQuery datatables, AJAX and JSON

$(document).ready(function() {
    $('#example').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": "../Pakainfo.com/admin/datatable.php"
    } );
} );

Datatable demo (server side) in php

	

	

		

			

				
Name
				
ID
	
			
		
		

			

				
Name
				
ID
			
		
	
	

datatables server side processing with post example

This example shows a very simple data table, matching the columnDefs other examples, but in this instance all the column display using server-side processing.

if (typeof access_token != 'undefined')
{
$("#example-csvtavle").show();
$('#example').show();
	$('#example').DataTable( {
		"ajax":  mynewurl,
		dom: 'Bfrtip',
		buttons: [
            {
                extend: 'csv',
                text: 'Export To Csv'
            }
        ],
		"columns": [
			{ "data": "name" },
			{ "data": "id" }
		],
		"columnDefs": [ {
			"targets": -1,
			"className": 'mdl-data-table__cell--non-numeric',
			"data": null,
			"defaultContent": "Click!"
		} ]

	} );
}
else{
	alert("Please Login First");
}

Show JSON Data in Jquery Datatables Example

See DataTables.net for more information about the reload method

var example = $('#example').DataTable({
  'ajax': {
    "type"   : "POST",
    "url"    : '/path/to/your/Pakainfo.com',
    "data"   : function( d ) {
      d.example_key1= $('#example_input1').val();
      d.example_key2= $('#example_input2').val();
      d.example_key3= $('#example_input3').val();
    },
    "dataSrc": ""
  },
  'columns': [
    {"data" : "name"},
    {"data" : "type"},
    {"data" : "time"},
    {"data" : "durat"}
  ]
});

//To Reload The Ajax
example.ajax.reload()

Example