Gird paging and searching.

[AtulDawkhare]

Hi there,
I have Grid with paging. It's working very fine. Now I have added Search / filter to my Gird.

Now my query is, Searching is preformed only on the the current page.
e.g. If there are 10 pages and I am on 1st page. If entered any keyword in search box, it searched only in the current page ONLY i.e on 1st page. Even if the record is present on the 8th or any other pages, the searched result show no record found.

Also One thing I want to mentioned here is, It is client / local Paging.

Please suggest me , how will I get full Or complete store? So that I can pass the store object to the following code.


Code:-
I have used "LiveSearchGridPanel.js"



me.store.each(function(record, idx) {
var td = Ext.fly(me.view.getNode(idx)).down('td'),
cell, matches, cellHTML;
while(td) {
cell = td.down('.x-grid-cell-inner');
matches = cell.dom.innerHTML.match(me.tagsRe);
cellHTML = cell.dom.innerHTML.replace(me.tagsRe, me.tagsProtect);

// populate indexes array, set currentIndex, and replace wrap matched string in a span
cellHTML = cellHTML.replace(me.searchRegExp, function(m) {
count += 1;
if (Ext.Array.indexOf(me.indexes, idx) === -1) {
me.indexes.push(idx);
}
if (me.currentIndex === null) {
me.currentIndex = idx;
}
return '<span class="' + me.matchCls + '">' + m + '</span>';
});
// restore protected tags
Ext.each(matches, function(match) {
cellHTML = cellHTML.replace(me.tagsProtect, match);
});
// update cell html
cell.dom.innerHTML = cellHTML;
td = td.next();
}
}, me);


29988

[dogomatic]

If want search and also have enough data to need paging, I think you want to use Ext.ux.data.PagingMemoryProxy, and treat it like it's a remote store, ie, when you want to search, set a filter on the store and call store.load().

[AtulDawkhare]

Hi there,
Thanks for the reply.

Yes I have used the "Ext.ux.PagingMemoryProxy" for pagination. And for Search I am using "Ext.ux.LiveSearchGridPanel" something like



var grid2 = Ext.create('Ext.ux.LiveSearchGridPanel', { width: 700, errorSummary:false, height: 500, title: 'Project In Line Listing Grid', store: store2, disableSelection: true, loadMask: true,



in the LiveSearchGridPanel there is method which does searching.



onTextFieldChange: function() {
var me = this,
count = 0;




Here I am not getting full / Complete Store, instead it returns store object with current page data ONLY.

I tried, to get the Grid object and the calling getStore method, but still it returns only current page data.



grid = me.getGridPanel();



Please suggest me what can be done in the onTextFieldChange method so that I will get complete store.

Please correct me If i am wrong anywhere.

[dogomatic]

So, live search finds rows in the grid that matches the search and selects them.

That's not compatible with paging, because rows on other pages are not loaded and therefore can't be selected.

You need to choose either live search or paging but not both. If you choose paging, you can use regular filters to do the same thing. The way it shows the results won't be exactly the same though. When you search, instead of selecting, all other rows will disappear except the ones that match your query.

Basically you want something like this:



onTextFieldChange: function() {
var me = this,
count = 0;

// ....
if (me.searchValue !== null) {
me.searchRegExp = new RegExp(me.searchValue, 'g' + (me.caseSensitive ? '' : 'i'));


me.store.filterBy(new Ext.util.Filter({
filterFn: function(record) {
//look through the record to see if its fields match the regex
}
}
}