ext 1.0 alpha 3 compbox history-Ext JS
10602 ワード
hi all、
i'm working on a quicksearch field for the grid with a(limit)history
while it's far from perfect,i wanted to share the code with u
using the editor-grid and paging example:
［edit］
i made a followw up grid demo@http://ido.nl.eu.org/pir/
which has history complection and does both filtering and quicksearch
over a very large dataset.
[/edit]
デモ:http://ido.nl.eu.org/static/ext-1.0-...arch-grid.html
hoping to get it to work with explicity typing enter to get a query into history、
this way just type away to quickfind and explicitly remember a query for later.
(this would also make much sense to user who just put＜enter＞after everthing)
thanks to Jack for this new compbox to Playwith
#
2
03-08-2007,11:52 PM
It sounds cool.Let me know when you have a link to look at.
#
3
03-09-2007,06:59 AM
Modified editor grid example here:
http://ido.nl.eu.org/static/ext-1.0-...arch-grid.html
#
4
03-09-2007,07:29 AM
trbs--looks great…
small issue…if you type「sun」and wait a while…then using backspace to just「s」and write「show」then the history will contain both「sun」and「show」.Mayle it could be a configration parater.Soiyou.orefile the.solight.com.
#
5
03-09-2007,07:39 AM
Quote:
オリジナリティーPosted by
KimH
trbs--looks great…
small issue…if you type「sun」and wait a while…then using backspace to just「s」and write「show」then the history will contain both「sun」and「show」.Mayle it could be a configration parater.Soiyou.orefile the.solight.com.
yeah that's a known proble m
quicksearch shound filter the datastore as type(others wise it's not very)
quick:-)
but the history shuld be meaningfull and not contan everry variation one types.that's why i made it so it only remembers the longest unique line.
this brigs forward your issue,and is also terrible for typo's,eg;type'shows'while u mean'show'and the longer/bad search query is remembersed in history instead of the corectone.
that i s why i want to try and hook into keyup instead of beforequery for the history.making it so that the history would only rememberry's after u press＜enter＞in the search box.
#
6
03-09-2007,07:54 AM
I get
7
03-09-2007,07:58 AM
Quote:
オリジナリティーPosted by
アニマル
I get
Quote:
オリジナリティーPosted by
アニマル
and
#
8
03-09-2007,08:08 AM
Fixed the's hasのproperties'error…
Works fine with the RowSelection Model、still havn't got my finger on the undering problem with CelSelection Model…
but it works now、without errors、in Firefox/Firebug which is good enough for the demo gess:wink:
#
9
03-09-2007,02:52 PM
It woked great for me.I was wondering、can this work against a paged、remote data source.Well、I know it can…but does what work that way?In other wods,if I want this to work on a table that would have 100 k records I would not necessarlywant to load all of those records into the page.Ideas?
#
10
03-09-2007,03:38 PM
Quote:
オリジナリティーPosted by
lstrud
It woked great for me.I was wondering、can this work against a paged、remote data source.Well、I know it can…but does what work that way?In other wods,if I want this to work on a table that would have 100 k records I would not necessarlywant to load all of those records into the page.Ideas?
i build it for a paged grid、but it only filters thru the page not all the records in the store.
if you would like to show 20 records on a page but search chる100 k then＿i think
you shound take a look at Jack's atocomplection box.(forum-search)
Iggess my example could go as filtering the grid store server side and displaying all the rerererereaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaathethererererererererererererereaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaers.
Onese'm able to handle the onKeyUp events nivery in the search box it would make a nice feature for a grid appliation to dowhant on pressing nter in the search box.If the searrystraok).(read;if i build a separate component exted compending cobox instead of jusing it in the example)this could be something like an option on the search box.
I hope to get around to extending compbox to make something like a search box as soon as possible.
ジャック、mayboe it's an idea to add another parameter to Store.js?
so that we have something like:
To be able to do server side filtering of the store when datasets get really large.
This could also be usefull if you want to have a selectbox somehere else on the page or gridheader too only view records with a specific condition in the gride.
i'm working on a quicksearch field for the grid with a(limit)history
while it's far from perfect,i wanted to share the code with u
using the editor-grid and paging example:
［edit］
i made a followw up grid demo@http://ido.nl.eu.org/pir/
which has history complection and does both filtering and quicksearch
over a very large dataset.
[/edit]
デモ:http://ido.nl.eu.org/static/ext-1.0-...arch-grid.html
// header panel
var gridHead = grid.getView().getHeaderPanel();
gridHead.show();
var tb = new Ext.Toolbar(gridHead);
tb.add({
text: 'Quicksearch:',
tooltip: 'Quickly search through the overview.',
});
var sftb = tb.addDom({
tag: 'input',
id: 'quicksearch',
type: 'text',
size: 30,
value: '',
style: 'background: #F0F0F9;'
});
var searchStore = new Ext.data.SimpleStore({
fields: ['query'],
data: []
});
var searchBox = new fm.ComboBox({
store: searchStore,
displayField: 'query',
typeAhead: false,
mode: 'local',
triggerAction: 'all',
hideTrigger: true,
});
searchBox.applyTo('quicksearch');
tb.add({
text: 'X',
tooltip: 'Clear quicksearch',
handler: function() {
if (searchBox.getValue().length!=0) {
searchBox.setValue('');
ds.clearFilter();
}
}
});
var searchRec = Ext.data.Record.create([
{name: 'query', type: 'string'}
]);
var onFilteringBeforeQuery = function(e) {
if (this.getValue().length==0) {
ds.clearFilter();
} else {
var value = this.getValue().replace(/^\s+|\s+$/g, "");
if (value=="")
return;
ds.filterBy(function(r) {
valueArr = value.split(/\ +/);
for (var i=0; i<valueArr.length; i++) {
re = new RegExp(Ext.escapeRe(valueArr[i]), "i");
if (re.test(r.data['Title'])==false
&& re.test(r.data['Place'])==false
&& re.test(r.data['Remarks'])==false) {
return false;
};
}
return true;
});
}
};
var onQuickSearchBeforeQuery = function(e) {
if (this.getValue().length==0) {
} else {
var value = this.getValue().replace(/^\s+|\s+$/g, "");
if (value=="")
return;
searchStore.clearFilter();
var vr_insert = true;
searchStore.each(function(r) {
if (r.data['query'].indexOf(value)==0) {
// backspace
vr_insert = false;
return false;
} else if (value.indexOf(r.data['query'])==0) {
// forward typing
searchStore.remove(r);
}
});
if (vr_insert==true) {
searchStore.each(function(r) {
if (r.data['query']==value) {
vr_insert = false;
}
});
}
if (vr_insert==true) {
var vr = new searchRec({query: value});
searchStore.insert(0, vr);
}
var ss_max = 4; // max 5 query history, starts counting from 0; 0==1,1==2,2==3,etc
if (searchStore.getCount()>ss_max) {
var ssc = searchStore.getCount();
var overflow = searchStore.getRange(ssc-(ssc-ss_max), ssc);
for (var i=0; i<overflow.length; i++) {
searchStore.remove(overflow[i]);
}
}
}
};
searchBox.on("beforequery", onQuickSearchBeforeQuery);
searchBox.on("beforequery", onFilteringBeforeQuery);
searchBox.on("select", onFilteringBeforeQuery);hoping to get it to work with explicity typing enter to get a query into history、
this way just type away to quickfind and explicitly remember a query for later.
(this would also make much sense to user who just put＜enter＞after everthing)
thanks to Jack for this new compbox to Playwith
#
2
03-08-2007,11:52 PM
It sounds cool.Let me know when you have a link to look at.
#
3
03-09-2007,06:59 AM
Modified editor grid example here:
http://ido.nl.eu.org/static/ext-1.0-...arch-grid.html
#
4
03-09-2007,07:29 AM
trbs--looks great…
small issue…if you type「sun」and wait a while…then using backspace to just「s」and write「show」then the history will contain both「sun」and「show」.Mayle it could be a configration parater.Soiyou.orefile the.solight.com.
#
5
03-09-2007,07:39 AM
Quote:
オリジナリティーPosted by
KimH
trbs--looks great…
small issue…if you type「sun」and wait a while…then using backspace to just「s」and write「show」then the history will contain both「sun」and「show」.Mayle it could be a configration parater.Soiyou.orefile the.solight.com.
yeah that's a known proble m
quicksearch shound filter the datastore as type(others wise it's not very)
quick:-)
but the history shuld be meaningfull and not contan everry variation one types.that's why i made it so it only remembers the longest unique line.
this brigs forward your issue,and is also terrible for typo's,eg;type'shows'while u mean'show'and the longer/bad search query is remembersed in history instead of the corectone.
that i s why i want to try and hook into keyup instead of beforequery for the history.making it so that the history would only rememberry's after u press＜enter＞in the search box.
#
6
03-09-2007,07:54 AM
I get
s has no properties http://ido.nl.eu.org/static/ext-1.0-alpha3/ext-all.js Line 214sm is not defined http://ido.nl.eu.org/static/ext-1.0-...search-grid.js Line 1747
03-09-2007,07:58 AM
Quote:
オリジナリティーPosted by
アニマル
I get
s has no properties http://ido.nl.eu.org/static/ext-1.0-alpha3/ext-all.js Line 214Quote:
オリジナリティーPosted by
アニマル
and
sm is not defined http://ido.nl.eu.org/static/ext-1.0-...search-grid.js Line 174#
8
03-09-2007,08:08 AM
Fixed the's hasのproperties'error…
Works fine with the RowSelection Model、still havn't got my finger on the undering problem with CelSelection Model…
but it works now、without errors、in Firefox/Firebug which is good enough for the demo gess:wink:
#
9
03-09-2007,02:52 PM
It woked great for me.I was wondering、can this work against a paged、remote data source.Well、I know it can…but does what work that way?In other wods,if I want this to work on a table that would have 100 k records I would not necessarlywant to load all of those records into the page.Ideas?
#
10
03-09-2007,03:38 PM
Quote:
オリジナリティーPosted by
lstrud
It woked great for me.I was wondering、can this work against a paged、remote data source.Well、I know it can…but does what work that way?In other wods,if I want this to work on a table that would have 100 k records I would not necessarlywant to load all of those records into the page.Ideas?
i build it for a paged grid、but it only filters thru the page not all the records in the store.
if you would like to show 20 records on a page but search chる100 k then＿i think
you shound take a look at Jack's atocomplection box.(forum-search)
Iggess my example could go as filtering the grid store server side and displaying all the rerererereaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaathethererererererererererererereaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaers.
Onese'm able to handle the onKeyUp events nivery in the search box it would make a nice feature for a grid appliation to dowhant on pressing nter in the search box.If the searrystraok).(read;if i build a separate component exted compending cobox instead of jusing it in the example)this could be something like an option on the search box.
I hope to get around to extending compbox to make something like a search box as soon as possible.
ジャック、mayboe it's an idea to add another parameter to Store.js?
so that we have something like:
this.paramNames = {
"start" : "start",
"limit" : "limit",
"sort" : "sort",
"dir" : "dir",
"filter" : "filter"
};To be able to do server side filtering of the store when datasets get really large.
This could also be usefull if you want to have a selectbox somehere else on the page or gridheader too only view records with a specific condition in the gride.