EasyUI Forum
April 24, 2024, 03:16:15 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: keyhandler combogrid as datagrid editor  (Read 3380 times)
shivavalkyre
Newbie
*
Posts: 39


View Profile
« on: April 17, 2018, 11:06:13 AM »

Hi

i face problem with keyhandler in combogrid as datagrid editor, i need to detect enter key in combogrid.

here my code

Code:
<html>
<head>
 <link rel="stylesheet" type="text/css" href="../themes/metro-gray/easyui.css">
 <link rel="stylesheet" type="text/css" href="../themes/icon.css">
 <link rel="stylesheet" type="text/css" href="../css/demo.css">
 <link rel="stylesheet" type="text/css" href="../themes/color.css">
 <script type="text/javascript" src="../js/jquery.min.js"></script>
 <script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
 <script type="text/javascript" src="../js/jquery.edatagrid.js"></script>
 <link rel="stylesheet" href="../css/w3.css">
 
  <script type="text/javascript">
$(function(){
$('#dg').edatagrid({
onAdd: function(index,row){
var ed1 =$(this).datagrid('getEditor', {
                index: index,
                field: 'pcn'
           });
var t = $(ed1.target).combogrid('textbox').focus();
t.focus();

}

});

});
</script>
 
 <style>
.w3-button {width:100px;height:30px;}
</style>

</head>
<body>
<table id="dg"  style="width:100%;height:250px" data-options="toolbar:'#toolbar', pagination:true, idField:'id', rownumbers:true, fitColumns:true, singleSelect:true">
        <thead>
            <tr>
                <th field="pcn"  width="50" editor="{type:'combogrid',options:{required:false,panelWidth:580,idField:'pcn',textField:'pcn',mode:'remote',url:'../control/get_product.php',columns: [[
{field:'pcn',title:'pcn',width:100},{field:'product',title:'product',width:250},{field:'unit',title:'unit',width:50},

]],

keyHandler: $.extend({}, $.fn.combogrid.defaults.keyHandler, {
enter: function(e){
//...
}
})

}}">Product</th>
<th field="unit" width="30" editor="{type:'validatebox',options:{readonly:false}}">Unit</th>
                <th field="qty" width="50" editor="{type:'validatebox',options:{required:true}}">Qty</th>

             
            </tr>
        </thead>
 </table>
<div align="right" style="margin:10 0 0">
<a href="#" id="btnSave" class="easyui-linkbutton c5" style="width:120px;height:35px">Save Transaction</a>
</div>
<div id="toolbar">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onClick="javascript:$('#dg').edatagrid('addRow')">New</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-undo" plain="true" onClick="javascript:$('#dg').edatagrid('cancelRow')">Cancel</a>
    </div>


</body>
</head>
Logged
jarry
Administrator
Hero Member
*****
Posts: 2262


View Profile Email
« Reply #1 on: April 17, 2018, 06:38:47 PM »

This code works fine.
Code:
{
type:'combogrid',
options:{
required:false,
panelWidth:580,
idField:'pcn',
textField:'pcn',
mode:'remote',
url:'../control/get_product.php',
columns: [[
{field:'pcn',title:'pcn',width:100},
{field:'product',title:'product',width:250},
{field:'unit',title:'unit',width:50},
]],
keyHandler: $.extend({}, $.fn.combogrid.defaults.keyHandler, {
enter: function(e){
$.fn.combogrid.defaults.keyHandler.enter.call(this,e);
console.log('enter')
}
})
}
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!