PDA

View Full Version : Grid Search Plugin



Pages : [1] 2 3 4 5

jsakalos
19 Jan 2008, 12:37 PM
Hi all,

the self-contained Grid Search Plugin usage example follows. This example is configured to use local filtering (mode:'local') but remote mode, when serching itself is done by the server, is also possible. The plugin should also work with AutoGrid(s) and paging grids.

Enjoy.


http://gridsearch.extjs.eu

galdaka
20 Jan 2008, 1:34 AM
Excellent plugin!!!

One suggestion: Posibility for select "Local" or "Server" mode on the fly. Whe you click in search button should be great that appears one "Check buton" with text "Local mode" after separator and the rest of the columns. If "local mode" is clicked, the plugin work as now in other case go to server....

Thanks and good work!!! (As ususally)

jsakalos
20 Jan 2008, 1:59 AM
Thanks galdaka,

yes, it's easily feasible to switch local/remote mode from menu. Nevertheless, I do no want to present users with options that need explanation and understanding. Local/remote is meant for programmer who knows which store is used and uses plugin mode accordingly.

a4
20 Jan 2008, 7:28 AM
Thanks!

Could you please also post a screen shot?

jsakalos
20 Jan 2008, 10:16 AM
Thanks!

Could you please also post a screen shot?

Yes, it's attached to the first post.

franckxx
20 Jan 2008, 11:04 PM
Cool, very nice plugin :-)
Thx for this great work

kenshin
20 Jan 2008, 11:36 PM
Very useful plugin!!! :)

Thank's for sharing.

apaa
21 Jan 2008, 5:36 AM
nice work!
but maybe you can provide the function we can choose which Columns I want to display in the search fields ,but not all the columns.
3Q!

MeDavid
21 Jan 2008, 7:51 AM
nice work!
but maybe you can provide the function we can choose which Columns I want to display in the search fields ,but not all the columns.
3Q!

I think the 'disableIndexes' config option provides what you need (array for indexes to be disabled).

jsakalos
21 Jan 2008, 11:10 AM
I think the 'disableIndexes' config option provides what you need (array for indexes to be disabled).

Exactly! There is also config variable checkIndexes. It can be either 'all' or array of indexes to check initially.

oanimashaun
21 Jan 2008, 12:21 PM
How can i get the plugin to work with my tbar :(

bcamp1973
21 Jan 2008, 12:24 PM
you're a life saver! i was just about to try and tackle this myself. it wouldn't have been pretty. well done sir!

jsakalos
21 Jan 2008, 2:12 PM
How can i get the plugin to work with my tbar :(

position:'top'

evilized
23 Jan 2008, 1:50 PM
nice plugin! thx for sharing =)

i have a question.... is possible make work this plugin with autogrid??? can u give an example please...

thx for u time and answer

rstuven
23 Jan 2008, 3:37 PM
Thanks for this plugin.

I'm using a GroupingView with startCollapsed:true, so I added the following code just before the end of onTriggerSearch:



// Give immediate feedback of rows found in case there are collapsed groups
var view = this.grid.getView();
if ("expandAllGroups" in view) {
view.expandAllGroups();
}

} // end of function onTriggerSearch

Ronaldo
24 Jan 2008, 12:34 AM
Hi,

Thanks for the plugin! I use the paging toolbar, and somehow the store.lastOptions is an object, but it has no params... (That is, if the grid is just opened and the user has not paged yet). So I added these 2 checks (in bold). I suppose it's my own config, but I just wanted to let you know.

Greetz,
Ronaldo



else {
// clear start (necessary if we have paging)
if(store.lastOptions && store.lastOptions.params) {
store.lastOptions.params[store.paramNames.start] = 0;
}

// get fields to search array
var fields = [];
this.menu.items.each(function(item) {
if(item.checked) {
fields.push(item.dataIndex);
}
});

// add fields and query to baseParams of store
delete(store.baseParams[this.paramNames.fields]);
delete(store.baseParams[this.paramNames.query]);
if (store.lastOptions && store.lastOptions.params) {
delete (store.lastOptions.params[this.paramNames.fields]);
delete (store.lastOptions.params[this.paramNames.query]);
}
if(fields.length) {
store.baseParams[this.paramNames.fields] = Ext.encode(fields);
store.baseParams[this.paramNames.query] = val;
}

jsakalos
24 Jan 2008, 3:27 AM
Oh yes, you're right. I've never loaded store w/o params.

Thanks for debugging.

bcamp1973
29 Jan 2008, 11:15 AM
i'm getting some odd behavior when i use CheckboxSelectionModel() it's including the checkbox column as a searchable field. how can i disable it?

jsakalos
29 Jan 2008, 11:29 AM
i'm getting some odd behavior when i use CheckboxSelectionModel() it's including the checkbox column as a searchable field. how can i disable it?

I've updated code in the first post - it should work fine with CheckboxSelectionModel now.

Thank you for reporting.

Dumbledore
29 Jan 2008, 10:25 PM
when i try to use the plugin i have no Triggerfield. It will be rendered but not displayed? Where is my fault?

When i look in firebug the triggerfield has an width of 0px ???

EDIT: It seems that this behaviour only appears when use a card-layout... :-(


// Das Grid deklarieren
grid = new Ext.grid.GridPanel({
id: 'grid_users',
region: 'center',
minSize: 100,
maxSize: 500,
stripeRows: true,
ds: ds,
cm: columnModel,
title: LANG.GRID_ManagedGroups_Title,
viewConfig: {
forceFit: true
},
width: 600,
height: 300,
selModel: new Ext.grid.RowSelectionModel({
singleSelect: false
}),
enableDragDrop: true,
ddGroup: 'usersDD',
autoExpandColumn: 'user_email',
tbar: toolbarButtons,
bbar: new Ext.PagingToolbar({
pageSize: 25,
store: ds,
displayInfo: true,
displayMsg: LANG.GRID_PTB_displayMsg,
emptyMsg: LANG.GRID_PTB_emptyMsg
}),
plugins: [new Ext.ux.grid.Search({
searchText: 'Suche',
mode: 'remote',
iconCls: false,
dateFormat: 'd m Y H:i',
position: 'top'
})]
})

jsakalos
30 Jan 2008, 4:29 AM
Add deferredRender:false to your CardLayout config.

Dumbledore
30 Jan 2008, 5:27 AM
no this did not help... It seems there is an bug when rendering Comboxes etc. in the body-Element of an Card.

When add the card later the input field is displayed:

[B]Won

jsakalos
30 Jan 2008, 8:13 AM
Try to replace deferedRender:false with deferredRender:false.

Dumbledore
30 Jan 2008, 8:30 AM
oops... ok, i change it but it will only work when add the card later. When i rendered directly in the card-body the combo will not displayed.

This must be a problem with comboxes and card-layout...

jsakalos
30 Jan 2008, 8:32 AM
Yeah, can be. There were some threads on this problem; maybe it's worth to search.

Jika
31 Jan 2008, 12:18 PM
Hi, thanx for sharing this great plugin.
I had problem with search over data in grid when the searching data were in own store linked by id (eg. ComboBox).
So I made this little correction (for local only) and works for me:


.
.
,onTriggerSearch:function() {
var val = this.field.getValue();
var store = this.grid.store;

var cm = this.grid.getColumnModel();
// help array with [dataIndex][columnIndex]
var cmfield = new Array();
for(ix = 0; ix < cm.getColumnCount(); ix++){
cmfield[cm.getDataIndex(ix)] = ix;
}
.
.
and



.
.
this.menu.items.each(function(item) {
if(!item.checked || retval) {
return;
}
var rv = r.get(item.dataIndex);

var c = cm.getColumnById(cmfield[item.dataIndex]);

if(c && c.editor && c.editor.getValue()==="" ) {

var cr = c.editor.field.store.getAt(c.editor.field.store.find(c.editor.field.valueField,rv));
if(cr) { // it may be undefined - not assigned value
rv = cr.get(c.editor.field.displayField);
}
}

rv = rv instanceof Date ? rv.format(this.dateFormat || r.fields.get(item.dataIndex).dateFormat) : rv;
.
.

jsakalos
31 Jan 2008, 4:53 PM
Thank you for improvement. I'll test it a bit and then I'll include it in the main code provided there are no problems. Remind me in a couple of days.

v496820
3 Feb 2008, 12:44 PM
Sorry guys, but this might be a silly question, I am new to Ext. I am trying to use the plugin to search data remotely rather than local on a paging grid. I am wondering how do I get access to the field's value so I can pass it in the params object in the call dataStore.load({params:{start:0, limit:25}});

Thanks in advance. Great Plugin!

jsakalos
3 Feb 2008, 12:58 PM
You don't need to do it. It's handled by the plugin itself; you just type the text, click search trigger and the request is sent to server. You can use Firebug to see what is sent to server.

jsakalos
3 Feb 2008, 1:09 PM
Wouldn't it be better to use renderers in these cases? I can imagine an option "searchUsingRenderer" where you wouldn't care about how data is really stored but you'd search values returned by renderers.

Also, in the code you posted, there can be an error if you use some special fields with editors that do not have stores. I'm not therefore incorporating it to the main code what I'd do with a cleanly coded searchUsingRenderer option.


Hi, thanx for sharing this great plugin.
I had problem with search over data in grid when the searching data were in own store linked by id (eg. ComboBox).
So I made this little correction (for local only) and works for me:

v496820
3 Feb 2008, 3:35 PM
You don't need to do it. It's handled by the plugin itself; you just type the text, click search trigger and the request is sent to server. You can use Firebug to see what is sent to server.

Just Amazing!! Thanks a million!!

Jika
5 Feb 2008, 1:48 AM
Yep, you're right. Use renderers would be better to avoid the problem with editors that don't have stores. Well, thank you for your notice I'm still beginner with Ext and this problem didn't come on my mind.

thatcoder
5 Feb 2008, 12:59 PM
Can anything be done to render the Search control before the buttons on the top toolbar, vs after?

so instead of adding to the toolbar, insertBefore?

jsakalos
5 Feb 2008, 2:11 PM
I cannot think of any easy way. I have tried insertButton method of toolbar but the problem is that it converts form field with search text to button.

nielsendev
6 Feb 2008, 11:24 AM
The plugin is rendering correctly in IE. But the same page is not showing the images in firefox. Any idea why this is happening

jsakalos
6 Feb 2008, 1:54 PM
Images? There are no pre-configured images in the plugin and everything works here in FF@Linux. Any showcase?

nielsendev
7 Feb 2008, 7:13 AM
Please see the screenshots

I am using window XP. In firefox the plug in not showing checkboxes and search buttons.

But in IE it is coming correctly

jsakalos
7 Feb 2008, 8:35 AM
This doesn't seem to be plugin related. I've never seen such a problem and I used the plugin many times, perhaps also others.

Do you render the grid into a hidden container?

Has anybody else had such problem?

salvi
10 Feb 2008, 4:44 PM
JSAKALOS (together with the rest of Ext Dev. Team) should be awarded with the Nobel Prize for his (and their) work ;)

Once again many thanks!

jsakalos
10 Feb 2008, 5:10 PM
JSAKALOS (together with the rest of Ext Dev. Team) should be awarded with the Nobel Prize for his (and their) work ;)

Once again many thanks!

Thank you very much for your great praise. A good part of it must go to Jack Slocum who created this great library.

pjesus
11 Feb 2008, 12:19 PM
Hello.

Tank you very much for the plugin. It's very nice ;)

I just have a issue. If the grid is paged and the search plugin is in local mode but the store is in remote, it only filters de grid on the visible page. Is to hard to make all filtered rows start on the first page and adjust the number of items found in the store loaded? Just like a filter client side but improved for paging toolbar?

Tanks ;)

Srry my english....

Paulo Jesus

jsakalos
11 Feb 2008, 7:50 PM
The plugin is meant to have same mode as store so if you have in-memory store then you use local mode and if you have remote store then you use remote mode.

Combining these two modes into one leads to nothing else but confusion of users and troubles for developer.

pjesus
12 Feb 2008, 2:40 AM
Yap, it make sense ;)

Tank You ;)

vishalg
12 Feb 2008, 4:09 PM
Great Extension!

I Suggest adding a single select option for the Search by Combo to do specific searched on one column. Right now you have to un-select all field and select one field.

Thanks!

jsakalos
12 Feb 2008, 5:17 PM
Yeah, good idea, however, I have no clue (yet) how to implement it as I do not want to force user to select only one column for searching. You mean some shift+click or something?

vishalg
13 Feb 2008, 11:23 AM
Thanks for the reply, I have a few different implementation ideas
1) Add two Ext.menu.Item elements to select and deselect all search fields.
2) Add a config to use a menu (Current Implementation) vs combobox. This can take care of applications where you would want the user to select a specific column to search by.
Heres an example of how the combobox implementation would look visually.
-----------------------------------------------
Search By | Combo Box \/ | | Input Box |
------------------- ---------------------------
3) Your idea of Shift + Click having the effect of deselcting all but the clicked item.

Please share if anyone else has any other ideas.

-- Vishal

jsakalos
13 Feb 2008, 12:46 PM
Here you are,

check the implementation with Select All checbox. I've updated the example with embedded code in first post.

Cheers,

vishalg
13 Feb 2008, 2:11 PM
Saki,

Works like a charm, I think thats going to a lot more user friendly for the end user when doing specific searches.

Thanks!

teknaut
14 Feb 2008, 2:47 AM
hi,

Firstly thanks for sharing this great piece of work. Really useful and works really well. Just one thing i notice though, not sure if I have done something wrong but i am experiencing the following behaviour when performing a search and getting no data back from my php page.

The grid does not update itself with the empty result set and just displays the same data that was there before the search. I am not sure why this happens as i thought the store.reload() fn in the search code would take care of this.

I have tried grid.refresh as well but to no avail. Have I done something wrong ?

Cheers

mjlecomte
14 Feb 2008, 4:08 AM
What is returned for your result? I think you need to return an empty array instead of null for example.

teknaut
14 Feb 2008, 4:53 AM
i was indeed returning null but returning an empty array doesn't help unfortunately

thanks for the suggestion though.

mjlecomte
14 Feb 2008, 5:14 AM
Can you post your XHR response?

teknaut
14 Feb 2008, 5:39 AM
I am either returning null or as per your suggestion this : []

is that what you wanted to see or ??

jsakalos
14 Feb 2008, 6:55 AM
This JSON clears the grid for sure:

{"success":true,"totalCount":"0","rows":[]}

jsakalos
14 Feb 2008, 6:55 AM
One remark: Your totalProperty and root may vary.

teknaut
14 Feb 2008, 7:34 AM
Hmm, thanks for that it was to do with my return data as you have saisd. If I echo out {"success":true,"totalCount":"0","rows":[]} as my responsethe grid clears as expected. I will have to modify the return somehow.

Thanks very much for your help.

crpatrick
14 Feb 2008, 8:10 AM
First...this is a great plugin. It worked on the first try, and for my grid, I am working with the BufferedPagingMemoryProxy (with streaming data), and it is working across all pages without any issue.

The one thing I am seeing is when I do the search, all is fine. Because I am streaming, I do data store reloads every 4 seconds or so. When I do the reload, the search results clear, and the entire data set is again shown. I wasn't sure if there was an easy way to maintain the search after a data store reload?

Thanks again for this!!

jsakalos
14 Feb 2008, 8:38 AM
Do you call store.reload()? 'Cause if so, the store is reloaded with last params including search value, I suppose.

crpatrick
14 Feb 2008, 8:40 AM
I have been using the below:

grid.getDataSource().reload();

getDataSource is basically just retrieving my store object.

jsakalos
14 Feb 2008, 8:58 AM
You can look how paging toolbar refresh button works as it doesn't clear search values and do your code same way.

mjlecomte
14 Feb 2008, 3:47 PM
Hmm, thanks for that it was to do with my return data as you have saisd. If I echo out {"success":true,"totalCount":"0","rows":[]} as my responsethe grid clears as expected. I will have to modify the return somehow.

Thanks very much for your help.

You might be interested in something like this (see "LOOK HERE"):


function showData($dbTable)
{
// debugBreak();

global $taxRate;

/* By specifying the start/limit params in ds.load
* the values are passed here
* if using ScriptTagProxy the values will be in $_GET
* if using HttpProxy the values will be in $_POST (or $_REQUEST)
* the following two lines check either location, but might be more
* secure to use the appropriate one according to the Proxy being used
*/
//offset
$start = (integer) (isset($_POST['start']) ? $_POST['start'] : $_GET['start']);
//the page size
$end = (integer) (isset($_POST['limit']) ? $_POST['limit'] : $_GET['limit']);


//if remoteSort is true than we need to include an ORDER BY in our query
//column to sort
if(isset($_REQUEST['sort'])){
$sort = (isset($_POST['sort']) ? $_POST['sort'] : $_GET['sort']);
}
//sort direction 'DESC' or 'ASC' (Ext.js sends mysql syntax)
if(isset($_REQUEST['dir'])){
$dir = (isset($_POST['dir']) ? $_POST['dir'] : $_GET['dir']);
}
$sortBy = isset($sort) ? $sort : 'company';
if(isset($dir)) {
$sortDir = $dir;
}
else{
$sortDir = 'ASC';
}


//get the total number of records so we can return it back with the results
//the total count is used by the paging toolbar to display the number of records
$sql_count = 'SELECT * FROM ' . $dbTable;
$result_count = mysql_query($sql_count);
$rows = mysql_num_rows($result_count);

//now we get the data we want to send back to populate the store
//we LIMIT the data sent back using the parameters from the paging toolbar
//we also ORDER BY so the data is presented in some rational order
// note: when using ORDER BY with LIMIT you'll probably want to make sure
// that the column(s) using ORDER BY are indexed
$sql = $sql_count . ' ORDER BY ' . $sortBy . ' ' . $sortDir . ' LIMIT ' . $start . ', '. $end;
$result = mysql_query($sql);
////////////////////
//// LOOK HERE ////
//to properly update grid, we need to return an empty array not null
//declare an empty array, so even if it's empty when it's encoded it will return
//"results":[]
$arr = array();

//populate the array if the query found records
while($rec = mysql_fetch_array($result, MYSQL_ASSOC)){
//these lines are to populate the tax column for the initial display
//of the grid, any updates to the price are handled by another function below
$price = $rec['price'];
$rec['tax'] = round($price * ($taxRate),2);

$arr[] = $rec;
};


if (version_compare(PHP_VERSION,"5.2","<"))
{
require_once("./JSON.php"); //if php<5.2 need JSON class
$json = new Services_JSON();//instantiate new json object
$data=$json->encode($arr); //encode the data in json format
} else
{
$data = json_encode($arr); //encode the data in json format
}

// $data = (is_null($data)) ? '[]' : $data;

/* If using ScriptTagProxy: In order for the browser to process the returned
data, the server must wrap te data object with a call to a callback function,
the name of which is passed as a parameter by the ScriptTagProxy. (default = "stcCallback1001")
If using HttpProxy no callback reference is to be specified*/
$cb = isset($_GET['callback']) ? $_GET['callback'] : '';

//we defined in our reader that the total count will be named 'total' (see totalProperty)
echo $cb . '({"total":"' . $rows . '","results":' . $data . '})';

}//end showData

dwt11
15 Feb 2008, 8:03 AM
it's very good!:)

hazooma
15 Feb 2008, 1:37 PM
I am trying to use the checkIndexes to indicate that the first and second should be checked by default, but I think I am doing something wrong.

mode: 'remote'
,iconCls: false
,checkIndexes: [0,1]

Thanks

jsakalos
15 Feb 2008, 1:58 PM
It doesn't work with numerical indexes but with field names as specified by column model dataIndex. For example:

checkIndexes:['persFirstName', 'persLastName']

donssmith
16 Feb 2008, 11:43 PM
Hi Jozef,

First thing... Great plugin!

I added a new config value called 'alignment' to allow the plugin to be aligned left or right on the toolbar. I added the logic to the onRender function.



// added to config defaults
,alignment:'left'


// onRender
if (this.alignment === 'right') {
tb.addFill();
}
else {
tb.addSeparator();
}


Thanks,
Don

jsakalos
17 Feb 2008, 12:19 AM
Perfect! Thank you.

I would just give config property name align to be consistent with the rest of Ext (e.g. labelAlign)

wm003
17 Feb 2008, 7:15 AM
Awesome! Excellent Plugin. =P~ Thank you!

donssmith
17 Feb 2008, 10:02 AM
Yeah, I was debating between using align or alignment. I notice some with a name like buttonAlign, labelAlign, etc... and some with just alignment.

One additional thing I added was a minimum input length for the search text box. This is ideal to make sure the search doesn't bring back more than you want it to. The only thing I wasn't sure about was how to notify the user when then entered less than the minimum input length. I was thinking a message box might be too intrusive. Any ideas?



// added to config defaults
,minInputLength:0


// onTriggerSearch
if (this.minInputLength > 0 && val.length < this.minInputLength) {
return;
}

jsakalos
17 Feb 2008, 3:33 PM
Well, it's questionable if it is really necessary, at least from my viewpoint where I work almost exclusively with large tables and paging. Therefore, I do not need to force user to type at-least-that-many-characters (search works on enter, escape and triggers) as I always return only pageSize number of records (but maybe 100 pages if he typed only "a").

If I would be about to notify user about a number of character limits I would probably simply set minLength property of text field and I would not submit query if field was invalid.

donssmith
17 Feb 2008, 7:52 PM
I was looking more from a performance/long running query point of view. Some of the tables I work with have close to 20 million records. To perform a wild card search on a single character (SELECT * FROM <tablename> WHERE <fieldname> LIKE '%a%') would cause a table or index scan of all 20 million records. I guess I want to save the user from themselves and to keep long running queries from occurring.

I took your suggestion and added the following to the field creation within onRender. I also changed the config property from minInputLength to minLength.



,minLength:this.minLength > 0 ? this.minLength : 0

jsakalos
18 Feb 2008, 2:05 AM
I have incorporated minLength support in the main code; grab it please from the first post.

ajaxE
18 Feb 2008, 2:01 PM
Yes, it's attached to the first post.

This is a great plugin. I really want to use it.

It didn't work in FF. Did I miss anything? I copied code from the first post.

Also when I change the position:'top'. IE given "undefined" error on line:

var tb = 'bottom' == this.position ? grid.bottomToolbar : grid.topToolbar;

Thanks!

jsakalos
18 Feb 2008, 2:17 PM
Your grid has to have at least tbar:[] for top position or at least bbar:[] for bottom position. Reason is that you add this plugin to toolbar. If you don't have one there no place to add to.

ajaxE
18 Feb 2008, 2:43 PM
Your grid has to have at least tbar:[] for top position or at least bbar:[] for bottom position. Reason is that you add this plugin to toolbar. If you don't have one there no place to add to.

Thanks for your quick response. You are right that it works in IE if I added tbar.
But Firefox is not working with there errors.

First it saying Ext is undefined. That's weird.
Other two errors are ilegal character.

Any idea?

Thanks!!

jsakalos
18 Feb 2008, 3:03 PM
This is not plugin related. Check your include paths.

ajaxE
18 Feb 2008, 5:53 PM
This is not plugin related. Check your include paths.

Thanks! You were right. It's working in FF now.

I tried to use the server side search. I would like to deselect all checkbox as the deafult. How do I do that?

Thanks for your help and this great plugin!

jsakalos
18 Feb 2008, 5:59 PM
Well, deselect ALL by default doesn't make too much sense as you render the plugin unusable (by default). However, you can choose to select ONE. Just specify config option:




checkIndexes['name-of-dataIndex-you-wanna-check'] // others will stay unchecked

jsakalos
18 Feb 2008, 6:12 PM
Hi all!

I've doced the plugin and incorporated small improvements you suggested (align config, minLength config).

Are there any more ideas before I post it to Learn Section?

Cheers,

ajaxE
18 Feb 2008, 6:24 PM
Well, deselect ALL by default doesn't make too much sense as you render the plugin unusable (by default). However, you can choose to select ONE. Just specify config option:




checkIndexes['name-of-dataIndex-you-wanna-check'] // others will stay unchecked



It worked. Thanks for your help! In my case, since it's server side filtering. I don't want users to select all, which will make query too difficulty. Filter one at time is good. In this case. Only radio button will be good enough.

I can see the use of searching a few fields together in other occasion. It's a very powerful search filter.

Thank you a lot!

expertmo
19 Feb 2008, 12:50 AM
Hi, nice plug in!
I would like to use it in my grid, but the trigger field is not rendered. Attached the image of my grid: I have a grid into an accordion. I've tried with the suggested

deferredRender: false
as config option for my accordion, but I did not work.

Any idea?

Thanks!
Antonia.

jsakalos
19 Feb 2008, 2:42 AM
Does search appear in the same grid if the grid is standalone? Browser dependent? deferredRender:false on TabPanel?

These are things I'd check. Also, you can try to add hideMode:'offsets' to your TabPanel.

expertmo
20 Feb 2008, 12:25 AM
Ok, the same grid into a simple window, without accordion around, work perfectly, and it's very nice!
The problem appear in both in IE 6 and Mozilla.

This is my accordion code, I've tried with both the deferredRender: false and the hideMode:'offsets' in the accordion and also in the single panel with the grid, but the trigger field does not appear.

This is my accordion (corpus_extra_grid is the grid with the plugin). Ideas?



var corpus_accordion = new Ext.Panel({
height:winHeight - 60,
layout:'accordion',
border:false,
items:[{
title: 'Corpus Info',
iconCls: 'bogus',
items: [this.corpus_panel],
anchor: '100%',
layout: 'fit'
},{
title: 'Extra Dati',
iconCls: 'extra',
deferredRender: false,
hideMode:'offsets',
items: [this.corpus_extra_grid],
anchor: '100%',
layout: 'fit'
}]
});

jsakalos
20 Feb 2008, 1:07 AM
Sorry if I mislead you, accordion layout extends fit layout so deferredRender is ignored as it is only for card layout and subclasses (tab panel).

I think that I've read some issues of TriggerField (used by the plugin) in TabPanel (or Accordion layout); try to search the forum if there is a solution provided in that thread.

expertmo
20 Feb 2008, 2:58 AM
Thanks for the suggestion. I searched into the forum, and I founded this post: http://extjs.com/forum/showthread.php?t=24516&highlight=TriggerField+tab

But I really have no idea how to use into my accordion. How can I change the hide modality of the element. Any suggestion?

jsakalos
20 Feb 2008, 3:19 AM
I also have no "do-this" recipe... Anyway, one idea: How do you create your grid? xtype or new keyword? Use xtype approach if possible.

http://extjs.com/forum/showthread.php?p=125476#post125476

expertmo
20 Feb 2008, 7:43 AM
Yes, you're right, but your Ext experience is longer than mine, so may be you have more good ideas... ;)
Anyway... I need the instance of the grid, so I need to use the new constructor to build it...

jsakalos
20 Feb 2008, 11:52 AM
Hmmm, one of the best things of Ext 2.x compared with Ext 1.x is the possibility and support of lazy instantiation. I cannot say that it will solve your problem for sure, however, try to think of a possibility to use the lazy instantiation everywhere possible. This can be usually attained by non-major code refactoring.

NBRed5
22 Feb 2008, 3:39 AM
Jozef,

Thanks for the plugin, this is excellent, however I have an issue with using it with a card layout.

See the attached forum post which explains issues with the twintrigger field when used in a card layout where that card is not the active item at time of render.

http://extjs.com/forum/showthread.php?t=17242

This is the issue I am having, I am using your plugin on a grid which is in a card layout but is not the activeItem when the card layout is rendered. The search input field (twintrigger field) is not dispalyed when the card is made the active item, the search button is visible but the twin triggerfield wrap has width:0 added to it's style.

As the twintrigger field is embeded in the plugin I am at a loss at to correctly set the width of the twintrigger field when the card containing it is made the actice item.

jsakalos
22 Feb 2008, 10:52 AM
Now I see that it can be the serious problem. Could you please wrap up a simplest possible showcase that I can debug locally? I'd dig into it.

sanjshah
25 Feb 2008, 6:52 PM
Hi,

I've copied the html code as-is but recieve an error: 'prototype' is null or not an object

any ideas?

Thanks

jsakalos
26 Feb 2008, 12:28 AM
I've done the same right now and it works w/o problems. Have you adjusted paths to your Ext installation?

NBRed5
27 Feb 2008, 4:52 AM
Jozef,

I am sorry I have not had time to throw together an example, just to let you know though I have been able to solve the issue in my application by doing the following:

Add this to the panel in which the toolbar containing the plugin is.



this.on('show', function(){
this.cascade(function(descendant){
descendant.fireEvent('shown', this);
});[/left]
}, this);



Then a slight change to the pluging with the following code added to the init function



this.grid.on('shown',function(){
this.field.wrap.setWidth(this.field.el.getWidth()+this.field.trigger.getWidth());
},this);

jsakalos
27 Feb 2008, 5:01 AM
Good! Having no idea what it is doing ;) I'm glad that you resolved an issue.

BTW, I'm using the plugin in that many places w/o any hacks that it's suspicious you need one...

notjoshing
27 Feb 2008, 2:37 PM
I've been trying out your search tool on a site I'm working on. Very nice. With particularly wide grids, I'm going to tweak the code so that all the columns can be displayed without the addition of scrollbars, but otherwise it's a great plug-in.

One question: have you considered adding the ability to select comparison operators?

Josh

jsakalos
27 Feb 2008, 2:58 PM
Not in this plugin. Search for thread named "An ideal grid filter for large databases" created by me. There is my vision of it.

franckxx
28 Feb 2008, 2:45 PM
hi Jsakalos,

I've just tested.... it's simple, efficace (in french), it's my prefered with live search plugin.

thx a lot.

i go to install it on my project (for one module)

jsakalos
29 Feb 2008, 12:44 AM
Thank you!

The design principles were: simple to use by both user and programmer. I'm glad you're satisfied.

sanjshah
2 Mar 2008, 6:50 AM
Jozef,

I using the plugin, but it does not seem to work on searching in a column which has custom renderer:

I have a renderer:



function combinecols(value, meta, record, rowIndex, colIndex, store){
return record.get('joblocation') + value;
}


Is there some code I could add?

Thanks,

Sanj

jsakalos
2 Mar 2008, 8:00 AM
I don't know if you're using local or remote search but definitely it won't work w/o handling custom renderers either server- or client-side. If it's local you'd probably look at the filterBy method of the Store.

sanjshah
2 Mar 2008, 4:43 PM
thanks Jozef, would it be possible to disable the search dropdown menu, that way I can hide the columns but use them for searching?

jsakalos
2 Mar 2008, 4:49 PM
If you have remote search then yes because it is up to your server which fields it will search in addition to passed array fields.

If you have local search then not out-of-the-box but you'd need to write some custom search function(s) (I suppose filterBy).

NotChris
7 Mar 2008, 9:25 AM
I have just tried this plugin within a grid and it looks great. My grid also has the expander plugin but by adding this plugin, the expand no longer works in the grid. I'm sure it is something I am doing wrong.




SampleGrid4 = function(limitColumns){



var columns = [
expander,
{id:'company',header: "", width: 40, sortable: true, dataIndex: 'company'},
{id:'price',header: "", width: 40, sortable: true, dataIndex: 'price'}
];


SampleGrid4.superclass.constructor.call(this, {
store: new Ext.data.Store({
reader: new Ext.data.ArrayReader({}, [
{name: 'company'},
{name: 'price'},
{name: 'change'}
]),
data: [
['Documents', 'Document 1 Description'],
['Processes', 'Processes 1 Description'],
['Projects', 'K2 Features']

]
}),
viewConfig: {
forceFit:true
},
tbar: [{xtype: 'tbfill'}],
columns: columns,
plugins: expander,
bbar:[],
plugins:[new Ext.ux.grid.Search({
mode:'local'
,iconCls:false
,dateFormat:'m/d/Y'
,minLength:2
})],

height:60,
width:700
});


}

jsakalos
7 Mar 2008, 12:49 PM
plugins: expander,
bbar:[],
plugins:[new Ext.ux.grid.Search({
mode:'local'
,iconCls:false
,dateFormat:'m/d/Y'
,minLength:2
})],
should read:


plugins:[expander, new Ext.ux.grid.Search({
mode:'local'
,iconCls:false
,dateFormat:'m/d/Y'
,minLength:2
})],

NotChris
7 Mar 2008, 12:54 PM
Thanks - worked like a charm and great plugin!!!

garraS
7 Mar 2008, 4:29 PM
How can i make a keypress function (alt + s) that goes to search field automatically?
In what part of the code?

garraS

eri.TsingTao
7 Mar 2008, 5:48 PM
Great work
thx

jsakalos
8 Mar 2008, 4:18 AM
How can i make a keypress function (alt + s) that goes to search field automatically?
In what part of the code?

garraS

I have added shortcut functionality - see code in first post. It works such a way that it installs key map on on grid element. Handler focuses the search field. Alt+S collides with menu History (in my browser) so I changed default to Alt+R = Search. Anyway, I made shortcut letter and modifier configurable.

Enjoy!

garraS
8 Mar 2008, 9:22 AM
I have added shortcut functionality - see code in first post. It works such a way that it installs key map on on grid element. Handler focuses the search field. Alt+S collides with menu History (in my browser) so I changed default to Alt+R = Search. Anyway, I made shortcut letter and modifier configurable.

Enjoy!

Thanks a lot! :))

garraS

DeeZ
11 Mar 2008, 6:31 AM
Hi,

This plugin is great ! I just added some more filtering options (optional) in order to set the filter mode: by default the search is done in all the contain, I added an option to search at the begining only.

So the result is not the same if you search on the 'al' string for example (cf. attached images)

To test, just unzip the file in the "examples" folder

DeeZ

Note: sorry for my bad english - the plugin text can be easily changed

sanjshah
11 Mar 2008, 6:39 AM
I wonder if it possible to add a boolean search, i.e. al , 2 or al+2 etc so the search look for more than 1 parameter

jsakalos
11 Mar 2008, 6:44 AM
I haven't added these options on purpose as it is much easier to type ^js as to click over menus and even most stupid users can remember this one character. Of course, for more advanced users, I use rlike() function on server so they can type even things like:

^s[a-z]+ $

as search strings.

DeeZ
11 Mar 2008, 6:57 AM
Ok I understood. So your clients are more intelligent than mine ... :)

sanjshah
11 Mar 2008, 6:59 AM
apologies, I did not try that, this is enough for most users.

Thanks!

jsakalos
11 Mar 2008, 7:13 AM
No problem, you can still use your additions but, please, extend the extension, don't change the original code. That will protect you from the pain of upgrading.

seppy
11 Mar 2008, 9:50 AM
hey,

is it possible to add additional parameter to the remote request? params as config option is not intended.
I need ie the additional post parameter "task".

Any idea?

thx

jsakalos
11 Mar 2008, 9:53 AM
Plugin (re)loads the store. You can add your task to baseParams of store.

seppy
11 Mar 2008, 1:16 PM
sure, but i have an backend script which handles any listings.



switch (task){
case 'listing':

case 'search':
}


so the parameter for query differs from base parameter. or did i missunderstood your hint?

jsakalos
11 Mar 2008, 1:25 PM
baseParams is object with name/value pairs that are posted to server.

seppy
11 Mar 2008, 2:09 PM
i know, but how can i change the value for the key "task" for example?

jsakalos
11 Mar 2008, 2:30 PM
var store = grid.getStore();
store.baseParams = store.baseParems || {};
store.baseParams.task = "Your task value";

vector4711
16 Mar 2008, 8:19 AM
=D> You made my day!

sandy
17 Mar 2008, 1:56 AM
I am using ext pagination for the first time and working with jsp where the example is with php that makes me confusion.
In my jsp i had an account object with values how to set them and how to use them in paging.js

mypaging.jsp
-----

Account[] accounts = new Account[hits.length()];
for(int i = 0;i<hits.length();i++){
account=new Account();
Document doc = hits.doc(i);
account.setAccountId( doc.get("accountId"));
account.setAccountNo( doc.get("accountNo"));
account.setOcaId( doc.get("ocaId"));
account.setCCN( doc.get("CCN"));


accounts[i] = account;

}

//here how to put values in this page like in php it is like
//Echo '({"total":"'.$rows.'","results":'.json_encode($arr).'})';

I need the same php command in jsp

Guys/Gals please help me i m in great need.

jsakalos
17 Mar 2008, 2:39 AM
Sorry, I only know that jsp exists, nothing else. Also, Ext is client library (javascript) so I'd expect you can get more support on some jsp forums. People here are using various backends and Ext is backend independent.

iLiketoGrid
17 Mar 2008, 8:34 AM
Thanks for posting the example. It's great for newbies to learn. I would also like to add pagination to the example but not quite know how to do this. (:|

jsakalos
17 Mar 2008, 8:48 AM
Thanks for posting the example. It's great for newbies to learn. I would also like to add pagination to the example but not quite know how to do this. (:|

Look at the links at the bottom of this page: http://filetree.extjs.eu

Shaguar
18 Mar 2008, 5:40 AM
One silly question:
I got a running paging Grid but how do i integrate just the search Field in my existing Grid
(for beginners). The Code in your first post is a complete Grid but i just want to export the search functions. On request i can post my js-Grid File here.
Thanks for your efforts.
Sincere regards.

jsakalos
18 Mar 2008, 6:05 AM
Just omit the paging toolbar - should work. You must have at least bbar:[] in config as plugin adds itself to an existing toolbar.

Shaguar
18 Mar 2008, 7:07 AM
Sorry i dont get it.
This is my gridpanel until now,
now i have to omit the "new Ext.PagingToolbar........" part but not the bbar:[] ?
What am i going to do with your code now?
Extract the search plugin related code and put them where? and what do i have to extract exactly?
I would highly appreciate it if you could help me on this one.


function buildGrid()
{
Grid = new Ext.grid.GridPanel(
{
ds: dataStore,
cm: getColumnModel(),
height: 800,
width: 1200,
loadMask: true,
iconCls: 'icon-grid',
stripeRows: true,
selModel: new Ext.grid.RowSelectionModel({singleSelect:true}),
bbar: new Ext.PagingToolbar
({

plugins: [this.PagingPlugin],
pageSize: pSize,
store: dataStore,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No data to display",
items:
[
]
}),

}
);

dataStore.load({params:{start:0, limit: pSize}});
}

jsakalos
18 Mar 2008, 7:44 AM
I think I don't quite understand where's problem. The full working example is in the first post of this thread together with usage. There you can find:



bbar:[],
plugins:[new Ext.ux.grid.Search({
mode:'local'
,iconCls:false
,dateFormat:'m/d/Y'
,minLength:2
})]

Shaguar
18 Mar 2008, 2:00 PM
Ok i think i got it running now,
but i still use the PagingToolbar and i only get the search results from the current shown page. Is there a possability to search through all pages?

jsakalos
18 Mar 2008, 5:47 PM
Of course! You have to switch to remote mode and implement search server-side.

stewart
20 Mar 2008, 3:32 AM
I used the search in a grid with data read from a database and custom fields.

Worked perfectly first time.


Thanks for sharing code.

NotChris
23 Mar 2008, 10:15 AM
I was able to get the search plugin to work with the expander plugin with what you specified earlier in this post. I added the maximize plugin to the panel where I have gridpanel defined that has the plugins for the search/expander. I am still able to see/use the expander plugin but I no longer see the search plugin displayed on the toolbar (toolbar is visible though). Is there something special I need to do to get the search plugin to work with the maximize plugin? Thank you.




// Center panel definition

title: 'Bookmarks',
layout:'fit',
id: 'book',
tools: tools,
plugins: new Ext.ux.MaximizeTool(),
buttonAlign:'left',
buttons: [{text:'New Folder'}],
items: new Grid4([1, 2, 3])

// Gridpanel definition

Grid4 = function(limitColumns){
var columns = [
expander,
{id:'company',header: "", width: 40, sortable: true, dataIndex: 'company'},
{id:'price',header: "", width: 40, sortable: true, dataIndex: 'price'}
];

Grid4.superclass.constructor.call(this, {
store: new Ext.data.Store({
reader: new Ext.data.ArrayReader({}, [
{name: 'company'},
{name: 'price'},
{name: 'change'}
]),
data: [
['Documents', 'Document Description'],
['Work', 'Work Description'],
['Schedule', 'Schedule Features']

]
}),
viewConfig: {
forceFit:true
},

columns: columns,
animCollapse: false,
iconCls: 'icon-grid',
tbar: [],
id:'bookmarksgrid',

plugins:[ expander, new Ext.ux.grid.Search({
mode:'local'
,iconCls:false
,dateFormat:'m/d/Y'
,minLength:2
})],

frame:true,
height:60,
width:700
});


}

Ext.extend(Grid4, Ext.grid.GridPanel);

jsakalos
23 Mar 2008, 11:51 AM
I don't know what is maximize plugin for. I could take a look at it if you prepared self-contained runnable showcase.

NotChris
23 Mar 2008, 12:43 PM
The maximize plugin is a Ext user added plugin that can be found at:
http://extjs.com/forum/showthread.php?t=20662&highlight=maximizetool

The current code that I have for the plugin is as follows below but it could be copied as is from the above link and added as a plugin to a panel with a center region in a layout border to see it in action. I am using this plugin to maximize gridpanels and the south panel and it works quite nicely. The only difference is that I am using the maximized panel as modal and non-draggable.



var paneltitle = '';
var panelid = '';

Ext.ux.MaximizeTool = function() {
this.init= function(ct) {
var maximizeTool = {
id: 'maximize',
handler: handleMaximize,
scope: ct,
qtip: 'Maximize'
};
Ext.Msg.alert('Message', 'vvv');

ct.tools = ct.tools || [];
var newTools = ct.tools.slice();
ct.tools =newTools;
for(var i=0, len=ct.tools.length;i<len;i++) {
if (ct.tools[i].id=='maximize') return;
}
ct.tools[ct.tools.length] = maximizeTool;

};

function handleMaximize(event, toolEl, panel){
panel.originalOwnerCt = panel.ownerCt;
panel.originalPosition = panel.ownerCt.items.indexOf(panel);
panel.originalSize=panel.getSize();

var centerpanelsize = Ext.getCmp('centerregion').getSize();

if (!toolEl.window) {
var defaultConfig = {
id: (panel.getId() + '-MAX'),
title: panel.title,
width: (centerpanelsize.width), // Maximized size
height: (centerpanelsize.height),
resizable: false, // Added to not be able to resize the window
modal: true, // Added
closable: true,
closeAction: 'hide',
hideBorders: true,
//plain: true,
layout: 'fit',
autoScroll: false,
border: false,
bodyBorder: false,
draggable: false, // Added
frame: true
pinned: true,
bodyStyle: 'background-color: #ffffff;'
};

panelid = panel.getId();
toolEl.window = new Ext.Window(defaultConfig);
toolEl.window.on('hide', handleMinimize, panel);

}

paneltitle = panel.title; // Save the title for the minimize

if (!panel.dummyComponent) {
var dummyCompConfig = {
title: panel.title,
width: panel.getSize().width,
height: panel.getSize().height,
html: '&nbsp;'
};
panel.dummyComponent = new Ext.Panel(dummyCompConfig);
}

toolEl.window.add(panel);
if (panel.tools['toggle']) panel.tools['toggle'].setVisible(false);
panel.tools['maximize'].setVisible(false);

panel.originalOwnerCt.insert(panel.originalPosition, panel.dummyComponent);
panel.originalOwnerCt.doLayout();
panel.dummyComponent.setSize(panel.originalSize);
panel.dummyComponent.setVisible(true);

//panel.dummyComponent.getEl().mask('This is maximized.');
Ext.getCmp(panel.id).header.setVisible(false);
Ext.getCmp(panel.id).header.hide();
toolEl.window.show(panel.id); // Added

var centerpanelsize = Ext.getCmp('centerregion').getSize();
var southpanelsize = Ext.getCmp('south-panel').getSize();
var centerpanelposition = Ext.getCmp('centerregion').getPosition(true);
Ext.getCmp(panelid).ownerCt.setPosition(0,centerpanelposition[1]);
Ext.getCmp(panelid).setHeight((centerpanelsize.height - southpanelsize.height));


};

function handleMinimize(window) {

Ext.getCmp(panelid).header.show();
Ext.getCmp(panelid).setTitle(paneltitle); // Need to set title of minimized south panel
this.dummyComponent.getEl().unmask();
this.dummyComponent.setVisible(false);
this.originalOwnerCt.insert(this.originalPosition, this);
this.originalOwnerCt.doLayout();
this.setSize(this.originalSize);
this.tools['maximize'].setVisible(true);

if (this.tools['toggle']) this.tools['toggle'].setVisible(true);
}


};

jsakalos
23 Mar 2008, 2:35 PM
Could you please somehow find out if this is problem of grid search plugin or that another extension? I do not use maximize tool and I'm now too busy to start investigation in this direction.

Thank you.

NotChris
24 Mar 2008, 5:04 AM
I've put in a request to the creator of the maximizetool plugin to see if the problem might lie with that plugin. I hope they are still reading the forum.

zoq
26 Mar 2008, 6:35 AM
What would be the best way to make the search start when the user entered more than e.g. 3 characters ? I tried something like that:



this.field.on('change', function() {

if (this.field.el.dom.value.length > 3)
{
this.onTriggerSearch();
}

}, this);


but that doesn't help me out ..


BTW, really great plugin, saved me a lot of time, U rock !

jsakalos
26 Mar 2008, 9:17 AM
You're not first who is calling for start searching at minimum characters typed so I'll most likely implement it soon.

zoq
26 Mar 2008, 11:15 AM
.... so I'll most likely implement it soon.

Good to know, thx !


in the meanwhile this added in the 'render' event of the triggerfield:


this.field.el.on('keyup', function() {

if (this.field.el.dom.value.length > 3)
{
this.onTriggerSearch();
}
},
this
);



does the job for me. I'm looking forward to your new version!

thx,

-Z.

mjlecomte
30 Mar 2008, 3:37 PM
Saki, I'm not currently using this plugin, but should you find this beneficial I thought I'd relay the post, seems like a good config option for this.

http://extjs.com/forum/showthread.php?p=144960#post144960

jsakalos
30 Mar 2008, 4:06 PM
Thanks MJ, I've implemented Condor's patch.

rednix
1 Apr 2008, 12:53 AM
Thanks for your great plugin Jozef.

I'd like to mention my customization on this plugin:

[1] Show the left separator in the toolbar only if there is already an item in the toolbar. In my opinion it doesn't look nice if there is a separator on the very left side without any other element before that.

[2] Instead of the field select menu optionally show only a label text (that might be the case if you just want to allow a search in a predefined/fixed selection of fields that the user should not change).

Code changes for [1]:

altered the onRender function - relevant/changed code block:

// handle position
if('right' === this.align) {
tb.addFill();
}
else {
if (tb.items.getCount() > 0) {
tb.addSeparator();
}
}
Code changes for [2]:

added new config parameter:

/**
* @cfg {Boolean} disableFieldSelection Instead of a menu only a label text is shown if true (defaults to false)
*/
,disableFieldSelection:false

altered the onRender function - relevant/changed code block:

// add menu button
tb.add({
text:this.searchText
,menu:(this.disableFieldSelection === true ? undefined : this.menu)
,iconCls:this.iconCls
});

jsakalos
1 Apr 2008, 4:50 AM
Re 1) OK, implemented in code.
Re 2) I've introduced new config variable readonlyIndexes that gives you more control over columns-to-search. Check out the source at http://gridsearch.extjs.eu

Thank you very much for ideas.

abhaysingh
4 Apr 2008, 4:43 AM
:)Can we change the default tag where the Grid is creating.
Right Now by default it's creating inside body. I want to change it to any other tag like div.

I want to do this b'coz I m displaying the grid inside some other page.
Right Now i am using iframe to overcome this problem..


Plz guide me on this...

Thanks in Advance

jsakalos
4 Apr 2008, 5:19 AM
I'm not sure if I'm getting the question... Is the question related to this plugin or is it a general grid question? If it is general, post please your query to Help Forum and if it is plugin related, please rephrase it as I don't understand.

abhaysingh
6 Apr 2008, 8:53 PM
I'm not sure if I'm getting the question... Is the question related to this plugin or is it a general grid question? If it is general, post please your query to Help Forum and if it is plugin related, please rephrase it as I don't understand.


It is indeed related to this plugin.
Right now the grid is created inside body tags but i wanted to create it inside div tag of my choice...The problem is that I want to embed the grid inside my project...and the grid is not coming properly since it's forming inside body tag.. So I am forced to use the iframe for that.

It is related to this particular grid since all other grid do provide renderto option which this plugin doesn't provide I tried using that option also... Please help me on that...

Thanx

abhaysingh
7 Apr 2008, 1:45 AM
Getting H is not defined..

What I did is incorporating it into my existing module. Defined a div tag with id 'ext-gen6' and add renderTo param wen creating new window object. It's throwing me the error H is not defined.

Can anyone guide me on this...

jsakalos
7 Apr 2008, 1:46 AM
Sure, but I need a simplified, runnable complete showcase that I can copy somewhere in ext directory tree and debug locally.

abhaysingh
7 Apr 2008, 4:13 AM
Sure, but I need a simplified, runnable complete showcase that I can copy somewhere in ext directory tree and debug locally.


This is the error I am getting from firebug...

H is null
http://............/ext/ext-all.js
Line 76

and this is the file where I am using it..


<html id="ext-gen10" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en"><head> <link rel="stylesheet" type="text/css" href="test/testtables/ext/ext-all.css"> <script type="text/javascript" src="test/testtables/ext/ext-base.js"></script> <script type="text/javascript" src="test/testtables/ext/ext-all.js"></script> <script type="text/javascript" src="test/testtables/ext/ext_search.js"></script> <script type="text/javascript" src="test/testtables/ext/ext_data1.js"></script> <script type="text/javascript"> Ext.BLANK_IMAGE_URL = 'test/testtables/ext/images/s.gif';Ext.onReady(function() { Ext.QuickTips.init(); var xg = Ext.grid; // shared reader var reader = new Ext.data.ArrayReader({}, [ {name: 'port'}, {name: 'cname'}, {name: 'mobile' }, {name: 'emailid'}, {name: 'city'} , {name: 'address'}, {name: 'gender'} ]); var grid1 = new xg.GridPanel({ store: new Ext.data.Store({ reader: reader, data: xg.dummyData// ,proxy: new Ext.data.MemoryProxy(xg.dummyData) }), cm: new xg.ColumnModel([ {id:'Portfolio',header: "Portfolio",width:30, dataIndex: 'port'}, {header: "Client Name",width:30,sortable:true, dataIndex: 'cname'}, {header: "Mobile",width:20,sortable:true,type: 'float', dataIndex: 'mobile'}, {header: "Email ID",width:40,sortable: true, dataIndex: 'emailid'}, {header: "City",width:20,sortable: true, dataIndex: 'city'}, {header: "Address",width:30,sortable: true, dataIndex: 'address'}, {header: "Gender",width:10,sortable: true, dataIndex: 'gender'} ]), viewConfig: { forceFit:true }, width: 600, height: 400, collapsible: true, animCollapse: true,// title: 'Expander Rows, Collapse and Force Fit', iconCls: 'icon-grid', bbar:[], plugins:[new Ext.ux.grid.Search({ mode:'local' ,iconCls:false// ,dateFormat:'m/d/Y' ,minLength:2// ,align:'right' })], renderTo: 'grid-det' }); alert (grid1.renderTo); var win = new Ext.Window({ width:840 ,id:'winid' ,height:480 ,layout:'fit' ,border:false ,closable:false ,title:'Client Details' ,items:[grid1] ,resizable:false ,draggable:false ,closable:false ,constrain:false ,constrainHeader:false ,plain:false ,minimizable:false ,maximizable:false ,minHeight:100 ,minWidth:200 ,expandOnShow:true ,closeAction:"close" ,collapsible:false ,initHidden:true ,monitorResize:false ,elements:"header,body" ,frame:true ,floating:true ,renderTo: 'grid-det' }); win.show(); }); </script><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta http-equiv="CACHE-CONTROL" content="NO-CACHE"><title>Welcome To FAAIDA</title><!--<script type="text/javascript" src="ajaxtabs.js"> --><link href="http://local.myiris.com/new_ifa/style.css" rel="stylesheet" type="text/css"></head><body class="ext-gecko" id="ext-gen6"><div id="maincontainer"><div id="topsection"><div id="ext-gen14" class="innertube"> <img src="http://local.myiris.com/new_ifa/images/logo.gif"></div><!-- </div></div> --><div id="modernbricksmenu2"><!--Changes made in CSS file--><ul><li align="center" style="margin-left: 3px;" id=""><a href="http://www.faaida.com/index.php"><b>Home</b></a></li><li align="center" id=""><a href="http://www.faaida.com/join.php"><b>Join Faaida</b></a></li><li align="center" id=""><a href="http://www.faaida.com/members.php"><b>Members Profile</b></a></li><li align="center" id=""><a href="http://www.faaida.com/news/index.php?news=1"><b>News</b></a></li><li align="center" id=""><a href="http://www.faaida.com/forums.php"><b>Discussion Forum</b></a></li><li align="center" id=""><a href="http://www.faaida.com/mutual/index.php?mpg=1"><b>Mutual Funds</b></a></li><li id="" style="border-right: medium none;"><a href="http://www.faaida.com/contactus.php"><b>Contact Us</b></a></li></ul></div><div id="contentwrapper"><div id="contentcolumn1"><div id="ext-gen12" class="innertube" style="margin-top: 1.5em;"><div style="font-size: 14px; text-transform: uppercase; padding-bottom: 5px;" width="100%"> Welcome <strong>Ashish Thakre</strong> <span style="padding-left: 50%; font-size: 14px; padding-bottom: 5px;"><strong><a href="changePwd.php">Change Password</a> | <a href="logout.php">Logout</a></strong></span></div><ul class="basictab"><li><a href="meeting.php">Meeting Schedule</a></li><li><a href="history.php">Meeting History</a></li><li><a href="ifa_profile.php">My Profile</a></li><li class="selected"><a href="view_client.php">Client Profile</a></li><li><a href="viewSubAgent.php">Sub-Broker</a></li><!-- <li><a href="portfolio.php">Portfolio</a></li> --><li><a href="purchase.php">Transaction</a></li><li><a href="viewOrder.php">Order Request</a></li><li><a href="orderBook.php">Order Book</a></li><li><!-- <a href="myirisplus_Request.php" style="margin-right: 0px;"> --><a id="ext-gen13" href="leads.php" style="margin-right: 0px;">Leads</a></li></ul> <div id="ext-gen6"> <!-- <iframe src="search_new.html?id=1" width="90%"height="500" border=0 align="center"> </iframe> --> </div> <br><div id="fm-submit" style="padding-top: 2px;"><a href="Main1.php"><img src="images/add.jpg" border="0"></a><a href="ifaEditClient.php"><img src="images/edit.jpg" border="0"></a><a href="ifaDeleteClient.php"> <img src="images/delete.jpg" border="0"></a><a href="view_client.php"><img src="images/view.jpg" border="0"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#" onclick="window.open('existingClientAdd.php','','width=700,height=420')">Upload client list</a></div> </div> </div> </div> <div id="footer"><a href="http://www.faaida.com/index.php">Home</a> | <a href="http://www.faaida.com/join.php">Join Faaida</a> | <a href="http://www.faaida.com/members.php">Members Profile</a> | <a href="http://www.faaida.com/news.php">News</a> | <a id="ext-gen11" href="http://www.faaida.com/forums.php">Discussion Forum</a> |<a href="http://www.faaida.com/mutualfunds.php">Mutual Funds</a> | [COLOR=red]<a href="http://www.faaida.com/contactus.php">Contact Us</a> <br>

mjlecomte
7 Apr 2008, 4:29 AM
Suggestions:
[LIST=1]
Read the FAQ.
Post in code tags so you end up with something nicer to look at, can you read what you posted? I started to format it a bit, but gave up early, this is your work...

[code]<html id="ext-gen10" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en"><head> <link rel="stylesheet" type="text/css" href="test/testtables/ext/ext-all.css">
<script type="text/javascript" src="test/testtables/ext/ext-base.js"></script>
<script type="text/javascript" src="test/testtables/ext/ext-all.js"></script> // USE DEBUG VERSION!!!
<script type="text/javascript" src="test/testtables/ext/ext_search.js"></script>
<script type="text/javascript" src="test/testtables/ext/ext_data1.js"></script>
<script type="text/javascript">
Ext.BLANK_IMAGE_URL = 'test/testtables/ext/images/s.gif';
Ext.onReady(function() {

Ext.QuickTips.init();

var xg = Ext.grid; // shared reader
var reader = new Ext.data.ArrayReader({}, [ {name: 'port'}, {name: 'cname'}, {name: 'mobile' }, {name: 'emailid'}, {name: 'city'} , {name: 'address'}, {name: 'gender'} ]);
var grid1 = new xg.GridPanel({
store: new Ext.data.Store({ reader: reader, data: xg.dummyData// ,
proxy: new Ext.data.MemoryProxy(xg.dummyData) }),
cm: new xg.ColumnModel([
{id:'Portfolio',header: "Portfolio",width:30, dataIndex: 'port'},
{header: "Client Name",width:30,sortable:true, dataIndex: 'cname'},
{header: "Mobile",width:20,sortable:true,type: 'float', dataIndex: 'mobile'},
{header: "Email ID",width:40,sortable: true, dataIndex: 'emailid'},
{header: "City",width:20,sortable: true, dataIndex: 'city'},
{header: "Address",width:30,sortable: true, dataIndex: 'address'},
{header: "Gender",width:10,sortable: true, dataIndex: 'gender'}
]),
viewConfig: { forceFit:true },
width: 600,
height: 400,
collapsible: true,
animCollapse: true,
// title: 'Expander Rows, Collapse and Force Fit',
iconCls: 'icon-grid',
bbar:[],
plugins:[
new Ext.ux.grid.Search({
mode:'local' ,
iconCls:false// ,
dateFormat:'m/d/Y' ,
minLength:2// ,
align:'right'
})
],
renderTo: 'grid-det'
});

alert (grid1.renderTo);

var win = new Ext.Window({
width:840 ,
id:'winid' ,
height:480 ,
layout:'fit' ,
border:false ,
closable:false ,
title:'Client Details' ,
items:[grid1] ,
resizable:false ,
draggable:false ,
closable:false ,
constrain:false ,
constrainHeader:false ,
plain:false ,
minimizable:false ,
maximizable:false ,
minHeight:100 ,
minWidth:200 ,
expandOnShow:true ,
closeAction:"close" ,
collapsible:false ,
initHidden:true ,
monitorResize:false ,
elements:"header,body" ,
frame:true ,
floating:true ,
renderTo: 'grid-det'
});

win.show();

});
</script>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta http-equiv="CACHE-CONTROL" content="NO-CACHE"><title>Welcome To FAAIDA</title><!--<script type="text/javascript" src="ajaxtabs.js"> --><link href="http://local.myiris.com/new_ifa/style.css" rel="stylesheet" type="text/css"></head><body class="ext-gecko" id="ext-gen6">

<div id="maincontainer"><div id="topsection"><div id="ext-gen14" class="innertube"> <img src="http://local.myiris.com/new_ifa/images/logo.gif"></div><!-- </div></div> --><div id="modernbricksmenu2"><!--Changes made in CSS file--><ul><li align="center" style="margin-left: 3px;" id=""><a href="http://www.faaida.com/index.php"><b>Home</b></a></li><li align="center" id=""><a href="http://www.faaida.com/join.php"><b>Join Faaida</b></a></li><li align="center" id=""><a href="http://www.faaida.com/members.php"><b>Members Profile</b></a></li><li align="center" id=""><a href="http://www.faaida.com/news/index.php?news=1"><b>News</b></a></li><li align="center" id=""><a href="http://www.faaida.com/forums.php"><b>Discussion Forum</b></a></li><li align="center" id=""><a href="http://www.faaida.com/mutual/index.php?mpg=1"><b>Mutual Funds</b></a></li><li id="" style="border-right: medium none;"><a href="http://www.faaida.com/contactus.php"><b>Contact Us</b></a></li></ul></div><div id="contentwrapper"><div id="contentcolumn1"><div id="ext-gen12" class="innertube" style="margin-top: 1.5em;"><div style="font-size: 14px; text-transform: uppercase; padding-bottom: 5px;" width="100%"> Welcome <strong>Ashish Thakre</strong> <span style="padding-left: 50%; font-size: 14px; padding-bottom: 5px;"><strong><a href="changePwd.php">Change Password</a> | <a href="logout.php">Logout</a></strong></span></div><ul class="basictab"><li><a href="meeting.php">Meeting Schedule</a></li><li><a href="history.php">Meeting History</a></li><li><a href="ifa_profile.php">My Profile</a></li><li class="selected"><a href="view_client.php">Client Profile</a></li><li><a href="viewSubAgent.php">Sub-Broker</a></li><!-- <li><a href="portfolio.php">Portfolio</a></li> --><li><a href="purchase.php">Transaction</a></li><li><a href="viewOrder.php">Order Request</a></li><li><a href="orderBook.php">Order Book</a></li><li><!-- <a href="myirisplus_Request.php" style="margin-right: 0px;"> --><a id="ext-gen13" href="leads.php" style="margin-right: 0px;">Leads</a></li></ul> <div id="ext-gen6"> <!-- <iframe src="search_new.html?id=1" width="90%"height="500" border=0 align="center"> </iframe> --> </div> <br><div id="fm-submit" style="padding-top: 2px;"><a href="Main1.php"><img src="images/add.jpg" border="0"></a><a href="ifaEditClient.php"><img src="images/edit.jpg" border="0"></a><a href="ifaDeleteClient.php"> <img src="images/delete.jpg" border="0"></a><a href="view_client.php"><img src="images/view.jpg" border="0"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a href="#" onclick="window.open('existingClientAdd.php','','w idth=700,height=420')">Upload client list</a></div> </div> </div> </div> <div id="footer"><a href="http://www.faaida.com/index.php">Home</a> | <a href="http://www.faaida.com/join.php">Join Faaida</a> | <a href="http://www.faaida.com/members.php">Members Profile</a> | <a href="http://www.faaida.com/news.php">News</a> | <a id="ext-gen11" href="http://www.faaida.com/forums.php">Discussion Forum</a> |<a href="http://www.faaida.com/mutualfunds.php">Mutual Funds</a> | <a href="http://www.faaida.com/contactus.php">Contact Us</a> <br>

mystix
7 Apr 2008, 5:32 AM
[QUOTE=abhaysingh;149073]
<html id="ext-gen10" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en"><head> <link rel="stylesheet" type="text/css" href="test/testtables/ext/ext-all.css"> <script type="text/javascript" src="test/testtables/ext/ext-base.js"></script> <script type="text/javascript" src="test/testtables/ext/ext-all.js"></script> <script type="text/javascript" src="test/testtables/ext/ext_search.js"></script> <script type="text/javascript" src="test/testtables/ext/ext_data1.js"></script> <script type="text/javascript"> Ext.BLANK_IMAGE_URL = 'test/testtables/ext/images/s.gif';Ext.onReady(function() { Ext.QuickTips.init(); var xg = Ext.grid; // shared reader var reader = new Ext.data.ArrayReader({}, [ {name: 'port'}, {name: 'cname'}, {name: 'mobile' }, {name: 'emailid'}, {name: 'city'} , {name: 'address'}, {name: 'gender'} ]); var grid1 = new xg.GridPanel({ store: new Ext.data.Store({ reader: reader, data: xg.dummyData// ,proxy: new Ext.data.MemoryProxy(xg.dummyData) }), cm: new xg.ColumnModel([ {id:'Portfolio',header: "Portfolio",width:30, dataIndex: 'port'}, {header: "Client Name",width:30,sortable:true, dataIndex: 'cname'}, {header: "Mobile",width:20,sortable:true,type: 'float', dataIndex: 'mobile'}, {header: "Email ID",width:40,sortable: true, dataIndex: 'emailid'}, {header: "City",width:20,sortable: true, dataIndex: 'city'}, {header: "Address",width:30,sortable: true, dataIndex: 'address'}, {header: "Gender",width:10,sortable: true, dataIndex: 'gender'} ]), viewConfig: { forceFit:true }, width: 600, height: 400, collapsible: true, animCollapse: true,// title: 'Expander Rows, Collapse and Force Fit', iconCls: 'icon-grid', bbar:[], plugins:[new Ext.ux.grid.Search({ mode:'local' ,iconCls:false// ,dateFormat:'m/d/Y' ,minLength:2// ,align:'right' })], renderTo: 'grid-det' }); alert (grid1.renderTo); var win = new Ext.Window({ width:840 ,id:'winid' ,height:480 ,layout:'fit' ,border:false ,closable:false ,title:'Client Details' ,items:[grid1] ,resizable:false ,draggable:false ,closable:false ,constrain:false ,constrainHeader:false ,plain:false ,minimizable:false ,maximizable:false ,minHeight:100 ,minWidth:200 ,expandOnShow:true ,closeAction:"close" ,collapsible:false ,initHidden:true ,monitorResize:false ,elements:"header,body" ,frame:true ,floating:true ,renderTo: 'grid-det' }); win.show(); }); </script><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta http-equiv="CACHE-CONTROL" content="NO-CACHE"><title>Welcome To FAAIDA</title><!--<script type="text/javascript" src="ajaxtabs.js"> --><link href="http://local.myiris.com/new_ifa/style.css" rel="stylesheet" type="text/css"></head><body class="ext-gecko" id="ext-gen6"><div id="maincontainer"><div id="topsection"><div id="ext-gen14" class="innertube"> <img src="http://local.myiris.com/new_ifa/images/logo.gif"></div><!-- </div></div> --><div id="modernbricksmenu2"><!--Changes made in CSS file--><ul><li align="center" style="margin-left: 3px;" id=""><a href="http://www.faaida.com/index.php"><b>Home</b></a></li><li align="center" id=""><a href="http://www.faaida.com/join.php"><b>Join Faaida</b></a></li><li align="center" id=""><a href="http://www.faaida.com/members.php"><b>Members Profile</b></a></li><li align="center" id=""><a href="http://www.faaida.com/news/index.php?news=1"><b>News</b></a></li><li align="center" id=""><a href="http://www.faaida.com/forums.php"><b>Discussion Forum</b></a></li><li align="center" id=""><a href="http://www.faaida.com/mutual/index.php?mpg=1"><b>Mutual Funds</b></a></li><li id="" style="border-right: medium none;"><a href="http://www.faaida.com/contactus.php"><b>Contact Us</b></a></li></ul></div><div id="contentwrapper"><div id="contentcolumn1"><div id="ext-gen12" class="innertube" style="margin-top: 1.5em;"><div style="font-size: 14px; text-transform: uppercase; padding-bottom: 5px;" width="100%"> Welcome <strong>Ashish Thakre</strong> <span style="padding-left: 50%; font-size: 14px; padding-bottom: 5px;"><strong><a href="changePwd.php">Change Password</a> | <a href="logout.php">Logout</a></strong></span></div><ul class="basictab"><li><a href="meeting.php">Meeting Schedule</a></li><li><a href="history.php">Meeting History</a></li><li><a href="ifa_profile.php">My Profile</a></li><li class="selected"><a href="view_client.php">Client Profile</a></li><li><a href="viewSubAgent.php">Sub-Broker</a></li><!-- <li><a href="portfolio.php">Portfolio</a></li> --><li><a href="purchase.php">Transaction</a></li><li><a href="viewOrder.php">Order Request</a></li><li><a href="orderBook.php">Order Book</a></li><li><!-- <a href="myirisplus_Request.php" style="margin-right: 0px;"> --><a id="ext-gen13" href="leads.php" style="margin-right: 0px;">Leads</a></li></ul> <div id="ext-gen6"> <!-- <iframe src="search_new.html?id=1" width="90%"height="500" border=0 align="center"> </iframe> --> </div> <br><div id="fm-submit" style="padding-top: 2px;"><a href="Main1.php"><img src="images/add.jpg" border="0"></a><a href="ifaEditClient.php"><img src="images/edit.jpg" border="0"></a><a href="ifaDeleteClient.php"> <img src="images/delete.jpg" border="0"></a><a href="view_client.php"><img src="images/view.jpg" border="0"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#" onclick="window.open('existingClientAdd.php','','width=700,height=420')">Upload client list</a></div> </div> </div> </div> <div id="footer"><a href="http://www.faaida.com/index.php">Home</a> | <a href="http://www.faaida.com/join.php">Join Faaida</a> | <a href="http://www.faaida.com/members.php">Members Profile</a> | <a href="http://www.faaida.com/news.php">News</a> | <a id="ext-gen11" href="http://www.faaida.com/forums.php">Discussion Forum</a> |<a href="http://www.faaida.com/mutualfunds.php">Mutual Funds</a> | [COLOR=red]<a href="http://www.faaida.com/contactus.php">Contact Us</a> <br>

mjlecomte
7 Apr 2008, 6:01 AM
if you stare REALLY hard at that red blob, it sorta pops out of the screen at you, like one of those psychadelic 3d posters. /:)

Too funny. :)) The poster felt that red was needed, so wasn't completely ignorant of styling.



[noparse]
[/ noparse]
[noparse]
[/ noparse]
[noparse]
[/ noparse]

I didn't realize that about the noparse. Good deal.

abhaysingh
7 Apr 2008, 9:07 PM
Thanks for all your help.I will try my code with ext-all-debug.js. But what is difference between ext-all and debug version.. any guidance will be appreciated..



I am really sorry about the unformatted post...
Thanks for pointing out...

Thanks in advance

jsakalos
8 Apr 2008, 3:14 AM
The only difference is that ext-all-debug.js is not compressed so it is human readable. ext-all.js is compressed, unreadable, loads faster though.

mjlecomte
8 Apr 2008, 4:00 AM
Thanks for all your help.I will try my code with ext-all-debug.js. But what is difference between ext-all and debug version.. any guidance will be appreciated..



I am really sorry about the unformatted post...
Thanks for pointing out...

Thanks in advanceIn addition to what Saki said, through the compression variable names are changed etc. The messages reported in firebug will be more descriptive (human readable) with the debug version.

AlxH
8 Apr 2008, 11:25 AM
If you have too much columns, the menu might exceed the window height (even though for searching there should not be included that much columns. but in other ext menus in general it might be a problem). To cope with it i once had this solution:


if (menu.getEl().getHeight()>400) {
menu.getEl().setStyle("overflow-y", "auto");
menu.getEl().setHeight(400);
}


Anyone has a better/simpler solution for this?
I saw a few posts about it in other forums, but no simple way.

jsakalos
8 Apr 2008, 11:40 AM
Menu is not currently scrollable in Ext, however, you can selectively disable (not show) columns that you do not want to search in.

cricri
12 Apr 2008, 2:10 AM
Hi Jozef,

Thanks for this great plug-in. I am trying to use it but I have a problem.
My Layout displays correctly (picture 1) but, when I add the plugin, the layout breaks (Picture 2).
Could you please help ?



ClientsGrid = Ext.extend(Ext.grid.GridPanel, {
layout: 'fit',
id: 'clients-grid',
objName: 'clients',
stateful: false,
enableColumnHide: false,
enableColumnMove: true,
border: false,
title: 'Liste des clients',
frame: false,

initComponent:function() {
Ext.apply(this, {
store:new Ext.data.Store({
proxy: new Ext.data.HttpProxy({ url: CDF_DOMAIN+'/webservice/get-client-list/' }),
reader: new Ext.data.JsonReader({
totalProperty: 'totalCount',
root: 'rows',
id: 'id',
fields: [ 'nom', 'prenom']
}),
remoteSort: false
}),
sm: new Ext.grid.RowSelectionModel(),
columns:[{
header: "Nom",
sortable: true,
dataIndex: 'nom',
id: 'client-nom'
},{
header: "Pr&eacute;nom",
sortable: true,
dataIndex: 'prenom',
id: 'client-prenom'
}],
viewConfig: {
forceFit:true
},
plugins: [new Ext.ux.grid.Search({
iconCls: 'icon-zoom',
mode: 'remote',
position: 'top',
checkIndexes: ['nom'],
showSelectAll: true
})],
tbar:[{
text: 'Ajouter',
iconCls: 'icon-plus',
listeners:{
scope: this,
click:{fn:this.addRecord, buffer:200}
}
}]
});
this.bbar = new Ext.PagingToolbar({
store: this.store,
displayInfo: false,
pageSize: 10
});
ClientsGrid.superclass.initComponent.apply(this, arguments);
this.store.load();
},

onRender:function() {
ClientsGrid.superclass.onRender.apply(this, arguments);
this.store.load({params:{start:0,limit:10}});

},

onRowContext : function(grid, row, e){
if(!this.menu) {
this.menu = new Ext.menu.Menu({
id: 'client-ctx',
listWidth: 200,
items: [{
text: '&Eacute;diter',
scope: this,
handler: function() {});
}
}]
});
}
if(!this.selModel.isSelected(row)){
this.selModel.selectRow(row);
}

this.menu.showAt(e.getXY());
},

addRecord: function(obj, evt) {

}
});
Ext.reg('clientsgrid', ClientsGrid);


And my layout :



Ext.onReady(function() {
Ext.QuickTips.init();
Ext.BLANK_IMAGE_URL = '/scripts/ext/resources/images/default/s.gif';
var viewport = new Ext.Viewport({
layout: 'border',
items: [{
xtype: 'clientsgrid',
margins: '3 3 3 3',
region: 'west',
width: 300,
collapsible: true,
animate: true,
layout: 'fit'
},{
xtype: 'panel',
title: 'D&eacute;tails',
margins: '3 3 3 0',
region: 'center'
}]
});
});

The only difference between pic1 anc 2 is


plugins: [new Ext.ux.grid.Search({
iconCls: 'icon-zoom',
mode: 'remote',
position: 'top',
checkIndexes: ['nom'],
showSelectAll: true
})],


I hope you can help.
Many thanks in advance.

jsakalos
12 Apr 2008, 2:59 AM
I do not see anything wrong with the code you posted; I only don't know how is the onRowContext related to it. Can you prepare a complete, simplified showcase that I can run and debug locally?

cricri
12 Apr 2008, 3:31 AM
Hi Jozef,

Thank you very much for your rapid answer.
I built a sample you can run locally.

Simply extract extjs 2.0.2 to scripts folder.
Please note that I have the same problem on Firefox and Safari 3.1.

Many thanks again for your help.

jsakalos
12 Apr 2008, 3:48 AM
No problem here, see attachment. Remove cookies or set stateful:false for all components during devel phase.

cricri
12 Apr 2008, 4:14 AM
I apologize. It's a stupid error.
My cookie is here from an old project and I used the same domain name.
Many thanks again for your time.

cricri
12 Apr 2008, 4:34 AM
I deleted all my cookies from all my browsers and I still
get the error.
Then I installed a brand new firefox on a recently installed windows and
I still have the problem.
Did you change the code on the sample ?

jsakalos
12 Apr 2008, 4:38 AM
Just references to Ext.

jsakalos
12 Apr 2008, 4:39 AM
Check if path to blank image is valid.

cricri
12 Apr 2008, 7:17 AM
Thanks for your help.
I give up.
I tried everything possible but it's not my day.

jsakalos
12 Apr 2008, 7:26 AM
OK, should you need any assistance tomorrow or later just let me know; I'll re-test it if necessary. BTW, IE?, doctype? - I haven't checked for these.

jsakalos
12 Apr 2008, 2:49 PM
@cricri,

1) your index.html is missing opening <html> tag
2) problem lies in main css. As soon as I removed link to it from index.html everything showed up neatly. I haven't analyzed what the problem is, I'm leaving it to you.

mjlecomte
12 Apr 2008, 5:21 PM
I was playing with this plugin and made an observation. I'm not sure if this is intended behavior or not.

Go here: http://recordform.extjs.eu/

On the search area click on the "X". I haven't explored the code to figure out what the intent is for that "X", but if you click on it right from the start it sends off an XHR.

Also note that the FIELDS were posted as well. I noticed this when I was checking server side if $fields was null when I construct my WHERE query. So it threw me off when I cancelled the search (so I thought) by clicking on the 'X' in the search form, but the search (1) submitted a request to the server and (2) included the fields in the POST sent to the server, which would be of no use if there is no query term to use in the search (so it struck me as odd that the search form was adding to the POST when it wasn't being used per se).

I wasn't sure if either of the above was expected behavior so I thought I'd mention it.

I also have two more comments which I'm reluctant even to mention, but will just in case it's of some use.

I use MySQL so this may be different from you where this does not affect you. I noticed in some of your php files you construct and use $table or $field and '$value' (note the single quote only on value. In my situation I had a $field that happened to have a value of 'change'. MySQL didn't like that field not wrapped with either a single quote or a back tick (`).

The last observation with the php file was with regards to building the $fields and $values where you use array_walk and implode, etc. All of that is fine and great, but I had a situation where I had a column in my grid that was not in the database table (it was calculated elsewhere). In any event, my point is, I simply added a check to see if the $field was in_array($the_object_fields_that_you_set_up). So just a quick little check to make sure the query wasn't built using fields that were not in the database table.

Again, these last two are rather application specific, but since I thought they could be generalized a bit I thought I'd point them out anyway.

mjlecomte
12 Apr 2008, 5:34 PM
As a follow up on my post above I've noticed that it appears that query and fields always get inserted into the POST.

I'm working from a perspective of the grid filters plugin where the POST is only populated from that plugin if it is active.

To put it another way, I was checking if fields or query is NULL to know whether or not to have the query affected by the search plugin, but that is not working because query will evaluate to an empty string not null.

jsakalos
12 Apr 2008, 8:15 PM
I was playing with this plugin and made an observation. I'm not sure if this is intended behavior or not.

Go here: http://recordform.extjs.eu/

On the search area click on the "X". I haven't explored the code to figure out what the intent is for that "X", but if you click on it right from the start it sends off an XHR.

Also note that the FIELDS were posted as well. I noticed this when I was checking server side if $fields was null when I construct my WHERE query. So it threw me off when I cancelled the search (so I thought) by clicking on the 'X' in the search form, but the search (1) submitted a request to the server and (2) included the fields in the POST sent to the server, which would be of no use if there is no query term to use in the search (so it struck me as odd that the search form was adding to the POST when it wasn't being used per se).

I wasn't sure if either of the above was expected behavior so I thought I'd mention it.

X is not cancel but clear what means clear the the textbox and reload the grid. True is that request is not needed if field is already clear (=== ''). I've enclosed the logic in if and tested briefly - seems to work. It is not published yet.



I also have two more comments which I'm reluctant even to mention, but will just in case it's of some use.

I use MySQL so this may be different from you where this does not affect you. I noticed in some of your php files you construct and use $table or $field and '$value' (note the single quote only on value. In my situation I had a $field that happened to have a value of 'change'. MySQL didn't like that field not wrapped with either a single quote or a back tick (`).
My real mySQL backend (never was and never will be published) looks different. PHP files in the examples are only-to-make-it-somehow-working to be able to demonstrate the functionality. I don't expect that users will take my files as they are and I do not provide any support for them whatsoever.



The last observation with the php file was with regards to building the $fields and $values where you use array_walk and implode, etc. All of that is fine and great, but I had a situation where I had a column in my grid that was not in the database table (it was calculated elsewhere). In any event, my point is, I simply added a check to see if the $field was in_array($the_object_fields_that_you_set_up). So just a quick little check to make sure the query wasn't built using fields that were not in the database table.

Again, these last two are rather application specific, but since I thought they could be generalized a bit I thought I'd point them out anyway.See my previous answer - real backend has all the bells and whistles, support for expressions, backticks, support for cross-database queries, auto generating data for combos, configuration objects save in table, generating column models for metaData configured grids and much more.

I couldn't use it for examples as 1) I've decided that it will not be open source and 2) I wanted to give users ideas how the server side could work. (I doubt that they would study 10000+ lines of PHP code to find out that it finally sends out {success:true}).

Therefore I've written all PHP scrips what you can see in examples as extra-extra lightweight from scratch.

jsakalos
12 Apr 2008, 8:25 PM
As a follow up on my post above I've noticed that it appears that query and fields always get inserted into the POST.

I'm working from a perspective of the grid filters plugin where the POST is only populated from that plugin if it is active.

To put it another way, I was checking if fields or query is NULL to know whether or not to have the query affected by the search plugin, but that is not working because query will evaluate to an empty string not null.

Empty query cancels the build of sql where clause server-side and fields array is information: If we're going to search, where to search?

I real life I use mysql's rlike so I can type regular expressions. Also, I have some server-side operators recognition and handling for example: it recognizes the keyword null, >, <, = and ! operators, etc. Of course, these make sense only if you search in one field only.

More complex filter is still to be written and it is beyond the scope of the purpose of this search plugin.

mjlecomte
13 Apr 2008, 5:40 AM
Another observation of possibly unintended behavior:
If you type "n" in the search field and the click search it will of course search on "n". If you click in the search field and delete "n", but then don't click on x or zoom icon then the post is not reset. I of course was doing this somewhat based on the prior comments where I didn't want to have a search submitted to the server.

I can see why it works as it does. I just thought I'd make the remark in case you thought it should check the search field contents prior to searching.

crpatrick
15 Apr 2008, 7:55 PM
Hi there-

I noticed in the posts that for paged grids, the search must be done server side? Is there a way to search the store with the plugin using the local mode? I am actually streaming into a paging grid, and storing everything client side in a bufferedmemoryproxy. All is set to local, but within the paging grid, I can only ever search the current page (and since the data is streaming directly to the client, I can't do a server side sort unfortunately).

Great job again on this!
Chris

galdaka
15 Apr 2008, 10:42 PM
Hi there-

I noticed in the posts that for paged grids, the search must be done server side? Is there a way to search the store with the plugin using the local mode? I am actually streaming into a paging grid, and storing everything client side in a bufferedmemoryproxy. All is set to local, but within the paging grid, I can only ever search the current page (and since the data is streaming directly to the client, I can't do a server side sort unfortunately).

Great job again on this!
Chris

http://extjs.com/forum/showthread.php?p=111830#post111830

crpatrick
16 Apr 2008, 8:20 AM
Hi there...I had read through that, but don't think that answers what I am looking for. I am already setting to local mode (remote isn't in the picture for my code). Not sure if I am missing something in that post though? Looked through again, and didn't see a reference to local mode/pagination with the bufferproxy.

Hope all is well.
Chris

jsakalos
16 Apr 2008, 1:20 PM
grid.Search plugin has mode:'local' option that causes it filters local store. Take a look in the comments in source code; there is complete documentation of it. As to in-memory paging grids, I've never tried 'em - you're on your own here.

pantarhei
28 Apr 2008, 5:10 AM
thx a lot for this great plugin. works great! really nice.

i have a question, though. how can i get the last query send to the server including the plugin params?

if i look into the store.baseParams.lastOptions i can see only the baseParams of my store. looks like the query fileds and params are added dynamically. but i'd like to have the last params including the plugin params.

hints?

regards

jsakalos
28 Apr 2008, 5:11 AM
I think that you need to listen to an event (perhaps beforeload) and you need to collect and remember parameters/options yourself.

pantarhei
28 Apr 2008, 7:13 AM
was my fault. store.baseParams.lastOptions is working like expected. :)

thx for your fast reply!

cobnet
28 Apr 2008, 8:35 PM
I came across this plugin while studying your record-form plugin. As I can see you can mult-select columns for your search. The app I was looking at using this plugin for, could not accept mult-select columns in the search, it had to search one column at a time. So I looked thru the grid.search.js file and came up with a possible new cofig solution?

1st added new config option:


/**
* @cfg {Boolean} groupType e.g. [true or false] true=radio, false=checkbox
*/
,groupType:false



Next added 2 lines (both in green) to the reconfigure function:


/**
* private (re)configures the plugin, creates menu items from column model
*/
,reconfigure:function() {

// {{{
// remove old items
var menu = this.menu;
menu.removeAll();

// add Select All item plus separator
if(this.showSelectAll) {
menu.add(new Ext.menu.CheckItem({
text:this.selectAllText
,checked:!(this.checkIndexes instanceof Array)
,hideOnClick:false

,group:this.groupType

,handler:function(item) {
var checked = ! item.checked;
item.parentMenu.items.each(function(i) {
if(item !== i && i.setChecked && !i.disabled) {
i.setChecked(checked);
}
});
}
}),'-');
}

// }}}
// {{{
// add new items
var cm = this.grid.colModel;
Ext.each(cm.config, function(config) {
var disable = false;
if(config.header && config.dataIndex) {
Ext.each(this.disableIndexes, function(item) {
disable = disable ? disable : item === config.dataIndex;
});
if(!disable) {
menu.add(new Ext.menu.CheckItem({
text:config.header
,hideOnClick:false

,group:this.groupType

,checked:'all' === this.checkIndexes
,dataIndex:config.dataIndex
}));
}
}
}, this);
// }}}
// {{{
// check items
if(this.checkIndexes instanceof Array) {
Ext.each(this.checkIndexes, function(di) {
var item = menu.items.find(function(itm) {
return itm.dataIndex === di;
});
if(item) {
item.setChecked(true, true);
}
}, this);
}
// }}}
// {{{
// disable items
if(this.readonlyIndexes instanceof Array) {
Ext.each(this.readonlyIndexes, function(di) {
var item = menu.items.find(function(itm) {
return itm.dataIndex === di;
});
if(item) {
item.disable();
}
}, this);
}
// }}}

} // eo function reconfigure


Interesting! With these small changes I went from a "checkbox" to a "radiogroup" in nothing flat. All seems to work correctly, so I thought I would pass it along for others? Please pass along if I don't see a problem that could be created with such changes?


Once again a great plugin, thanks saki!

jsakalos
29 Apr 2008, 3:01 AM
Perfect!

Very good idea. I have implemented it as new config property menuStyle that can be 'checkbox' (default) or 'radio'

Grab devel version from http://gridsearch.extjs.eu

Thanks cobnet.

stevchen
7 May 2008, 12:12 AM
hallo,

i use your package : import com.gwtextux.client.widgets.grid.plugins.GridSearchPlugin;

its works only on loaded page, i have 3000 data, how can i make it for all my data ?


http://gwt-ext.com/wiki/index.php/Tutorial:Introduction_to_GWT-Ext_2.0

my java code:


package com.gpcom.gppackage.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;
//import com.gwtext.client.core.SortDir;
import com.gwtext.client.core.TextAlign;
import com.gwtext.client.data.*;
import com.gwtext.client.util.DateUtil;
import com.gwtext.client.util.Format;
import com.gwtext.client.widgets.*;
import com.gwtext.client.widgets.event.ButtonListenerAdapter;
import com.gwtext.client.widgets.event.PanelListenerAdapter;
import com.gwtext.client.widgets.grid.*;
import com.gwtextux.client.widgets.grid.plugins.GridSearchPlugin;

import java.util.Date;

public class TheGridPaging implements EntryPoint {

private GridPanel grid;
private boolean showPreview = true;

private Renderer renderTopic = new Renderer() {
public String render(Object value, CellMetadata cellMetadata, Record record,
int rowIndex, int colNum, Store store) {
return Format.format("<b><a href=\"http://extjs.com/forum/showthread.php?t={2}\" target=\"_blank\">{0}</a></b> <a href=\"http://extjs.com/forum/forumdisplay.php?f={3}\" target=\"_blank\">{1} Forum</a>",
new String[]{(String) value,
record.getAsString("forumtitle"),
record.getId(),
record.getAsString("forumid"),
});
}
};

private Renderer renderLast = new Renderer() {
public String render(Object value, CellMetadata cellMetadata, Record record, int rowIndex,
int colNum, Store store) {
Date lastPost = record.getAsDate("lastpost");
String lastPostStr = DateUtil.format(lastPost, "M j, Y, g:i a");
return Format.format("{0}<br/>by {1}", new String[]{lastPostStr, record.getAsString("lastposter")});
}
};

public void onModuleLoad() {
Panel panel = new Panel();
panel.setBorder(false);
panel.setPaddings(15);

DataProxy dataProxy = new ScriptTagProxy("http://extjs.com/forum/topics-browse-remote.php");

final RecordDef recordDef = new RecordDef(new FieldDef[]{
new StringFieldDef("title"),
new StringFieldDef("forumtitle"),
new StringFieldDef("forumid"),
new StringFieldDef("author"),
new IntegerFieldDef("replycount"),
new DateFieldDef("lastpost", "lastpost", "timestamp"),
new StringFieldDef("lastposter"),
new StringFieldDef("excerpt")
});
JsonReader reader = new JsonReader(recordDef);
reader.setRoot("topics");
reader.setTotalProperty("totalCount");
reader.setId("threadid");

// final Store store = new Store(dataProxy, reader, true);
// store.setDefaultSort("lastpost", SortDir.DESC);

final GroupingStore store = new GroupingStore();
store.setReader(reader);
store.setDataProxy(dataProxy);
// store.setSortInfo(new SortState("title", SortDir.ASC));
// store.setGroupField("author");
store.setRemoteGroup(true);
store.setRemoteSort(true);
store.load();




ColumnConfig topicColumn = new ColumnConfig("Topic", "title", 420, true, renderTopic, "topic");
topicColumn.setCss("white-space:normal;");

ColumnConfig authorColumn = new ColumnConfig("Author", "author", 100, true);
authorColumn.setHidden(true);

ColumnConfig repliesColumn = new ColumnConfig("Replies", "replycount", 70, true);
repliesColumn.setAlign(TextAlign.RIGHT);

ColumnConfig lastPostColumn = new ColumnConfig("Last Post", "lastPost", 150, true, renderLast, "last");

ColumnModel columnModel = new ColumnModel(new ColumnConfig[]{
topicColumn,
authorColumn,
repliesColumn,
lastPostColumn
});
columnModel.setDefaultSortable(true);

grid = new GridPanel();
grid.setWidth(700);
grid.setHeight(500);
grid.setTitle("Remote Paging Grid ");
grid.setStore(store);
grid.setColumnModel(columnModel);
grid.setTrackMouseOver(false);
grid.setLoadMask(true);
grid.setSelectionModel(new RowSelectionModel());
grid.setFrame(true);
grid.setStripeRows(true);
grid.setIconCls("grid-icon");

// GridView view = new GridView() {
// public String getRowClass(Record record, int index, RowParams rowParams, Store store) {
// if (showPreview) {
// rowParams.setBody(Format.format("<p>{0}</p>", record.getAsString("excerpt")));
// return "x-grid3-row-expanded";
// } else {
// return "x-grid3-row-collapsed";
// }
// }
// };
// view.setForceFit(true);
// view.setEnableRowBody(true);
// grid.setView(view);

GroupingView gridView = new GroupingView();
gridView.setForceFit(true);
gridView.setGroupTextTpl("{text} ({[values.rs.length]} {[values.rs.length > 1 ? \"Items\" : \"Item\"]})");
grid.setView(gridView);




Toolbar topToolbar = new Toolbar();
topToolbar.addFill();
grid.setTopToolbar(topToolbar);

GridSearchPlugin gridSearch = new GridSearchPlugin(GridSearchPlugin.TOP);
gridSearch.init(grid);
gridSearch.setMode(GridSearchPlugin.REMOTE);


grid.addPlugin(gridSearch);


PagingToolbar pagingToolbar = new PagingToolbar(store);
pagingToolbar.setPageSize(25);
pagingToolbar.setDisplayInfo(true);
pagingToolbar.setDisplayMsg("Displaying topics {0} - {1} of {2}");
pagingToolbar.setEmptyMsg("No topics to display");

pagingToolbar.addSeparator();
ToolbarButton toolbarButton = new ToolbarButton("Show Preview");
toolbarButton.setPressed(showPreview);
toolbarButton.setEnableToggle(true);
toolbarButton.setCls("x-btn-text-icon details");
toolbarButton.addListener(new ButtonListenerAdapter() {
public void onToggle(Button button, boolean pressed) {
toggleDetails(pressed);
}
});

pagingToolbar.addButton(toolbarButton);
grid.setBottomToolbar(pagingToolbar);

grid.addListener(new PanelListenerAdapter() {
public void onRender(Component component) {
store.load(0, 25);
}
});
panel.add(grid);

RootPanel.get().add(panel);
}

private void toggleDetails(boolean pressed) {
showPreview = pressed;
grid.getView().refresh();
}
}


my html code:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<meta http-equiv="Content-Author" content="Stev" />
<title>Hello World</title>
<!-- The GWT js file generated at run time -->


<link rel="stylesheet" href="js/ext/resources/css/ext-all.css"/>
<script language="javascript" src="js/ext/adapter/ext/ext-base.js"></script>
<script language="javascript" src="js/ext/ext-all.js"></script>

<script language='javascript' src='com.gpcom.gppackage.TheGridPaging.nocache.js'></script>



</head>

<body>
<div id="main"></div>
</body>

</html>



and the last, my xml code:


<module>
<!-- Inherit the core Web Toolkit stuff. -->
<inherits name='com.google.gwt.user.User'/>
<!-- Inherit the GWTExt Toolkit library configuration. -->
<inherits name='com.gwtext.GwtExt' />
<inherits name='com.gwtextux.GwtExtUx'/>
<!-- Specify the app entry point class. -->
<entry-point class='com.gpcom.gppackage.client.TheGridPaging'/>

<!--
<stylesheet src="js/ext/resources/css/ext-all.css" />
<script src="js/ext/adapter/ext/ext-base.js" />
<script src="js/ext/ext-all.js" />
-->
</module>

jsakalos
7 May 2008, 1:24 AM
Sorry, but I know nothing about how Grid Search is integrated into GWT as I neither assisted to the integration nor I'm using GWT.

Best would be to contact Sanjiv, the author of GWT-Ext.

keithnlarsen
7 May 2008, 10:15 AM
Another great tool, thanks a lot! I made a couple changes just to make the 'X' disappear if there is nothing set in the search text.

I never realized how useful plugins are until looking at you code. I was writing an extension on my own for this, but the plugin idea is great as you don't have to set the store object, just grab it from the grid which gets passed to you in the init, very nice indeed. The paging toolbar could also benefit from being a plugin... I think I'll do that...

Anyhow, I use this plugin on the top of my grid, and was wondering if there is an easy way to make it stretch to fit 100% of the width of the grids toolbar? I tried Anchor, but I think that only works for forms. Any ideas?

I included a picture just to show how I'm using it...

jsakalos
7 May 2008, 11:16 AM
There is property width that should be in pixel, of course you can try to set it to '100%' to see what happens.

keithnlarsen
7 May 2008, 12:43 PM
There is property width that should be in pixel, of course you can try to set it to '100%' to see what happens.

Yeah I already tried all that kinda of stuff, setting the style, setting the width, etc. I think I might have to listen to the containers resize event, and then set the size of the search.

Thanks anyways.

zedisdead
12 May 2008, 12:40 PM
I added some new features:


Possibility to alternate the search plugin's funcionality mode ['local', 'remote'] on fly
On the local mode, after every 'keyup' the filter is updated
The clear filter is hidden and only became available if there is some thing to clean on the textfield
If there aren't any characters on the textfield, the filter is reseted


new attributes:


modeText:['Remote', 'Local']
disableModeSelection:false


Thanks.
Marcelo Moises

medley
19 May 2008, 11:39 PM
Hello,

I have a gridSearch plug-in into my gridPanel



// create the grid
TOP.grid.receivedAMListGrid = new Ext.grid.GridPanel({
id:'receivedAMListGrid',
store: TOP.store.receivedAMListStore,
deferredRender:false,
waitMsgTarget: true,
loadMask:true,
collapsible : true,
columns: [
{id:'torisDocumentId',header: TOP.columnName.aNumber, width: 90, dataIndex: 'torisA6b6c6', sortable: true},
{id:'torisOrder',header: "Number", width: 40, dataIndex: 'torisOrder', sortable: true},
{id:'torisAMLanguage',header: "Language", width: 50, dataIndex: 'torisAMLanguage', sortable: true},
{id:'torisProcedureNumber',header: "Procedure Number", width: 90, dataIndex: 'torisProcedureNumber', sortable: true},
{id:'torisLocation',header: "Title", width: 90, dataIndex: 'torisLocation', sortable: true},
{id:'torisAuteur',header: "Authors", width: 90, dataIndex: 'torisAuteur', sortable: true},
TOP.actions.receivedAMActions
],
plugins:[TOP.actions.receivedAMActions,
new Ext.ux.grid.Search({
mode:'local'
,iconCls:'icon-search'
,dateFormat:'m/d/Y'
,minLength:2
})],
renderTo:receivedAMList,
title:'receivedAM',
width: 990,
height:300,
view: new Ext.grid.GroupingView({
forceFit:true,
scrollOffset: 0,
startCollapsed : true,
groupTextTpl: '{[values.rs[0].data["torisA6b6c6"]]} - {[values.rs[0].data["torisProcedureNumber"]]} - {[values.rs[0].data["torisCommmittee"]]} - {[values.rs[0].data["torisTitle"]]} - ({[values.rs.length]})'
}),
frame:false,
stripeRows : true,
bbar: new Ext.PagingToolbar({
pageSize: 5,
store: TOP.store.receivedAMListStore,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display"
})

});

TOP.grid.receivedAMListGrid.render();
TOP.store.receivedAMListStore.load({params:{start:0, limit:5}});


But the field to enter the search text does not appear.

Medley

jsakalos
20 May 2008, 12:09 AM
Any error? Have you got code from my site or the post above? If from post above, I do not provide any support for possible branches.

medley
20 May 2008, 12:16 AM
It was from your website. I downloaded the following files : Ext.ux.grid.Search.js (http://gridsearch.extjs.eu/source.php?file=js/Ext.ux.grid.Search.js) and gridsearch.css (http://gridsearch.extjs.eu/source.php?file=css/gridsearch.css)

The list of fields appears (see attachment) and any errors.

Medley

jsakalos
20 May 2008, 12:24 AM
Hmm, I see it for the first time; have no quick-fix idea. However, I doubt it is a problem in the plugin itself - I use it too often so I would have already discovered it.

Try to strip down your grid to a minimum, get it working and then add features/config options one by one to see when it stops to work.

medley
20 May 2008, 3:19 AM
I know that it is not a problem of the plug-in. I removed calls of somes scripts files I don't use anymore. And It works now.
Thanx for this plug-in.

Medley

zhiliang
22 May 2008, 9:33 AM
Hi Jsakalos,
i try to use your search plugin, and i use the same method, i got the code from your site, but when i try to create instance of the csql, it doesn't work, hope you can help me

i cope the csql.php from the site and $osql = new csql() i am really confused, is there some parts i need to modify in csql? thanks for your help


function searchGridData(){

//require("csql.php");
require ('csql.php');

if(!isset($_REQUEST["cmd"])) {
return;
}

$objects = array(
// {{{
// test
"test"=>array(
"table"=>"v_gridsearch"
,"idName"=>"testid"
,"fields"=>array(
"testid"
,"application"
,"test"
,"description"
,"status"
,"login"
,"team"
,"priority"
,"type"
,"duration"
,"comment"
,"at"
,"last_tester"
,"release"
,"environment"
,"iditrackco"
,"lastmodifiedby"
,"idco"
,"responsible"
,"function"
)
)
// }}}
);

// create PDO object and execute command
//echo'test';
$osql = new csql();
echo'test';

$_REQUEST["cmd"]($osql);

// command processors

function getData($osql) {
global $objects;
$params = $objects[$_REQUEST["objName"]];


$params["start"] = isset($_REQUEST["start"]) ? $_REQUEST["start"] : null;
$params["limit"] = isset($_REQUEST["limit"]) ? $_REQUEST["limit"] : null;
$params["search"] = isset($_REQUEST["fields"]) ? json_decode($_REQUEST["fields"]) : null;
$params["query"] = isset($_REQUEST["query"]) ? $_REQUEST["query"] : null;
$params["sort"] = isset($_REQUEST["sort"]) ? $_REQUEST["sort"] : null;
$params["dir"] = isset($_REQUEST["dir"]) ? $_REQUEST["dir"] : null;

$response = array(
"success"=>true
,"total"=>$osql->getCount($params)
,"griddata"=>$osql->getData($params)
);
$osql->output($response);

} // eo function getData


function saveData($osql) {
global $objects;
$params = $objects[$_REQUEST["objName"]];
unset($params["fields"]);

$params["data"] = json_decode($_REQUEST["data"]);
$osql->output($osql->saveData($params));

} // eo function saveData



}//end searchGridData

ArtBuilders
22 May 2008, 11:45 AM
But the field to enter the search text does not appear.

Medley

A little different from what's discribed by medley but I also had an issue with the search field not rendering (in my case on an inactive tab). The solution was to change defferedRender to 'true' which seemed to resolved the issue.



new Ext.TabPanel({
region:'center',
deferredRender:true,
activeTab:0,
defaults:{layout:'fit'},
items:[{
contentEl:'center-welcome',
title: 'Welcome!',
closable:false,
autoScroll:true,
bodyStyle:'padding:10px',
html:'Welcome to ....'
},{
contentEl:'center-invoice-grid',
title: 'Invoices',
items:[grid1],
autoScroll:true
}]
})

jsakalos
22 May 2008, 1:45 PM
@zhiliang (http://extjs.com/forum/member.php?u=36246),
it is impossible to evaluate statement "it doesn't work", so just generally: see what is difference between my and your code.

jsakalos
22 May 2008, 1:51 PM
I have added this plugin to the example at http://examples.extjs.eu/?ex=gridintab. This example specifically deals with rendering grid into an inactive tab.

Take a look and report errors if any.

Thanks,

ArtBuilders
22 May 2008, 8:03 PM
I have added this plugin to the example at http://examples.extjs.eu/?ex=gridintab. This example specifically deals with rendering grid into an inactive tab.

Take a look and report errors if any.

Thanks,

Sample looks good. I should have mentioned that I'm adding a gridpanel to a tabpanel inside a border layout. My issue may've been one of the order elements are being created. With that said, don't sweat my issue. Setting "deferredRender:true" on the tabpanel seems to work for now (and I know you have a full plate as it). Thanks again for the sample.

jsakalos
23 May 2008, 1:04 AM
It shouldn't matter if it is in tab-in-window or tab-in-border-layout. The key is lazy instantiation and rendering.

See http://blog.extjs.eu/know-how/writing-a-big-application-in-ext/ for details.

ArtBuilders
23 May 2008, 8:52 AM
It shouldn't matter if it is in tab-in-window or tab-in-border-layout. The key is lazy instantiation and rendering.

See http://blog.extjs.eu/know-how/writing-a-big-application-in-ext/ for details.
Good article... well reasoned. Hate to be a broken record but you rock! Thanks for the clear samples (that I blatently lifted and patched together below ;) ). Since I sort of hijaacked this thread, below is the complete code if anyone else is looking to include the search plugin in inactive tab within a border layout (though, like jsakalos said, the border layout is not really relevant).


Ext.ns('Example');
Ext.BLANK_IMAGE_URL = '/dashboard/common/include/lib/ext/resources/images/default/s.gif';

// example grid pre-configured class
Example.Grid = Ext.extend(Ext.grid.GridPanel, {
initComponent:function() {
Ext.apply(this, {
store:new Ext.data.JsonStore({
id:'company',
totalProperty:'totalCount',
root:'rows',
url:'samples/get-grid-data.php',
fields:[
{name:'company'} ,
{name:'price', type:'float'},
{name:'change', type:'float'} ,
{name:'pctChange', type:'float'} ,
{name:'lastChange', type:'date', dateFormat:'n/j h:ia'},
{name:'industry'},
{name:'desc'}
]
}) ,
columns:[{
id:'company' ,
header:"Company",
width:40, sortable:true,
dataIndex:'company'
},{
header:"Price" ,
width:20 ,
sortable:true,
renderer:Ext.util.Format.usMoney,
dataIndex:'price'
},{
header:"Change",
width:20,
sortable:true,
dataIndex:'change'
},{
header:"% Change",
width:20,
sortable:true ,
dataIndex:'pctChange'
},{
header:"Last Updated",
width:20, sortable:true,
renderer:Ext.util.Format.dateRenderer('m/d/Y'),
dataIndex:'lastChange'
}] ,
viewConfig:{forceFit:true},
tbar:[],
plugins:[new Ext.ux.grid.Search({
mode:'local',
width:320,
iconCls:false,
dateFormat:'m/d/Y',
minLength:2,
position:'top'
})]
}); // eo apply

// call parent
Example.Grid.superclass.initComponent.apply(this, arguments);
}, // eo function initComponent
onRender:function() {
// call parent
Example.Grid.superclass.onRender.apply(this, arguments);
// load the store
this.store.load({params:{start:0, limit:10}});
} // eo function onRender

});
Ext.reg('examplegrid', Example.Grid);
// application main entry point
Ext.onReady(function() {

Ext.QuickTips.init();

var viewport = new Ext.Viewport({
layout:'border',
items:[{
region:'north',
title:'North',
height:100
/*,contentEl:'adsense-north'*/
},{
region:'center',
layout:'fit',
/*title:'Center',*/
items:[{
xtype:'tabpanel',
defaults:{layout:'fit'},
activeItem:0,
items: [{
title:'First Tab (a test of the very long label)',
id:'firsttab',
iconCls:'icon-ok',
bodyStyle:'padding:10px',
html:'Click on Grid Tab to instantiate and render the grid.'
},{
title:'Grid Tab',
id:'gridtab',
xtype:'examplegrid',
autoScroll:true
}]
}]
},{
region:'west',
title:'West',
width:220,
split:true,
collapsible:true
}]
});
}); // eo function onReady

jsakalos
27 May 2008, 1:38 PM
Hi all,

I've just released version 1.1 of Grid Search Plugin and uploaded it to http://gridsearch.extjs.eu.

What's new?

Plugin now supports minChars config option which, if > 0, causes the plugin to start search after minChars number of characters has been typed in the search field.

Further, it supports autoFocus config option that, if true, tries to focus the search field on each store load.

Enjoy!

PS: Don't forget to refresh your cache if you've already been there...

elDub
2 Jun 2008, 8:25 AM
Howdy Saki,

I just started using your GridSearch plugin... as usual, great work. I think there might be an issue when using the minChars option though. When using this, clicking on the 'X' does nothing. That's probably a real simple fix I assume.

Thanks for the great stuff.

-Lonnie

jsakalos
2 Jun 2008, 8:39 AM
It was bug in fact, thank you for pointing out. It's fixed in devel version.

Riri
12 Jun 2008, 1:11 AM
Hello,

We are using 'gridsearch' plugin and it works fine.
But, we are disapointed that no "IDs" are specified in this plugin for all generated fields/buttons.

We have a team that do some automatic tests and they need Ids to be able to test this extjs element.

Could it be possible to add such Id facility on each generated elements to indicate our own Ids when creating this plugin element ... ?

Thanks in advance ...

jsakalos
12 Jun 2008, 11:58 PM
Id(s) of which element(s) you need?

Riri
13 Jun 2008, 12:41 AM
Hello,

I need Ids on




- the button which display the list of columns to search in
- the popup list where we choose the columns (if possible)
- the "search input" field
- the "cancel" button
- the "search" button




Do you think it is possible to get all these Ids ?

Thanks in advance.
Riri.

jsakalos
14 Jun 2008, 6:56 AM
Well, everything is possible, the question is if it is worth the work needed. If it would be for adding some functionality or debugging I'd do it. To satisfy a testing program, with the risk of introducing new bugs just seems worthless to me. Of course, you are free to modify the plugin if you want.

Riri
16 Jun 2008, 1:22 AM
Hello again,

I'm sure that our team is not the only one who would like to have this kind of facility !
Because many other teams have to perform "acceptance testing" of application build using Extjs... (see forum about this subject).
Maybe, i'm just the first one who has to test the use of this plugin ...

So, I don't believe that it will be a worth of time to only add Ids on these plugins items.

We already did it in the plugin and no bugs appears due to this modification ...
BUT we woul'd prefer that you do it into the official release, because at each new release, the dev team will have to redo this job again, and again and again ... ... ...

If it's included into the "official" release, it will be a gain of time for everybody, not ?

Thanks to consider this.

jsakalos
16 Jun 2008, 3:37 AM
Can you post the patch? I'll investigate it and if it doesn't break anything I'll include it in the release.

Riri
17 Jun 2008, 1:40 AM
Hello jsakalos,

Please find attached our proposal to add Ids on your plugins.
We tested it in our labo and its works fine ! :)

Please, find below how to define your plugin:


TP.grid.search = new Ext.ux.grid.Search({
id:'searchButton2'
,inputId:'inputSearchField2'
,iconCls:'icon-search'
,searchText:'Search'
,mode:'local'
,searchTipText:'enter a text'
});



Please find below the proposal of the plugin code:
We only add Ids for the "menu button" and the "input field"
Changes are highlighted in bold red in the code.




/*global Ext */


Ext.ns('Ext.ux.grid');



.. etc ..




// add menu button
tb.add({
text:this.searchText
,menu:this.menu
,iconCls:this.iconCls
,id:this.id
});




// add input field (TwinTriggerField in fact)
this.field = new Ext.form.TwinTriggerField({
id:this.inputId,
width:this.width
,selectOnFocus:undefined === this.selectOnFocus ? true : this.selectOnFocus
,trigger1Class:'x-form-clear-trigger'
,trigger2Class:'x-form-search-trigger'
,onTrigger1Click:this.onTriggerClear.createDelegate(this)
,onTrigger2Click:this.onTriggerSearch.createDelegate(this)
,minLength:this.minLength
});


.. etc ...


Thanks in advance to included it in your next official release ...
Riri.

rainydays
17 Jun 2008, 5:03 AM
First of all, thank you for this sweet plugin!

I have one issue though, I tried searching for an answer but couldn't find one.

Is there an easy way to make checkbox-selections persistent when a row is hidden while searching the grid?

Consider the following scenario:

1. The admin will select several users in a grid using the checkboxselectionmodel

2. The admin searches for one user using the grid search plugin (local mode), then checks that user

3. The admin searches for another use and checks that user

4. The user that was first selected has now been deselected since that row wasn't visible in the second search (had it been visible it would still have been selected).

I suspect that the same issue will arise with paged grids (haven't tried them though so I'm not sure).

Could you perhaps point me in the right direction as to where I should try to fix this?

Thanks a lot!

jsakalos
18 Jun 2008, 3:19 AM
The behavior you describe is not related to this plugin but to grid/store/selection model generally. The way to achieve it would be to save selected states in the store and recover them on view refresh.

jsakalos
18 Jun 2008, 3:19 AM
@Riri,

I've put it to my todo list.

Riri
18 Jun 2008, 5:00 AM
Hello jsakalos,

Thanks a lot :)

I just have 2 more questions:
- 1/. Will you use the 'Ids' as our proposal or will you use other name ? (this question to know if the test team can work using these Ids)

- 2/. When can we expect to get it in your official build ?

Thanks a lot in advance.
Riri.

jsakalos
18 Jun 2008, 5:08 AM
1) I'd prefer one id given to plugin and other would be auto generated like: this.id + '-input', this.id + '-menu', etc.
2) To be honest, it's not at the top of my priorities list...

If you'd implement 1), I'd review it and posted here for testing, it would be fastest.

Riri
18 Jun 2008, 5:44 AM
@jsakalos,

Okay for me for your implementation 1).

I'm waiting your code to validate it.

Thanks in advance.
Riri.

miihiir
19 Jun 2008, 11:05 AM
I am getting the following error -

tb has no properties

tb.addSeparator();

I have put the plugin code in a seperate .js file and included that in the main html file.

Any idea what I am doing wrong?

Thanks.

M.

jsakalos
19 Jun 2008, 11:11 AM
Have you read the docs in comments and have you studied example code?


/**
* @cfg {String} position Where to display the search controls. Valid values are top and bottom (defaults to bottom)
* Corresponding toolbar has to exist at least with mimimum configuration tbar:[] for position:top or bbar:[]
* for position bottom. Plugin does NOT create any toolbar.
*/
,position:'bottom'

miihiir
19 Jun 2008, 11:23 AM
Thanks. works like a charm!!

miihiir
19 Jun 2008, 11:59 AM
There's a line on the page when I use the "position:top".

See attached image. Is this common?

M.

jsakalos
20 Jun 2008, 2:16 AM
Seems like you already have a greedy spacer in you toolbar, haven't you?

miihiir
20 Jun 2008, 4:31 AM
Seems like you already have a greedy spacer in you toolbar, haven't you?

I am very new to ext ... i am not sure what you mean by the spacer ....

here is my code ...



var xg = Ext.grid;
dealRecordObj = Ext.data.Record.create([
{name: 'id', type: 'string'},
{name: 'name', type: 'string'},
{name: 'status', type: 'string'},
{name: 'full_name', type: 'string', mapping: 'f_name + " " + obj.l_name'},
{name: 'start', type: 'string'},
{name: 'end', type: 'string'},
{name: 'approved', type: 'string'},
{name: 'approvedBy', type: 'string'},
{name: 'submitNotes', type: 'string'}
]);

dealReader = new Ext.data.JsonReader({
root: 'results',
totalProperty: 'total',
id: 'id'
},
dealRecordObj
);

dealsDataStore = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({
url: 'database.php',
method: 'POST'
}),
baseParams:{task: "COMPLETEDDEALS"}, // this parameter is passed for any HTTP request
reader: dealReader,
sortInfo:{field: 'name', direction: "ASC"}
});

dealsDataStore.load();

////////////////////////////////////////////////////////////////////////////////////////
// Grid 1
////////////////////////////////////////////////////////////////////////////////////////
// row expander
var expander = new xg.RowExpander({
remoteDataMethod : getDetails
});

var grid1 = new Ext.grid.GridPanel({
store: dealsDataStore,
columns: [
expander,
{header: "Id", width: 50, sortable: true, dataIndex: 'id'},
{header: "Deal Name", width: 320, sortable: true, dataIndex: 'name'},
{header: "Completed By", width: 100, sortable: true, dataIndex: 'full_name'},
{header: "Approved?", width: 80, sortable: true, dataIndex: 'approved'},
{header: "Approved By", width: 100, sortable: true, dataIndex: 'approvedBy'},
{header: "Start", width: 125, sortable: true, dataIndex: 'id', renderer: renderStart},
{header: "End", width: 125, sortable: true, dataIndex: 'id', renderer: renderEnd},
{header: "Notes", width: 125, sortable: false, dataIndex: 'submitNotes'}
],

viewConfig: {
forceFit:false
},

buttons: [{ text: 'Back',
handler: function(){
window.location = 'index.php';
}
}
],
buttonAlign:'center',
title: 'Completed Deals',
tbar:[],
bbar:[],
plugins: [expander, new Ext.ux.grid.Search({
mode:'local'
,iconCls:false
,dateFormat:'m/d/Y'
,minLength:2
,align:'right'
})],
stripeRows: true,
width: 900,
height: 500,
collapsible: false,
animCollapse: false,
frame:true,
iconCls: 'icon-grid',
renderTo: document.getElementById('completeGridHolder')
});


Thank you so much for your reply. Any idea what I am doing wrong?

PS: I have another plugin (rowexpander) along with the search on the grid.

M.

jsakalos
21 Jun 2008, 2:00 AM
Remove align:right from plugin config.

jsakalos
21 Jun 2008, 2:12 AM
If still in troubles, Post working showcase, please. (http://extjs.com/forum/showthread.php?p=184897#post184897)

iTzAngel
21 Jun 2008, 8:10 AM
Hi there, can i add pagingtoolbar and paginate it?, im using Ext.data.JsonReader, the grid shows pagin toolbar but all the rows in one page :S

mjlecomte
21 Jun 2008, 7:14 PM
Hi there, can i add pagingtoolbar and paginate it?, im using Ext.data.JsonReader, the grid shows pagin toolbar but all the rows in one page :S
Yes. Don't forget you have to provide necessary logic for your database query so you only return the page of records. There's more on this in the Grid FAQ in my signature.

Cooldream
23 Jun 2008, 5:31 AM
Hello,
You're plugin is very usefull. Thanks...

I made some changes to do search with text after use of renderers (with combos for example...) :



...
/**
* @cfg {boolean} localSearchUsingRenderer, if true : search values returned by renderers. Valid values: true, false (defaults to true)
*/
,localSearchUsingRenderer: true


...

var cm = this.grid.getColumnModel();

// Create array with [dataIndex][columnIndex]
var cmfield = new Array();
for(ix = 0; ix < cm.getColumnCount(); ix++){
cmfield[cm.getDataIndex(ix)] = ix;
}

// grid's store filter
if('local' === this.mode) {
store.clearFilter();
if(val) {
store.filterBy(function(r) {
var retval = false;
this.menu.items.each(function(item) {
if(!item.checked || retval) {
return;
}
var rv = r.get(item.dataIndex);

//Use Renderer on local
if(true == this.localSearchUsingRenderer) {
var cmcol = cmfield[item.dataIndex];
if(cmcol) {
var rend=cm.getRenderer(cmcol);
if(rend) rv= rend(rv,null,r, null, cmcol, store);
}
} //End Use Renderer

rv = rv instanceof Date ? rv.format(this.dateFormat || r.fields.get(item.dataIndex).dateFormat) : rv;


It seems to work for me...

jsakalos
23 Jun 2008, 11:57 AM
Hmm, I somehow managed that comboboxes work fine w/o any additions. It's done like this:

1) both id (fieldValue) and text (displayValue) are in store but id is not displayed (no cm)
2) I have extended combo for using as grid editor that knows about both id and text
3) When user selects new value from combo both text and id fields in store are updated

This way I do not need to care anymore for any renderers needed for combos in grid.

Efex
23 Jun 2008, 3:15 PM
Hi Saki,

Well, I'm totally thankfull for all your work and plugins developed!!
Many thanks and also for your kind help.

I have a question regarding this Search plugin, but I must be honest saying I didn't read all tha pages of this thread so I don't know if someone has also asked the same question.

The question is if there's a way to use the search for ALL the records in the grid even the ones being paged and not presented on the current page. I ask because I have a paging grid and the search is only working on the current page.
Am I missing some config?

Cooldream
23 Jun 2008, 11:55 PM
Hmm, I somehow managed that comboboxes work fine w/o any additions.

OK, it's interesting. I do that change to use "standard" comboboxes.

Could you post your change of comboboxes ?

jsakalos
24 Jun 2008, 10:52 AM
It is too backend specific, a lot of unrelated variables, options and code. It would do no good if I posted it as it is. Someone can create an implementation based on the explanation I've given.

jsakalos
24 Jun 2008, 10:55 AM
Sure. If the search is remote, server just creates an appropriate where clause for an sql and whole tables are searched. Some of grids in my examples or extensions and plugins page show it. Start at http://extjs.eu

w3bbuilder
24 Jun 2008, 9:20 PM
hi,

i have a simple problem with this plugin. close(reset) search button it's not working for me. do i forgot somethin?

here is my code:


plugins: new Ext.ux.grid.Search({
iconCls:'b_search_cls',
minChars:2,
autoFocus:true,
text:'Cauta dupa camp',
mode:'remote',
readonlyIndexes:['name'],
position:'top'
})

jsakalos
24 Jun 2008, 11:32 PM
I would bet that text config option is ignored but everything else looks good. Any other colliding event handler?

Efex
25 Jun 2008, 6:10 AM
Sure. If the search is remote, server just creates an appropriate where clause for an sql and whole tables are searched. Some of grids in my examples or extensions and plugins page show it. Start at http://extjs.eu

Saki,
What if I'm not using a remote search?
I do as follows: I receive as parameter my Json data I got from sql. So, I use a SimpleStore to read that parameter and make 'loadData(myparam)'
To use my paging grid, I put a proxy like this:
proxy: new Ext.data.PagingMemoyProxy(myparam)
This way, my paging toolbar works fine with refresh and everything.

So, everything is 'local' and therefore I use on my Search the local config,but it only searches on the actual page and not on the entire Store :s:s :-?:-?

NoahK17
25 Jun 2008, 2:11 PM
To have this mod work correctly with my Smart CheckboxSelectionModel, replace this line of code:


if(!disable) {
menu.add(new Ext.menu.CheckItem({

With this line of code:


if(!disable && (config.header.indexOf('x-grid3-hd-checker') == -1)) {
menu.add(new Ext.menu.CheckItem({

jsakalos
25 Jun 2008, 2:32 PM
@Efex

That seems to be too complicated. Paging grid was invented to avoid the necessity of loading all data from the server at once. So I don't see any reason why should I load all data and then page it locally.

jsakalos
25 Jun 2008, 2:33 PM
Noah, could you explain it a bit?

jsakalos
25 Jun 2008, 2:38 PM
Have you solved th problem?

What this relates to?

Efex
25 Jun 2008, 2:47 PM
@Efex

That seems to be too complicated. Paging grid was invented to avoid the necessity of loading all data from the server at once. So I don't see any reason why should I load all data and then page it locally.

I know, but as I'm integrating ExtJS to an existing app, I already have a model I have to follow and this grid html page is being called from another page of the actual app. So, before I put all the Ext, the calling method does the sql and sends the result to the html having the js for Ext.
This is why I use the Json pased as parameter and the paging grid just as a really nice feature for the user. :(

medley
26 Jun 2008, 6:30 AM
Hello,

I am using the plugin gridSearch. It works well but I discovered something strange.
When the search concerns a column whose value contains brackets,
when it returns no row.

Example 1 :
value of the column A: (2007)0194
search field entered : (2007)
result : 1 row

value of the column A : (2007)0194
search field entered : (2007)01
result : 0 row

Medley

NoahK17
26 Jun 2008, 7:35 AM
Saki: I mis-read part of your documentation. I see now the "disableIndexes" config option. So I revise my previous statement with this:

If you're using my SmartCheckboxSelectionModel with this mod, whatever you named your dataIndex in the selectionModel, you'll want to send in this config option to the Grid Search Plugin: "disableIndexes:'checked'" (where checked is my dataIndex)

Cheers!

jsakalos
26 Jun 2008, 11:19 PM
Hello,

I am using the plugin gridSearch. It works well but I discovered something strange.
When the search concerns a column whose value contains brackets,
when it returns no row.

Example 1 :
value of the column A: (2007)0194
search field entered : (2007)
result : 1 row

value of the column A : (2007)0194
search field entered : (2007)01
result : 0 row

Medley

Oh yes, seems like we need to escape RegExp for local searches. Download please the devel version and let us know it it works as expected now. I've added it to the code.

medley
26 Jun 2008, 11:34 PM
Hello,

I did a test with different cases and It works now.
Thanks a lot.

Medley

jsakalos
26 Jun 2008, 11:38 PM
Hello,

I did a test with different cases and It works now.
Thanks a lot.

Medley
Super! Thanks for testing.

medley
26 Jun 2008, 11:44 PM
You're welcome.
I posted a bug??? about expander (see here
http://extjs.com/forum/showthread.php?t=38310&highlight=expander).
But I had any answer about it.

Medley

jelt
27 Jun 2008, 2:21 AM
@Efex

That seems to be too complicated. Paging grid was invented to avoid the necessity of loading all data from the server at once. So I don't see any reason why should I load all data and then page it locally.

Wow, paging is also usefull to increase client loading performance (try to built/use a grid of 5k line and 80 columns... 1s to load data from server, 2 min to build/display the huge amount of div/table/div/div/table....)

Like Efex i use local paging.

I use paging only to hide the poor performance of ext grid, and local paging because my data provider don't support ajax request.

@Efex : You are not in "local" mode, PagingMemoryProxy act as a server. So you need to use the "remote" mode, and to find a way to filter in PMP. It's the same problem that using gridfilter with PMP.

johnsbrn
7 Jul 2008, 2:30 PM
I had a need to add indexes that did not appear in the grid header, so I added the following code:


Ext.each(this.extraIndexes, function(index) {
menu.add(new Ext.menu.CheckItem({
text:index.header
,hideOnClick:false
,checked:'all' === this.checkIndexes
,dataIndex:index.dataIndex
}));
}, this);

and extraIndexes:[], at the top

mike1993
14 Jul 2008, 8:08 AM
Jozef,

I need to hide/show plugin under some circumstances. Is this possible?

Thanks