0
在我的ASP.Net MVC3 Razor項目。我必須實現Jqgrid列出我的員工細節。因此，從本教程Using jQuery Grid With ASP.NET MVC我已創建行動爲我的員工Class.Now的問題是，我的看法頁面未呈現jqGrid的腳本file.Form Chrome瀏覽器文件發現該錯誤是在ASP.Net MVC3中的JqGrid類型錯誤Razor
未捕獲typeerror對象沒有方法jqgrid
我附上我的瀏覽器輸出。 
我的控制器代碼
[HttpGet]
public ActionResult ViewEmployeeData()
{
return View();
}
[HttpPost]
public ActionResult ViewEmployeeData(string Eord, string Empid, int page, int rows)
{
ElixirERPContext empdata = new ElixirERPContext();
var query = from emp in empdata.EmpData
select emp;
var count = query.Count();
var resultquery = new
{
tottal = 1,
page = page,
records = count,
rows = query.Select(x => new { x.EmpId, x.FirstName, x.MiddleName, x.LastName, x.Address, x.DateOfJoining, x.Department, x.Position }).ToList()
.Select(x => new { id = x.EmpId,Date=x.DateOfJoining, cell = new string[] { x.EmpId.ToString(), x.FirstName, x.MiddleName, x.LastName, x.Address, x.DateOfJoining.ToString(), x.Department, x.Position } }).ToArray(),
};
return Json(resultquery, JsonRequestBehavior.AllowGet);
//return View();
}
當我使用調試它不進入ITO腳本section.ie，僅僅只渲染視圖頁面。
佈局頁面
<!DOCTYPE html>
<html>
<head>
<META Http-Equiv="Cache-Control" Content="no-cache">
<META Http-Equiv="Pragma" Content="no-cache">
<META Http-Equiv="Expires" Content="0">
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/ui.jqgrid.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/ui.multiselect.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/css/datepicker.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/css/daterangepicker.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/css/font-alpona.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/css/bootstrap.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/css/prettify.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/css/styles.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/css/bootstrap-reset.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/ico/favicon.ico")" rel="SHORTCUT ICON" type="image/ico" />
<link href="@Url.Content("~/Content/ico/apple-touch-icon-144-precomposed.png")" rel="apple-touch-icon-precomposed" sizes="144x144" type="image/png" />
<link href="@Url.Content("~/Content/ico/apple-touch-icon-114-precomposed.png")" rel="apple-touch-icon-precomposed" sizes="114x114" type="image/png" />
<link href="@Url.Content("~/Content/ico/apple-touch-icon-72-precomposed.png")" rel="apple-touch-icon-precomposed" sizes="72x72" type="image/png" />
<link href="@Url.Content("~/Content/ico/apple-touch-icon-57-precomposed.png")" rel="apple-touch-icon-precomposed" type="image/png" />
<script src="@Url.Content("~/Scripts/jquery-1.5.2.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/i18n/grid.locale-en.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/jquery.js")" type="text/javascript"></script>
@*<script src="@Url.Content("~/Scripts/js/jbootstrap.min.js")" type="text/javascript"></script>*@
<script src="@Url.Content("~/Scripts/js/jquery-ui-1.10.3.custom.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/bootstrap.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/prettify.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/jquery.nicescroll.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/jquery.cookie.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/jquery.hoverIntent.minified.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/jquery.dcjqaccordion.2.7.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/jquery.sparkline.min.js")" type="text/javascript"></script>
<script src="https://www.google.com/jsapi" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/js/common-script.js")" type="text/javascript"></script>
</head>
<body>
<div class="main-wrapper">
<div class="scroll-top">
<a href="#" class="tip-top" title="Go Top"><i class="icon-arrow-up"></i></a>
</div>
@*Top Bar*@
<div class="top-bar">
<div class="container">
<div class="row">
<div class="col-sm-4 col-md-4">
<a href="#" class="left-toggle"><i class="icon-menu-2 "></i></a>
<!-- LOGO -->
<div class="branding">
<a href="#">
<img src="@Url.Content("~/Content/images/alpona-logo.png")" alt="Alpona Logo"></a>
</div>
</div>
<div class="col-sm-4 col-md-4 responsive-notification-mnu">
<!---Edited Content Folder Id Top bar Notice-->
</div>
<div class="col-sm-4 col-md-4 clearfix responsive-log-mnu">
<!-- ADMIN DRODOWN MENU -->
<div class="loged-nav pull-right">
<ul class="clearfix">
<li class="log-nav dropdown pull-right"><a class="dropdown-toggle clearfix" data-toggle="dropdown">
<span class="pull-left loged-user-name">Admin</span><span class="logged-user-thumb pull-right"><img class="img-circle" src="@Url.Content("~/Content/images//admin-avatar.jpg")" alt="Admin"></span></a>
<div class="dropdown-menu">
<ul class="pull-right">
<li><a href="#">[email protected]</a></li>
<li><a href="#">Edit Profile</a></li>
<li><a href="#">Inbox</a></li>
<li class="divider"></li>
<li><i class="icon-lock-3"></i>@Html.ActionLink("Logout", "Logout", "Home", new {@class="logout-link" })</li>
</ul>
</div>
@*<li><i class="icon-user"></i>@Html.TextBoxFor(Model => Model.UserName, new { @class = "login-user-input", autocomplete = "off",placeholder="User Name" })</li>*@
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
@*Left-Nav-Menu*@
<div class="left-bar merge-left">
<div class="left-nav">
@RenderSection("leftnav",required:false)
</div>
</div>
<div class="main-container">
<div class="container">
@RenderBody()
</div>
</div>
</div>
</body>
</html>
員工數據VEW頁
@{
ViewBag.Title = "ViewEmployeeData";
Layout = "~/Views/Shared/_LayoutUser.cshtml";
}
@* Script For Jqgrid*@
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("#list").jqGrid({
url: '/Home/ViewEmployeeData',
datatype: 'json',
mtype: 'GET',
colNames: ['EmpId', 'FirstName', 'MiddleName', 'LastName', 'Address', 'DateOfJoining', 'Department', 'Position'],
colModel: [
{ name: 'EmpId', index: 'EmpId', width: 40, align: 'left' },
{ name: 'FirstName', index: 'FirstName', width: 40, align: 'left' },
{ name: 'MiddleName', index: 'MiddleName', width: 200, align: 'left'},
{ name: 'LastName', index: 'LastName', width: 200, align: 'left'},
{ name: 'Address', index: 'Address', width: 200, align: 'left'},
{ name: 'DateOfJoining', index: 'DateOfJoining', width: 200, align: 'left'},
{ name: 'Department', index: 'Department', width: 200, align: 'left'},
{ name: 'Position', index: 'Position', width: 200, align: 'left'}],
pager: jQuery('#pager'),
width: 660,
height: 'auto',
rowNum: 10,
rowList: [5, 10, 20, 50],
sortname: 'EmpId',
sortorder: "desc",
viewrecords: true,
caption: 'Employee Information'
});
});
</script>
<h2>ViewEmployeeData</h2>
<table id="list" ></table>
<div id="pager"></div>
你可以添加html源代碼嗎？ –
首先檢查jqgrid相關的JS文件是否在加載視圖時加載 – rt2800
@VolodymyrBilyachat添加兩個文件 – Nidheesh