I would like to fill jTable with records from ajax call. Records are in JSON format, like this:
{
"Result":"OK",
"Records":[
{"PersonId":1,"Name":"Benjamin Button","Age":17,"RecordDate":"\/Date(1320259705710)\/"},
{"PersonId":2,"Name":"Douglas Adams","Age":42,"RecordDate":"\/Date(1320259705710)\/"},
{"PersonId":3,"Name":"Isaac Asimov","Age":26,"RecordDate":"\/Date(1320259705710)\/"},
{"PersonId":4,"Name":"Thomas More","Age":65,"RecordDate":"\/Date(1320259705710)\/"}
]
}
Function which makes the call:
$("#btnSearchOffer").click(function () {
$.ajax({
method: 'post',
url: '/SalesOfferInvoiceDeliveryNote/SearchOffers/',
data: {
cORAC_NUM: $("#inputORAC_NUM").val(),
cORAC_DAT_FROM: $("#inputORAC_DAT_FROM").val(),
cORAC_DAT_TO: $("#inputORAC_DAT_TO").val(),
cORAC_STA: $("#selectORAC_STA option:selected").val(),
iACCO_KEY: $("#hiddenACCO_KEY").val(),
iUSER_KEY: $("#hiddenUSER_KEY").val()
},
success: function (response) {
if (response.Result === "OK") {
//here I would like to fill jTable with data (what I've tried here
//it's not working):
$('#tblOffers').jtable().listAction = response;
}
},
error: function (response) {
alert(response);
}
});
});
I need to fill jTable with button press, because all of parameters from text fields needs to be included in the ajax call:
Table looks like this:
$('#tblOffers').jtable({
title: 'Pregled ponudb',
paging: true,
pageSize: 20,
sorting: true,
defaultSorting: 'cORAC_NUM DESC',
actions: {
listAction: "/SalesOfferInvoiceDeliveryNote/SearchOffers/"
},
messages: {
serverCommunicationError: 'Napaka!',
loadingMessage: 'Nalagam...',
noDataAvailable: 'Ni podatkov!'
},
fields: {
cORAC_NUM: {
key: true,
title: 'Št. ponudbe'
},
cORAC_DAT: {
title: 'Datum'
},
cACCO_NME: {
title: 'Kupec'
},
ORAC_GRO_SUM: {
title: 'Za plačilo'
}
}
});
By using load
method you can send your data to listAction
. Following is the example(asp.net web form c#) code.
Client side:
//Re-load records when user click 'Search Offer' button.
$('#btnSearchOffer').click(function (e) {
e.preventDefault();
$('#tblOffers').jtable('load', {
cORAC_NUM: $("#inputORAC_NUM").val(),
cORAC_DAT_FROM: $("#inputORAC_DAT_FROM").val()
});
});
And in server side you can receive data:
[WebMethod(EnableSession = true)]
public static object SearchOffers(string cORAC_NUM, int cORAC_DAT_FROM, int jtStartIndex, int jtPageSize, string jtSorting)
{
//handle null for all parameters
}
I have not added your all parameters. Hope you will understand the code. Let me know if you need any help.