Server Side Processing with action columnDefs For Action on Row

Script ==>

<script>
$(document)
.ready(
function() {
$.fn.dataTable.ext.errMode = 'throw';
/*********Now Calling allUsers On Post *******/
var loginhistoryTable = $('#loginHistory').DataTable(
{
"processing" : true,
"serverSide" : true,
"destroy" : true,
"encode" : true,
"async" : false,
"ordering" : true,
 "searching": false,
"ajax" : {
"url" : "searchAllUser",
"data" : function(data) {

var req={
"pillar_id"('#pillar_id').val(),
"state_id"('#state_id').val(),
"district_id"('#district_id').val(),
"policeStationCode"('#policeStationCode').val()

};
data.userList=req;
 
return JSON.stringify(data);
},
error: function (xhr, error, thrown) {
},
"type" : "POST",
"dataType" : "json",
"beforeSend" : function(xhr) {
xhr.setRequestHeader("Accept","application/json";
xhr.setRequestHeader("Content-Type","application/json";
xhr.setRequestHeader('X-CSRF-Token',$('#secureToken').val());
},
},



"columns" : [
{
"data" : "userName",
"render": function(data, type, full, meta) {

        return meta.settings._iDisplayStart+meta.row+1;
      }
},
{
"data" : "userName"
},
{
"data" : "loginId"
},
{
"data" : "userLevel"
},
{
"data" : "userTypeDescription"
},
{
"data" : "pillarDesc"
},{
"data" : "emailId"
},
{
"data" : "stateDesc"
},{
"data" : "districtDesc"
},
{
"data" : "policeStationDesc"
},
{
"data" : "lastLoginDate"
}
],
"columnDefs" : [

{
"render" : function(data, type, row) {
var status = "Update Password";

return '<button class="btn btn-primary" onclick=updateUserPassword("'
+ row.loginId+ '">'
+ status
+ '</button>';

},
"targets" : 11,
'checkboxes' : {
'selectRow' : true
}
}
],

});
var tokens = GetNewToken();
$("#secureToken".val(tokens);


$("#Submit".on('click',function(){
loginhistoryTable.ajax.reload();
$("#allusersdetailsid".show();
});



</script>

HTML ==>


<div class="table-responsive " style="margin: 10px">
<table class="table table-striped table-bordered " id="loginHistory">
<thead>
<tr>
<th>S. No.</th>
<th>User Name</th>
<th>Login Id</th>
<th>User Level</th>
<th>User Type</th>
<th>Pillar Name</th>
<th>Email Id</th>
<th>State</th>
<th>District</th>
<th>Police Station</th>
<th>Last Login Date</th>
        <th>Action</th>
</tr>
</thead>

</div>

Comments

Popular posts from this blog

datatable with both top and bottom scroll bar.

Display Loader and disable page while waiting for ajax request

Remove GIT integration from VSCode