我无法在我的MVC 4 Web应用程序视图中显示jqgrid。我在标准的html文档中测试了完全相同的视图代码,并且显示了网格,但是只有h2标记显示在我的索引视图中。我甚至设法将模型信息显示在html文档中,所以我真的很困惑为什么网格甚至不会加载到我的MVC视图中。
我的网格数据的控制器代码如下:
public ActionResult GridData()
{
var query = (from u in db.Users
join ur in db.User_Relationship on u.User_ID equals ur.Child_ID
join lu in db.Lookups on u.First_LanguageID equals lu.LookupID
join ut in db.User_Tests on u.User_ID equals ut.User_ID into ps
from ut in ps.DefaultIfEmpty()
where ur.Parent_ID == 45875
group new { u, lu } by new
{
u.User_ID, u.Forename, u.Surname, u.Client_Code,
u.User_Name, u.Password, u.Email, u.Gender,
u.Report_date, u.EmailDate, u.Job_Function,
lu.LookupValue
} into g
select new UserViewModel
{
User_ID = g.Key.User_ID,
Forename = g.Key.Forename,
Surname = g.Key.Surname,
Client_Code = g.Key.Client_Code,
User_Name = g.Key.User_Name,
Password = g.Key.Password,
Email = g.Key.Email,
Gender = g.Key.Gender,
Report_Date = g.Key.Report_date,
Email_Date = g.Key.EmailDate,
Job_Function = g.Key.Job_Function,
Lookup_Value = g.Key.LookupValue
});
var jsonData = new
{
total = 10,
page = 1,
records = 50,
rows = query.Select(x => new
{
x.User_ID, x.Forename, x.Surname, x.Client_Code, x.User_Name,
x.Password, x.Email, x.Gender, x.Report_Date, x.Email_Date,
x.Job_Function, x.Lookup_Value
}).ToList().Select(x => new
{
id = x.User_ID,
cell = new string[]
{
x.User_ID.ToString(),
x.Forename,
x.Surname,
x.Client_Code.ToString(),
x.User_Name,
x.Password,
x.Email,
x.Gender,
x.Report_Date.ToString(),
x.Email_Date.ToString(),
x.Job_Function,
x.Lookup_Value
}}).ToArray(),
};
return Json(jsonData, JsonRequestBehavior.AllowGet);
}
索引的方法如下:
public ActionResult Index()
{
return View();
}
我对Index.cshtml的查看代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.8.23.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function ()
{
jQuery("#list").jqGrid(
{
url: '/WebFormUserList/GridData',
datatype: 'json',
mtype: 'GET',
colNames:
[
'User_ID', 'Forename', 'Surname', 'Client_Code', 'User_Name',
'Password', 'Email', 'Gender', 'Report_Date', 'Email_Date',
'Job_Function', 'Lookup_Value'
],
colModel:
[
{ name: 'User_ID', index: 'User_ID', width: '50', align: 'centre' },
{ name: 'Forename', index: 'Forename', width: '50', align: 'centre' },
{ name: 'Surname', index: 'Surname', width: '50', align: 'centre' },
{ name: 'Client_Code', index: 'Client_Code', width: '50', align: 'centre' },
{ name: 'User_Name', index: 'User_Name', width: '50', align: 'centre' },
{ name: 'Password', index: 'Password', width: '50', align: 'centre' },
{ name: 'Email', index: 'Email', width: '50', align: 'centre' },
{ name: 'Gender', index: 'Gender', width: '50', align: 'centre' },
{ name: 'Report_Date', index: 'Report_Date', width: '50', align: 'centre' },
{ name: 'Email_Date', index: 'Email_Date', width: '50', align: 'centre' },
//{ name: 'Test_Count', index: 'Test_Count', width: '50', align: 'centre' },
//{ name: 'Test_Completed', index: 'Test_Completed', width: '50', align: 'centre' },
{ name: 'Job_Function', index: 'Job_Function', width: '50', align: 'centre' },
{ name: 'Lookup_Value', index: 'Lookup_Value', width: '50', align: 'centre' },
],
pager: jQuery('#pager'),
height: 'auto',
width: '1000',
rowNum: 10,
jsonReader: { repeatitems: false },
rowList: [5, 10, 20, 50],
sortname: 'Id',
sortorder: "desc",
viewrecords: true,
imgpath: '/css/ui-lightness/images',
caption: 'My first grid'
});
});
</script>
</head>
<body>
<h2>My Grid Data</h2>
<table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>
</body>
</html>
任何帮助都会非常感激,因为我不确定会出现什么问题。我很确定返回的json格式正确,因为html文档很乐意接受它。
我唯一的想法是,因为网格甚至不会加载,所以发生了一些事情来阻止它在MVC4的_layout.html中的创建。
再次,先谢谢。