Hi,
I am using Datatables in an asp.net Project which uses c# and SQL DB. I have to display a huge amount of data, so I chose datatable instead of Gridview.In the application, I built, the user will inline edit some data in the table and that edited data will be stored in the DB. To achieve this I used jquery datatable editor and I am able to inline edit the rows but, couldn't able to retain the edited values. The controls are textboxes and dropdownlist in the datatable. can anyone help me with this?
below is my code
var editor; // use a global for the submit and return data rendering in the examples
$(document).ready(function () {
editor = new $.fn.dataTable.Editor({
ajax: "URL",
table: "#example",
idSrc: 'ID',
fields: [{
label: "Level,
name: "Level",
type: "select",
options: [
{ label: "No", value: 0 },
{ label: "Yes", value: 1 }
],
}, {
label: "Title",
name: "Title"
}
]
});
// Activate an inline edit on click of a table cell
$('#example').on('click', 'tbody td:not(:first-child)', function (e) {
editor.inline(this, {
onBlur: test
});
});
BindTable();
});
function BindTable() {
debugger;
$.ajax({
type: "POST",
url: "URL",
contentType: 'application/json; charset=utf-8',
dataType: 'json',
async: true,
cache: false,
beforeSend: function () {
$("#divresponseLoading").addClass("loadingGif");
},
success: function (result) {
var obj = $.parseJSON(result.d);
$("#example").DataTable({
responsive: true,
destroy: true,
bAutoWidth: true,
"aaData": obj,
"lengthMenu": [[100, 250, 500], [100, 250, 500]],
"aoColumns": [
{ "sTitle": "ID", "mData": "ID" },
{ "sTitle": "Name", "mData": "name" },
{ "sTitle": "Level", "mData": "LEVEL" },
{ "sTitle": "Title", "mData": "Title" },
],
});
},
error: function (error) {
AlertMessage("Unable to process data, please contact admin.");
},
complete: function () {
}
});
} /* End of table binding */
function test() {
alert('Test');
return true;
}