{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 孤傲高冷的网名 的问题《Trirand jqGrid not showing up; TypeError: $(…).jqG》','https://www.manongdao.com/q-693615.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
Grid is not displaying, firefox console shows "TypeError: $(...).jqGrid is not a function".
ASP.NET MVC 5.2.2 Razor, jQuery 2.1.1, Trirand jqGrid 4.6.0
I've checked other similar questions, each time the problem seems different and it's either syntax or import declarations problem. Mine seem fine. All referenced scripts are in place. Wrapping it in $( document ).ready() event doesn't make any difference. Appreciate any help.
<script type="text/css" src="@Url.Content("~/Content/themes/sunny/jquery-ui.sunny.min.css")">
</script>
<script type="text/css" src="@Url.Content("~/Content/jquery.jqGrid/ui.jqgrid.css")">
</script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-2.1.1.min.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/i18n/grid.locale-en.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery.jqGrid.min.js")"></script>
<script>
$(function () {
$("#list").jqGrid({
url: "/Email/LoadDraftEmails/",
datatype: "json",
mtype: "GET",
colNames: ["Id", "Subject", "Sender name", "Sender e-mail", "Created", "Last saved"],
colModel: [
{ name: "ID", width: 50 },
{ name: "Subject", width: 200 },
{ name: "SenderName", width: 150 },
{ name: "SenderEmail", width: 150 },
{ name: "DateCreated", width: 150 },
{ name: "DateLatestSave", width: 150 }
],
pager: "#pager",
rowNum: 100,
rowList: [10, 20, 30],
sortname: "invid",
sortorder: "desc",
viewrecords: true,
gridview: true,
autoencode: true,
caption: "Draft emails"
});
});
</script>
<body>
<table id="list"><tr><td></td></tr></table>
<div id="pager"></div>
</body>
I suspect that what you have shown is only a small portion of the entire HTML that gets rendered. Maybe there's the Layout which contains some other scripts that are mixing up.
To make sure that this is not the case, turn off the Layout temporary and have the entire markup in your view:
This should normally work as expected. If this is the case you should then see what script references might be getting mixed up in your Layout and ensure that the rendered page will look as shown here.