I'm trying to get a JqGrid to do some client-side filtering (and sorting) just after it has finished loading in the data. I can set the search-field correctly, but calling TriggerToolbar() doesn't seem to have any effect.
$("#list").GridUnload();
var mygrid = $("#list").jqGrid({
url: '@Url.Action("GetSearchCriteriaWithNoComponents", "SearchCriteria")',
postData: { BookingSiteId: function () { return $("#BookingSiteId option:selected").val(); }, MethodId: function () { return $("#MethodId option:selected").val(); } },
datatype: 'json',
mtype: 'Post',
colNames: ['Id', 'PID', 'Ori', 'Dest', 'Conn', 'Pos', 'Method', 'Billing', 'Filter', 'Pattern', 'Class', 'Wildcard', 'Components', 'Comment'],
colModel: [
{ name: 'Id', index: 'Id', width: 30, hidden: true },
{ name: 'PID', index: 'PID', width: 35 },
{ name: 'Ori', index: 'Ori', width: 35 },
{ name: 'Dest', index: 'Dest', width: 35 },
{ name: 'Conn', index: 'Conn', width: 35 },
{ name: 'Pos', index: 'Pos', width: 35 },
{ name: 'Method', index: 'Method', width: 50 },
{ name: 'Billing', index: 'Billing', width: 45, search: true, stype: 'text', searchoptions: { sopt: ['cn']} },
{ name: 'Filter', index: 'Filter', width: 90, search: true, stype: 'text', searchoptions: { sopt: ['cn']} },
{ name: 'Pattern', index: 'Pattern', width: 100, search: true, stype: 'text', searchoptions: { sopt: ['cn']} },
{ name: 'Class', index: 'Class', width: 40 },
{ name: 'Wildcard', index: 'Wildcard', width: 50 },
{ name: 'Components', index: 'Components', width: 80, search: true, stype: 'text', searchoptions: { sopt: ['cn']} },
{ name: 'Comment', index: 'Comment', width: 75, search: true, stype: 'text', searchoptions: { sopt: ['cn']} }
],
pager: '#pager',
rowNum: 25,
rowTotal: 1000,
rowList: [25, 50, 100],
sortname: 'Origin',
sortorder: "asc",
viewrecords: true,
loadonce: true,
multiselect: true,
ignoreCase: true,
gridview: true,
height: "100%",
caption: 'Subscribed Search Criteria without Components'
}).jqGrid('navGrid', '#pager', { add: false, edit: false, del: false, search: false, refresh: false }
).jqGrid('navButtonAdd', '#pager', { caption: "", buttonicon: "ui-icon-search", onClickButton: function () { mygrid[0].toggleToolbar() }, position: "first", title: "Toggle Search Toolbar", cursor: "pointer" })
.jqGrid('navButtonAdd', '#pager', { caption: "", buttonicon: "ui-icon-refresh", onClickButton: function () { mygrid[0].clearToolbar() }, title: "Clear Search Toolbar", cursor: "pointer" }
);
$("#list").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false });
if(firstrun = true)
{
$("#gs_PID").val('AA');
mygrid[0].triggerToolbar();
firstrun = false;
}
else
{
mygrid[0].toggleToolbar(); //hide the toolbar by default
}
The general idea is that the fixed value will be populated with something from the viewmodel.
We would also like to have the option of saving and restoring filter and sorting selection for when we do gridUnload() and subsequent reloads, but one hurdle at a time. stuff with @prefixes such as @Url.Action is Razor markup, which is handled before the page is sent to the browser.