EasyUI Forum
May 21, 2024, 02:51:47 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1] 2
  Print  
Author Topic: DataGrid: Multiple select only with CTRL  (Read 53209 times)
mzeddd
Full Member
***
Posts: 223



View Profile
« on: March 18, 2014, 06:19:11 AM »

Hi,

Is it possible to use CTRL function key to enable multiple select in datagrid?

I mean Datagrid should allow multiple select only when CTRL key is pressed by user.
And I'm talking about mouse click on a row.

But multiple select should work as it is when user clicks on checkbox.
//V
« Last Edit: March 18, 2014, 07:09:16 AM by mzeddd » Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: March 18, 2014, 08:54:03 PM »

The new 'ctrlSelect' property will be added in next version, which only allows multi-selection when ctrl+click is used. To use this feature, please download the updated datagrid plugin from http://www.jeasyui.com/easyui/plugins/jquery.datagrid.js and include it to your page. Remember to set 'ctrlSelect' property to true.
Logged
mzeddd
Full Member
***
Posts: 223



View Profile
« Reply #2 on: March 18, 2014, 11:42:24 PM »

Perfect. This is what I've been waiting for!

But when I load my page in Firefox in console I have the following error:

[10:38:56.803] opts.finder.getRows is not a function @ jquery.datagrid.js:1174
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 on: March 19, 2014, 12:52:36 AM »

Please refer to the attached example 'test.html'. It works fine.
Logged
mzeddd
Full Member
***
Posts: 223



View Profile
« Reply #4 on: March 19, 2014, 03:06:30 AM »

Hi.

It seems like this error comes from ComboGrid when updated datagrid plugin is used.

See attached file

 ----------
Update:
Updated datagrid plugin interfere with ComboGrid when pure 1.3.5 version is used.
When I change
Code:
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/plugins/jquery.datagrid.js"></script>
to
Code:
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/plugins/jquery.datagrid.js"></script>

It starts to work again.
« Last Edit: March 19, 2014, 03:14:38 AM by mzeddd » Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #5 on: March 19, 2014, 07:39:50 AM »

When using combo grid, please extend the 'getRows' for $.fn.combogrid.defaults.finder.
Code:
$.extend($.fn.combogrid.defaults.finder, {
getRows: function(target){
return $(target).datagrid('getRows');
}
})

Another way to solve this issue is to include the combogrid together with datagrid.
Code:
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/plugins/jquery.datagrid.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/plugins/jquery.combogrid.js"></script>
Logged
mzeddd
Full Member
***
Posts: 223



View Profile
« Reply #6 on: March 21, 2014, 12:00:54 AM »

Hi stworthy,

Thank you for this workarounds.

I have one note to updated datagrid plugin:
For example I have datagrid with "singleSelect:false,ctrlSelect:true,pagination:true" options.
1) When I click on a row, I get it selected - Good
2) When I click on another row, I get new row selected. 1st one gets not selected - Good
3) When I click on next row with CTRL. New row gets selected and 2nd row stays selected - Good
4) When I click on 4th row. The 4th row gets selected and #2, #3 rows get not selected - Good
5) I switch to next page. I get new data in datagrid - Good
6) When I click on 1st row in page 2 I get two rows selected: row #4 in page 1 and row #1 on page 2 - Not good

I think in step 6 I have to have one row selected and it should be on page 2.
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #7 on: March 21, 2014, 12:55:32 AM »

This issue have been solved, please download the plugin from http://www.jeasyui.com/easyui/plugins/jquery.datagrid.js.
Logged
mzeddd
Full Member
***
Posts: 223



View Profile
« Reply #8 on: March 21, 2014, 02:18:44 AM »

Seems like 'ctrlSelect' feature stoped working with latest plugin. - i don't know what happend, but now it is working.

But still one note: Lines on 1st page are not selected anymore when I click on any row on next page but checkboxes (I have it as 1st column) remain set.
« Last Edit: March 21, 2014, 03:10:23 AM by mzeddd » Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #9 on: March 21, 2014, 06:15:15 AM »

Please override the 'clearSelections' and 'clearChecked' methods of datagrid to solve this issue.
Code:
$.extend($.fn.datagrid.methods, {
clearSelections: function(jq){
return jq.each(function(){
var state = $.data(this, 'datagrid');
var selectedRows = state.selectedRows;
var checkedRows = state.checkedRows;
selectedRows.splice(0, selectedRows.length);
$(this).datagrid('unselectAll');
if (state.options.checkOnSelect){
checkedRows.splice(0, checkedRows.length);
}
});
},
clearChecked: function(jq){
return jq.each(function(){
var state = $.data(this, 'datagrid');
var selectedRows = state.selectedRows;
var checkedRows = state.checkedRows;
checkedRows.splice(0, checkedRows.length);
$(this).datagrid('uncheckAll');
if (state.options.selectOnCheck){
selectedRows.splice(0, selectedRows.length);
}
});
}
})
Logged
Pierre
Sr. Member
****
Posts: 439


View Profile Email
« Reply #10 on: March 23, 2014, 11:59:55 AM »

Hello
I try to use ctrlSelect in the combination with dragDrop but it looks like it does not work.
When I remove ctrlSelect, dragDrop works OK.
Thanks.
Logged
Pierre
Sr. Member
****
Posts: 439


View Profile Email
« Reply #11 on: March 26, 2014, 01:01:40 AM »

Hello stworthy
could you please check ctrlSelect when enableDnd is used on grid?
Here it does not working together.

I need that user can select few rows (using ctrlSelect) and drag and drop them all to other grid.
Is that possible?

Thank you
« Last Edit: March 26, 2014, 01:04:31 AM by Pierre » Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #12 on: March 26, 2014, 02:14:44 AM »

The 'enableDnd' method can only drag a single row on grid. To drag multiple rows, you have to use 'draggable' and 'droppable' plugins to achieve this functionality. Please refer to the draggable examples http://www.jeasyui.com/demo/main/index.php?plugin=Draggable&theme=default&dir=ltr&pitem=
Logged
Pierre
Sr. Member
****
Posts: 439


View Profile Email
« Reply #13 on: March 26, 2014, 06:04:47 AM »

OK thanks.
There is no way that I use those example to drag multiple rows from one grid to other  Angry
Maybe you can write some simple example and put them into Examples section?  Grin
Logged
Pierre
Sr. Member
****
Posts: 439


View Profile Email
« Reply #14 on: April 08, 2014, 12:51:05 AM »

OK thanks.
There is no way that I use those example to drag multiple rows from one grid to other  Angry
Maybe you can write some simple example and put them into Examples section?  Grin

Hello stworthy
any chance that you write some example of how to use drag/drop using ctrl?
I simply can not achieve that,
Thank you.
Logged
Pages: [1] 2
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!