EasyUI Forum
April 27, 2024, 09:28:11 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: SUBGRID ROWEDITING: how to copy date from one column in editmode to next column?  (Read 1168 times)
rannacher
Jr. Member
**
Posts: 52


View Profile
« on: April 25, 2023, 09:53:57 AM »

Hi,

I want to copy - during row editing - a date from one column to another (and maybe change date during copy as required).

With documentation I got to add a button in the datebox field and also an additional button in bottom of the datebox calendar.
See screenshot attached.
Just I cannot get, that on pressing one of these to set the actual date or anything else to the next datebox column... please for help!

Calculating 2 columns example did not help as I want the copy to happen on a button click and not on onChange.
https://www.jeasyui.com/tutorial/datagrid/datagrid15.php

Thanks and BR Michael!  

what I tried...

Code:
{field:'client_date',title:'Termin Kunde',width:150,align:'center',...
{field:'ops_date',title:'Planung OPS',width:120,align:'center',...


// ---------------------------------------------------------------------------------
// not working code in handler for icon-ok
// ---------------------------------------------------------------------------------
                                               buttons: datebox_buttons,
                                                                        required:false,
                                                               formatter: myformatter,
                                                               parser:    myparser,
                                                                        currentText:    'Heute',
                                                                        closeText:      'Schließen',
                                                                        icons:[
                                                                                {
                                                                                  iconCls:'icon-ok',
                                                                                  handler: function(e)
                                                                                  {
                                                                                    var ed = ddv.datagrid('getEditor', {index:editIndex,field:'client_date'});
                                                                                    var val = ed.target.datebox('getValue','');
                                                                                    alert(val);
                                                                                    
                                                                                    var ed = ddv.datagrid('getEditor', {index:editIndex,field:'ops_date'});
                                                                                    // not working
                                                                                    ( $(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target) ).datebox('setValue',val);
                                                                                    
                                                                                  }
                                                                                },
                                                                                {
                                                                                  iconCls:'icon-clear',
                                                                                  handler: function(e)
                                                                                  {
                                                                                    // SET FOCUS ON 'OWN' COLUMN WORKS....
                                                                                    var ed = ddv.datagrid('getEditor', {index:editIndex,field:'client_date'});
                                                                                    ed.target.datebox('setValue','');
                                                                                    ed.target.datebox('setText','');
                                                                                    ( $(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target) ).select();
                                                                                    ( $(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target) ).focus();
                                                                                  }
                                                                                }
                                                                              ]  

// ---------------------------------------------------------------------------------
// not working code in datebox_buttons
// ---------------------------------------------------------------------------------
  var datebox_buttons = $.extend([], $.fn.datebox.defaults.buttons);
  datebox_buttons.splice(1, 0, {
      text: 'CONFIRM',
      handler: function(target)
      {
          alert('click MyBtn');
          
          var ed = $(this).datagrid('getEditor', {index:editIndex,field:'ciient_date'});
          var val = ed.target.datebox('setValue','');  
          alert( val );

          var ed = SubDG.datagrid('getEditor', {index:editIndex,field:'ops_date'});
          ed.target.datebox('setValue',val);
          ed.target.datebox('setText',val);
          ( $(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target) ).select();
          ( $(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target) ).focus();
      }
  });  

« Last Edit: April 26, 2023, 02:44:58 PM by rannacher » Logged
jarry
Administrator
Hero Member
*****
Posts: 2262


View Profile Email
« Reply #1 on: April 25, 2023, 07:15:43 PM »

Please refer to this example.
Code:
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title>Row Editing in DataGrid - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/icon.css">
<script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.min.js"></script>
<script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
<script>
var data = [
{ subpart: 'subprt1', termin: '03/04/2023' },
{ subpart: 'subprt2', termin: '03/05/2023' },
{ subpart: 'subprt3', termin: '03/06/2023' },
{ subpart: 'subprt4', termin: '03/07/2023' }
]
$(function () {
var editIndex = undefined;
var dg = $('#dg').datagrid({
columns: [[
{ field: 'subpart', title: 'Subpart', width: 100, editor: 'textbox' },
{
field: 'termin', title: 'Termin Kunde', width: 200, editor: {
type: 'datebox',
options: {
icons: [{
iconCls: 'icon-ok',
handler: function (e) {
var val = $(e.data.target).datebox('getValue');
var ed = dg.datagrid('getEditor', { index: editIndex, field: 'planung' });
$(ed.target).datebox('setValue', val);
}
}]
}
}
},
{ field: 'planung', title: 'Planung OPS', width: 200, editor: 'label', editor: 'datebox' }
]],
data: data,
singleSelect: true,
onClickCell: function (index, field) {
dg.datagrid('endEdit', editIndex);
if (editIndex != index) {
dg.datagrid('selectRow', index).datagrid('beginEdit', index);
var ed = dg.datagrid('getEditor', { index: index, field: field });
if (ed) {
($(ed.target).data('textbox') ? $(ed.target).textbox('textbox') : $(ed.target)).focus();
}
editIndex = index;
}
}
})
})
</script>
</head>

<body>
<table id="dg" class="easyui-datagrid" title="Row Editing in DataGrid" style="width:700px;height:auto">
</table>

</body>

</html>
Logged
rannacher
Jr. Member
**
Posts: 52


View Profile
« Reply #2 on: April 26, 2023, 02:42:43 AM »

Thanks for help,
I understand and get this working with a normal datagrid, just I use an editable subgrid for which I need this
and it seems I simply dont get the reference to this editable subgrid right in the code.
Whatever I put here instead of dg like ddv, $(this)... etc I dont get the editor correctly and hence the setValue is not working.

Once again thanks and Greetings from Vienna!
Michael.

Code:
						field: 'termin', title: 'Termin Kunde', width: 200, editor: {
type: 'datebox',
options: {
icons: [{
iconCls: 'icon-ok',
handler: function (e) {
var val = $(e.data.target).datebox('getValue');
var ed = dg.datagrid('getEditor', { index: editIndex, field: 'planung' });
$(ed.target).datebox('setValue', val);
}
}]
}
}

« Last Edit: April 26, 2023, 03:44:09 AM by rannacher » Logged
Pages: [1]
  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!