Хорошо, поэтому я настроил пример рабочего репозитория относительно вашей проблемы здесь .Вы можете клонировать этот репозиторий и поэкспериментировать с ним.Я жестко закодировал ваши List<Company1> listcomp = new List<Company1>(); с предопределенными значениями, но предполагается, что ваши данные из базы данных будут аналогичны моим жестко закодированным значениям.
Я показываю вам связанные Model, View и Contoller код и образец из приложения.
Обратите внимание, что я использую ссылки CDN для ваших файлов js и css:
Ваш Model будет выглядеть следующим образом:
using System;
namespace DataTablesExample
{
public class Company1
{
public int CompanyID { get; set; }
public string CompanyName { get; set; }
public string CompanyCode { get; set; }
public int Wecare_companyId { get; set; }
public int LicenseCount { get; set; }
public bool active { get; set; }
public int ModifiedBy { get; set; }
public DateTime Lastmodifiedon { get; set; }
//Adding a string datetime since it is easier to manipulate in backend
public string Lastmodifiedonstring { get; set; }
}
}
Ваш Controller будет выглядеть следующим образом:
using System;
using System.Collections.Generic;
using System.Globalization;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace DataTablesExample.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public JsonResult get_date()
{
List<Company1> listcomp = new List<Company1>();
//This is how you are setting your company list. I will show you a basic example by adding hardcoded values
//DataSet ds = db2layer.show_data();
//foreach (DataRow dr in ds.Tables[0].Rows)
//{
// listcomp.Add(new Company1
// {
// CompanyID = Convert.ToInt32(dr["CompanyID"]),
// CompanyName = dr["CompanyName"].ToString(),
// CompanyCode = dr["CompanyCode"].ToString(),
// Wecare_companyId = Convert.ToInt32(dr["Wecare_companyId"]),
// LicenseCount = Convert.ToInt32(dr["LicenseCount"]),
// active = Convert.ToBoolean(dr["active"]),
// ModifiedBy = Convert.ToInt32(dr["ModifiedBy"]),
// Lastmodifiedon = Convert.ToDateTime(dr["Lastmodifiedon"])
// });
//}
listcomp.Add(new Company1
{
CompanyID = 1,
CompanyName = "Company 1",
CompanyCode = "C1",
Wecare_companyId = 1,
LicenseCount = 1,
active = true,
ModifiedBy = 1,
Lastmodifiedon = DateTime.Now,
Lastmodifiedonstring = DateTime.Now.ToString("dd/M/yyyy", CultureInfo.InvariantCulture)
});
listcomp.Add(new Company1
{
CompanyID = 2,
CompanyName = "Company 2",
CompanyCode = "C2",
Wecare_companyId = 2,
LicenseCount = 2,
active = true,
ModifiedBy = 1,
Lastmodifiedon = DateTime.Now,
Lastmodifiedonstring = DateTime.Now.ToString("dd/M/yyyy", CultureInfo.InvariantCulture)
});
listcomp.Add(new Company1
{
CompanyID = 3,
CompanyName = "Company 3",
CompanyCode = "C3",
Wecare_companyId = 1,
LicenseCount = 3,
active = true,
ModifiedBy = 1,
Lastmodifiedon = DateTime.Now,
Lastmodifiedonstring= DateTime.Now.ToString("dd/M/yyyy", CultureInfo.InvariantCulture)
});
var data = listcomp;
return Json(listcomp, JsonRequestBehavior.AllowGet);
}
}
}
И, наконец, ваш View будет выглядеть следующим образом:
@{
ViewBag.Title = "Home Page";
Layout = null;
}
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
@*<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<script src="~/Scripts/jquery-3.4.1.js"></script>
<link href="~/Content/bootstrap4.min.css" rel="stylesheet" />
<script src="~/Scripts/DataTables/jquery.dataTables.min.js"></script>
<script src="~/Scripts/DataTables/dataTables.bootstrap4.min.js"></script>*@
<!-- CDN LINKS-->
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/4.3.1/cerulean/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
</head>
<body>
<div class="jumbotron">
<h1>DataTable Example</h1>
<p class="lead">A project dedicated to data table example in MVC</p>
</div>
<br />
<center>
<div style="width: auto; border: 1px solid black; padding: 3px" ;>
<table id="dataTable">
<thead>
<tr>
<th>Company ID</th>
<th>Company Name</th>
<th>Company Code</th>
<th>WeCare Company ID</th>
<th>License Count</th>
<th>Active</th>
<th>Modified By</th>
<th>Last Modified On</th>
<th>Last Modified On Server String</th>
</tr>
</thead>
</table>
</div>
</center>
<script type="text/javascript">
$(document).ready(function () {
$.ajax({
"url": "@Url.Action("get_date", "Home")",
"method": "post",
"dataType" : "json",
success: function (data) {
$('#dataTable').DataTable({
paging: true,
sort: true,
searching: true,
scrollY: 200,
data:data,
columns: [
{ 'data': 'CompanyID'},
{ 'data': 'CompanyName' },
{ 'data': 'CompanyCode' },
{ 'data': 'Wecare_companyId' },
{ 'data': 'LicenseCount' },
{ 'data': 'active' },
{ 'data': 'ModifiedBy' },
{
'data': 'Lastmodifiedon'
//'render': function (jsonDate) {
// var date = new Date(parseInt(jsonDate.substr(13)));
// var month = date.getMonth() + 1;
// return month + "/" + date.getDate() + "/" + date.getFullYear();
//}
},
{ 'data': 'Lastmodifiedonstring' }
]
});
}
});
});
</script>
</body>
</html>
Пример вывода из приложения:
Если вы заметите последние два поля в выводе, вы увидите, что одно поле является неотформатированным полем DateTime, отправленным измодель, а другое поле представляет собой отформатированное поле DateTime в строку Date.Это потому, что для DataTables требуется поле Date для отображения значений.Здесь у вас есть две опции:
Вы можете либо преобразовать поле DateTime в вашем методе Controller в форматированную строку Date и отправить его View.Это то, что я делаю, и последнее поле вывода (Последнее изменение на строке сервера).Я бы предпочел этот метод, потому что C # предоставляет эффективные методы для форматирования вашего DateTime в Date в нужном вам формате.
Другой вариант - отправить ваше значение DateTimeна ваш DataTable и отформатируйте его там в соответствии с вашими потребностями.Я не опробовал этот метод, но чувствую, что он может вызвать потенциальные проблемы при отображении вашей ценности.
Надеюсь, это поможет вам.
Приветствия!