update table data using ajax
update table data using ajax
How can I upadte table data using ajax json source when you click a button?
I coundn't find out by myself ;-(
please let me know...
Thank you in advence.
This is json data.
[code]
{
"aaData": [
{
"id": "23",
"Item_Number": "2060914",
},
{
"id": "78",
"Item_Number": "2060914",
},
{
"id": "62",
"Item_Number": "2060914",
}
]
}
[/code]
This is I've been trying script of after clicking "find" button.
[code]
jQuery(function(){
jQuery(".find")
.click(function(e) {
jQuery.ajax({
type: "POST",
url: "./data.json.cgi",
data: {
item_id: jQuery("#item_id").attr("value"),
Item_Number: jQuery("#Item_Number").attr("value"),
},
timeout: 1000,
dataType: "json",
success: function(data){
jQuery('#table_id').dataTable({
"bDestroy": true,
"bPaginate": false,
"bJQueryUI": true,
"bProcessing": true,
"bDeferRender": true,
"bServerSide": true,
"sAjaxSource": data,
"aoColumns": [
{ "sTitle": "ID", "mData": "id" },
{ "sTitle": "Number", "mData": "Item_Number" },
{ "sTitle": "Grade", "mData": null }
],
});
},
error: function(XMLHttpRequest, textStatus, errorThrown){
alert(textStatus + ":::::" + errorThrown);
},
});
e.preventDefault();
})
});
[/code]
I coundn't find out by myself ;-(
please let me know...
Thank you in advence.
This is json data.
[code]
{
"aaData": [
{
"id": "23",
"Item_Number": "2060914",
},
{
"id": "78",
"Item_Number": "2060914",
},
{
"id": "62",
"Item_Number": "2060914",
}
]
}
[/code]
This is I've been trying script of after clicking "find" button.
[code]
jQuery(function(){
jQuery(".find")
.click(function(e) {
jQuery.ajax({
type: "POST",
url: "./data.json.cgi",
data: {
item_id: jQuery("#item_id").attr("value"),
Item_Number: jQuery("#Item_Number").attr("value"),
},
timeout: 1000,
dataType: "json",
success: function(data){
jQuery('#table_id').dataTable({
"bDestroy": true,
"bPaginate": false,
"bJQueryUI": true,
"bProcessing": true,
"bDeferRender": true,
"bServerSide": true,
"sAjaxSource": data,
"aoColumns": [
{ "sTitle": "ID", "mData": "id" },
{ "sTitle": "Number", "mData": "Item_Number" },
{ "sTitle": "Grade", "mData": null }
],
});
},
error: function(XMLHttpRequest, textStatus, errorThrown){
alert(textStatus + ":::::" + errorThrown);
},
});
e.preventDefault();
})
});
[/code]
This discussion has been closed.
Replies
Allan
Thank you very much!!
I'll try this plug-in.
How good community ;-)
Allan
Just FYI, I did like in exsample below.
[code]
.click(function(e) {
oTable.fnClearTable();
oTable.fnReloadAjax("./data.cgi?aaa=1&bbb=2");
e.preventDefault();
}
[/code]