User1509050366 posted
Hi
... Can someone please help me with JQuery datatables...
Problem - For some reason its not displaying data... No errors anywhere..
@model IEnumerable<SampleDataGrid.Models.ServiceType>
@{
Layout = null;
}
<div class="container">
<br />
<div style="width:90%; margin:0 auto;">
<table id="example" class="table table-striped table-bordered dt-responsive nowrap" width="100%" cellspacing="0">
<thead>
<tr>
<th>ServiceTypeId</th>
<th>ServiceTypeCode</th>
<th>ServiceTypeDesc</th>
<th>CreatedDate</th>
<th>CreatedBy</th>
<th>ModifiedDate</th>
<th>ModifiedBy</th>
</tr>
</thead>
</table>
</div>
</div>
@section scripts{
<script language="JavaScript" type="text/javascript" src="~/Scripts/jquery-3.4.1.js"></script>
<script language="JavaScript" type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script language="JavaScript" type="text/javascript" src="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css"></script>
<script type="text/javascript">
$(document).ready(function () {
var table = $("#example").DataTable({
"processing": true, // for show progress bar
"serverSide": true, // for process server side
"filter": true, // this is for disable filter (search box)
"orderMulti": false, // for disable multiple column at once
"ajax": {
"url": "/ServiceType/LoadData",
"type": "GET",
"datatype": "json"
},
"columnDefs":
[{
"targets": [0],
"visible": false,
"searchable": false
}
],
"columns": [
{ "data": "ServiceTypeId", "name": "ServiceTypeId", "autoWidth": true },
{ "data": "ServiceTypeCode", "name": "ServiceTypeCode", "autoWidth": true },
{ "data": "ServiceTypeDesc", "name": "ServiceTypeDesc", "autoWidth": true },
{ "data": "CreatedDate", "name": "CreatedDate", "autoWidth": true },
{ "data": "CreatedBy", "name": "CreatedBy", "autoWidth": true },
{ "data": "ModifiedDate", "name": "ModifiedDate", "autoWidth": true },
{ "data": "ModifiedBy", "name": "ModifiedBy", "autoWidth": true },
{
"render": function (data, type, full, meta)
{ return '<a class="btn btn-info" href="/DemoGrid/Edit/' + full.CustomerID + '">Edit</a>'; }
},
{
data: null, render: function (data, type, row) {
return "<a href='#' class='btn btn-danger' onclick=DeleteData('" + row.CustomerID + "'); >Delete</a>";
}
},
]
});
});
function DeleteData(CustomerID) {
if (confirm("Are you sure you want to delete ...?")) {
Delete(CustomerID);
}
else {
return false;
}
}
function Delete(CustomerID) {
var url = '@Url.Content("~/")' + "DemoGrid/Delete";
$.post(url, { ID: CustomerID }, function (data) {
if (data) {
oTable = $('#example').DataTable();
oTable.draw();
}
else {
alert("Something Went Wrong!");
}
});
}
</script>
}
ControllerCode
using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Entity;
using System.Linq;
using System.Net;
using System.Web;
using System.Web.Mvc;
using SampleDataGrid.Models;
using Microsoft.AspNetCore;
namespace SampleDataGrid.Controllers
{
public class ServiceTypesController : Controller
{
private mdl db = new mdl();
// GET: ServiceTypes
public ActionResult Index()
{
return View(db.ServiceTypes.ToList());
}
public ActionResult LoadData()
{
try
{
var draw = HttpContext.Request.Form["draw"].FirstOrDefault();
// Skiping number of Rows count
var start = Request.Form["start"].FirstOrDefault();
// Paging Length 10,20
var length = Request.Form["length"].FirstOrDefault();
// Sort Column Name
var sortColumn = Request.Form["columns[" + Request.Form["order[0][column]"].FirstOrDefault() + "][name]"].FirstOrDefault();
// Sort Column Direction ( asc ,desc)
var sortColumnDirection = Request.Form["order[0][dir]"].FirstOrDefault();
// Search Value from (Search box)
var searchValue = Request.Form["search[value]"].FirstOrDefault();
//Paging Size (10,20,50,100)
int pageSize = length != null ? Convert.ToInt32(length) : 0;
int skip = start != null ? Convert.ToInt32(start) : 0;
int recordsTotal = 0;
// Getting all Customer data
var customerData = (from tempcustomer in db.ServiceTypes
select tempcustomer);
////Sorting
//if (!(string.IsNullOrEmpty(sortColumn.ToString()) && string.IsNullOrEmpty(sortColumnDirection.ToString())))
//{
// customerData = customerData.OrderBy(sortColumn.ToString() + " " + sortColumnDirection.ToString());
//}
//Search
if (!string.IsNullOrEmpty(searchValue.ToString()))
{
customerData = customerData.Where(m => m.ServiceTypeCode == searchValue.ToString() || m.ServiceTypeDesc.ToString() == searchValue.ToString() || m.ServiceTypeId == searchValue);
}
//total number of rows count
recordsTotal = customerData.Count();
//Paging
var data = customerData.Skip(skip).Take(pageSize).ToList();
//Returning Json Data
return Json(new { draw = draw, recordsFiltered = recordsTotal, recordsTotal = recordsTotal, data = data });
}
catch (Exception)
{
throw;
}
}
