I am using Jquery DataTable Grid.
Here I am Making cells edit as in :
this Example.
Now If the column ‘Engine version’ has value “420”, Then i want to make the whole row read-only.
Please help me out.
Edit:
var oTable;
$(document).ready(function () {
oTable= $('#example').dataTable({
"bProcessing": false,
"bJQueryUI": true,
"sAjaxSource": "GetWebAlerts.aspx",
"sPaginationType": "full_numbers",
"aLengthMenu": [ 10,25,50,100,200,500 ],
"fnDrawCallback": function (oSettings) {
if (oSettings.bSorted || oSettings.bFiltered) {
if (oSettings.aoColumns[1].bVisible == true) {
for (var i = 0, iLen = oSettings.aiDisplay.length; i < iLen; i++) {
$('td:eq(0)', oSettings.aoData[oSettings.aiDisplay[i]].nTr).html(i + 1);
}
}
}
},
"aaSorting": [[3, "desc"]],
aoColumns: [
{ "bVisible": false, "bSortable": false, "aTargets": [0] },
{"sClass" : "left", "bVisible": true, "bSortable": false, "aTargets": [1] },
{ "bVisible": true, "bSortable": true, "aTargets": [2] },
{ "bVisible": true, "bSortable": true, "aTargets": [3] },
{ "bVisible": true, "sType": "num-html","bSortable": false,
"fnRender": function (oData, sVal) {
if (sVal.indexOf("OVERSPEED") >= 0) {
return "<span title='Overspeed = " + oData.aData[8] + " KM/H'>" + sVal + "(" + oData.aData[8] +" KM/H)</span>";
}
else if (sVal.indexOf("IDLING") >= 0) {
return "<span title='Idling from = " + oData.aData[8].split(";")[0] + " For "+ oData.aData[8].split(";")[1] + " Mins'>" + sVal + "("+ oData.aData[8].split(";")[1]+ " Mins)</span>";
}
else if(sVal.indexOf("Geofence In") >= 0)
{
return "<span>" + oData.aData[8] + "- IN</span>";
}
else if(sVal.indexOf("Geofence out") >= 0)
{
return "<span>" + oData.aData[8] + "- OUT</span>";
}
else {
return sVal;
}
}, "aTargets": [4], "asSorting": ["desc", "asc"] },
{ "bVisible": true, "bSortable": true, "aTargets": [5] },
{ "bVisible": true, "bSortable": true, "aTargets": [6] },
{ "bVisible": true, "bSortable": true, "aTargets": [7] }
]
}).makeEditable({
sUpdateURL: "UpdateWebData.aspx?i=0",
"aoColumns": [
null,
null,
null,
null,
{
indicator: 'Saving reason...',
tooltip: 'Click to select reason',
loadtext: 'loading...',
type: 'select',
onblur: 'submit',
data: "{'1':'Accident','2':'Battery Taken Out','3':'In Workshop','4':'Not In Operation','5':'Signal Lost','6':'Other'}"
},
{
},
null
],
sDeleteURL: "UpdateWebData.aspx?i=1",
oDeleteRowButtonOptions: { label: "Remove",
icons: {primary:'ui-icon-trash'}
},
});
});
This is my code.. I want to make readonly if the 5th number Json data from my page GetWebAlerts.aspx is “0”.
With out looking at your code I’ll try to explain how I would go about doing this.
In the JS where they enter the value, check if the input is engine version, and the value is 420.
If it is, add a class to that row called 420row.
Then in the function where it binds the on click to change to input, change the selector to add
:not('.420row').Again, if you post your code, or better yet make a jsfiddle, then I’ll be able to help you out better.