Print Page - combogrid + scrollview in edatagrid - how to select values on combogrid datagrid

Title: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: Stefan B. on March 25, 2015, 02:41:49 AM

We use a datagrid and a combogrid as editor for the servername.
The combogrid has a big data list, so we use the "Datagrid Scroll View" extension inside the combogrid.

When double click on a row to go in the edit mode and oben the combogrid panel,
how can we select the combogrid value on the datagrid view if this is not on the first scrollview page?

See my exsample for more information: http://jsfiddle.net/sbrandt/m2q5sqmj/

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: jarry on March 26, 2015, 08:23:59 AM

Please try this updated example http://jsfiddle.net/m2q5sqmj/4/. Be sure to download the patch from http://www.jeasyui.com/download/downloads/jquery-easyui-1.4.2-patch.zip

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: Stefan B. on March 27, 2015, 01:47:09 AM

Hi jarry, I try the exsample but it is not working. When going into edit mode the combogrid shows "[object Object]"
Nothing is select correct, and if the server on the second page also nothing is select on the second page. :-\

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: jarry on March 27, 2015, 02:25:30 AM

Please refresh your page and try again. The updated js files must be loaded successfully before running this example.

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: Stefan B. on March 27, 2015, 03:49:00 AM

Thx - now is the cobo value init when going in edit mode.

But my question was also: how to select the correct page whith the selcted server - in exsample "server 21"

"When double click on a row to go in the edit mode and oben the combogrid panel,
how can we select the combogrid value on the datagrid view if this is not on the first scrollview page?"

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: jarry on March 27, 2015, 07:01:40 PM

You don't need to change the datagrid page. You just need to call combogrid's 'setValue' method to set its value and displaying text. The 'setValue' method not only accepts a string value but also a 'value-text' object. The 'value-text' object indicates the combogrid to set its internal value and the displaying text.

Code:

$('#dg').edatagrid({
	onBeginEdit: function(index,row){
		var ed = $(this).datagrid('getEditor', {index:index,field:'server'});
		$(ed.target).combogrid('setValue', {value:row.server,text:row.serverName});
	}
})

The 'value' and 'text' property names are defined in your combogrid editor.

Code:

editor:{
	type:'combogrid',
	options:{
	    idField:'value',
	    textField:'text',
	    //...
	}
}

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: Stefan B. on March 29, 2015, 11:35:07 PM

OK. Thx for this exsample.

But remember i use the "DataGrid VirtualScrollView" for the combogrid internal datagrid.

How can I automaticly Scroll down to the page with the selected value, to show the selected item on the combogrid datagrid if the user open the combogrid panel?

See the example http://jsfiddle.net/m2q5sqmj/4/.
The Server "Server 21" is not shown first on the datagrid if the combo opens?

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: jarry on March 30, 2015, 06:37:59 AM

You do not need to scroll the datagrid view, just call 'setValue' method with 'value' and 'text' property values.

Code:

$(ed.target).combogrid('setValue', {
  value:row.server,
  text:row.serverName
});

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: Stefan B. on March 31, 2015, 04:32:28 AM

I think you do not understand me.

See this exsample: http://jsfiddle.net/poactohm/
Remember again: We use the "DataGrid VirtualScrollView" for the combogrid internal datagrid. See code:

Code:

 ...
 view:scrollview,
 pageSize: 5,
 ...

The setValue method only works without the scrollview!

* double click on the row with servername is "server 21"
* open the combogid to show the internal datagrid
* The Server "server 21" should direct visible on the datagrid, but it is not shown
* Now when you scoll down the 2, 3, and 4 view page is loaded and the server is shown on the page 5! (see the log statements on console)
* But I will open the page 5 with the selected Server when the combogrid panel is shown!!!

Code:

(index):84 onFetch page: 1
(index):88 onShowPanel ...
(index):84 onFetch page: 2
(index):84 onFetch page: 3
(index):84 onFetch page: 4
(index):84 onFetch page: 5

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: jarry on March 31, 2015, 08:39:56 AM

If you really want to scroll to the special row that the selected value indicated, you have to call 'scrollTo' or 'gotoPage' methods by yourself. Please take a look at the updated example that shows how to achieve this functionality.
http://jsfiddle.net/poactohm/1/

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: Stefan B. on March 31, 2015, 11:36:36 PM

Great, that's exactly what we were looking for
The reason is, that we have 20.000 Server in the list and the user should see the page with the selected server!

But some notes: If the list is very long, the event 'onShowPanel' comes before the event 'onFetch'. So the rows object is not defined and an error occurs.

Bug: Also i see that the combogrid data url is triggerd 2 times to fetch the remote data! - I test it, this is a bug in the patch file for version 1.4.2! Without the patch file it is called only once.

Title: Re: combogrid + scrollview in edatagrid - how to select values on combogrid datagrid
Post by: catpaw on May 25, 2015, 09:27:37 AM

sorry,

Why is the patch?

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: Stefan B. on March 25, 2015, 02:41:49 AM