Jqgrid search toolbar filter unique drop lists
I've used the example from this post and it works great to create a unique drop list in the search tool bar based on the column data. However, if I have more than one page of data then the drop list is only populated from the first page. I'm new to jquery and jqgrid and have not been able to find a solution to this. Any idea's?
Thanks.
Here is the code copied from the post linked above.
var mydata = [
{id:"1", Name:"Miroslav Klose", Category:"sport", Subcategory:"football"},
{id:"2", Name:"Michael Schumacher", Category:"sport", Subcategory:"formula 1"},
{id:"3", Name:"Albert Einstein", Category:"science", Subcategory:"physics"},
{id:"4", Name:"Blaise Pascal", Category:"science", Subcategory:"mathematics"}
],
grid = $("#list"),
getUniqueNames = function(columnName) {
var texts = grid.jqGrid('getCol',columnName), uniqueTexts = [],
textsLength = texts.length, text, textsMap = {}, i;
for (i=0;i<textsLength;i++) {
text = texts[i];
if (text !== undefined && textsMap[text] === undefined) {
// to test whether the texts is unique we place it in the map.
textsMap[text] = true;
uniqueTexts.push(text);
}
}
return uniqueTexts;
},
buildSearchSelect = function(uniqueNames) {
var values=":All";
$.each (uniqueNames, function() {
values += ";" + this + ":" + this;
});
return values;
},
setSearchSelect = function(columnName) {
grid.jqGrid('setColProp', columnName,
{
stype: 'select',
searchoptions: {
value:buildSearchSelect(getUniqueNames(columnName)),
sopt:['eq']
}
}
);
};
grid.jqGrid({
data: mydata,
datatype: 'local',
colModel: [
{ name:'Name', index:'Name', width:200 },
{ name:'Category', index:'Catego开发者_开发技巧ry', width:200 },
{ name:'Subcategory', index:'Subcategory', width:200 }
],
sortname: 'Name',
viewrecords: true,
rownumbers: true,
sortorder: "desc",
ignoreCase: true,
pager: '#pager',
height: "auto",
caption: "How to use filterToolbar better locally"
}).jqGrid('navGrid','#pager',
{edit:false, add:false, del:false, search:false, refresh:false});
setSearchSelect('Category');
setSearchSelect('Subcategory');
grid.jqGrid('setColProp', 'Name',
{
searchoptions: {
sopt:['cn'],
dataInit: function(elem) {
$(elem).autocomplete({
source:getUniqueNames('Name'),
delay:0,
minLength:0
});
}
}
});
grid.jqGrid('filterToolbar',
{stringResult:true, searchOnEnter:true, defaultSearch:"cn"});
If you use the datatype: 'local'
you have the information which you need already in mydata
. Alternative you can use var gridData = grid[0].p.data
or which is the same var gridData = grid.jqGrid('getGridParam','data')
to get the grid contain of all grid pages. So instead of textsLength
and texts[i]
in the getUniqueNames
function you could use gridData.length
and gridData[columnName]
or String(gridData[columnName])
.
You will have to send the list to the page outside of jqgrid. jqgrid will only pull a page at a time and does not know about all your other data if you are using it in ajax mode.
If this is just a matter of using the mydata that you have above and the data is all in the scope of js, but just on another page (result set on jqgrid) why dont you build the list and use that in place of the var called texts. You are only going over the page data, not all the data you load in. Does this make sense?
精彩评论