Hi all:
I have been using the free version of this grid for a little while and I love it...until today.
I am trying to pump the json result from a controller method into the grid in another view in my app (as I've done in about 6 other instances without issue) , but this time, the json is the only thing rendered in the browser. I've even gone so far as to copy a working instance of pqgrid into the view in question and it works just fine. From here, I edit the grid declaration to meet the requirements of the view and BAM!, right back to square one with raw json.
Here's the code:
CONTROLLER (attempts):
public ActionResult <method name>(int id)
{
List<usp_ProcToReturnData_Result> d = db.usp_ProcToReturnData(id).ToList();
StringBuilder sb = new StringBuilder(@"{""data"":");
JavaScriptSerializer js = new JavaScriptSerializer();
String json = js.Serialize(d);
sb.Append(json);
sb.Append("}");
return this.Content(sb.ToString(), "text/text");
}
public JsonResult <method name>(int id)
{
try
{
var result = db.usp_ProcToReturnData(id).ToList();
return new JsonResult() {Data = result, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
}
catch
{
return new JsonResult() {Data = "", JsonRequestBehavior = JsonRequestBehavior.AllowGet };
}
}
VIEW:
...
<div class="row">
<div id="grid_SchoolData"></div>
</div>
...
<script>...
$(function () {
var obj = {
width: 580,
height: 700,
wrap: false,
hwrap: false,
editable: false,
showTop: false,
showBottom: false,
collapsible: false,
showHeader: true,
resizable: true,
columnBorders: true,
rowBorders: true,
flexHeight: true,
virtualX: false,
sortable: false,
numberCell: { show: true },
filterModel: { mode: "AND", header: true },
scrollModel: { autoFit: true, pace: 'optimum' },
selectionModel: { type: 'row', mode: 'single' },
title: "Report Periods",
colModel: [
{ title: "SchoolId", dataType: "integer", dataIndx: "SchoolId", hidden: true },
{ title: "SchoolName", dataType: "string", dataIndx: "SchoolName" },
{ title: "HasData", dataType: "integer", dataIndx: "HasData", hidden: true },
{
title: "", editable: false, sortable: false, width: 100, align: "center", render: function (ui) {
var rowData = ui.rowData;
if (rowData['HasData'] === 1) {
return "<input type='image' src='../../images/glyphicon_refresh_200x200.png' onClick=\"location.href='/Admin/DeleteUploadedData/SchoolId=" + rowData.SchoolId + "&ReportPeriodId=" + rowData.ReportPeriodId + "';\" title='Reset Data' width='20' height='20'>";
}
}
}
],
dataModel: {
dataType: "JSON",
location: "remote",
recIndx: "SchoolId",
url: "/Admin/ResetUploadByReportPeriod/" + window.location.href.substring(window.location.href.lastIndexOf('/') + 1),
getData: function (dataJSON) {
return { data: dataJSON };
}
},
pageModel: { type: 'local', rPP: 50 }
}
var grid = $("#grid_SchoolData").pqGrid(obj);
});
Please advise!
Thanks!