EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: joe on July 23, 2015, 03:19:23 PM



Title: dynamically load a databox editor for an editable row in a datagrid
Post by: joe on July 23, 2015, 03:19:23 PM
I want to know if I can stop a datebox editor (or any editor) from loading in a cell on the onBeforeEdit event? Thanks

code for the datagrid:

    $('#dg').edatagrid({
            url: '...url',
            onBeforeLoad: function (param) {
                param.f = $('#dgFilter1').combobox('getValue');
            },
            nowrap: false,
            view: groupview,
            groupField: 'fieldname',
            groupFormatter: function (value, rows) {
                return value + ' :: ' + rows[0].ActivityName;
            },
            onBeforeEdit: function (index, row) {
                var ed = $(this).datagrid('getEditor', { index: index, field: 'fieldname' });
                if(some condition){
                    //stop editor from loading
                }                
            }
        });

HTML for the datagrid:

<table id="dg" title="Name" style="height:300px"  
            toolbar="#toolbar"
            rownumbers="false" singleSelect="true" striped="false" remoteSort="false">  
            <thead>  
                <tr>  
                    <th data-options="field:'Action',width:30" formatter="(function(value, row, index){ return rowAction(row); })">&nbsp;</th>
                    <th data-options="field:'fieldName1',width:175" >Task</th>
                    <th data-options="field:'fieldName1',width:100,editor:{type:'datebox',options:{height:'auto',onSelect: function(date){alert(date.getFullYear()+':'+(date.getMonth()+1)+':'+date.getDate());}}}">Start Date</th>
                    <th data-options="field:'fieldName1',width:100,editor:{type:'datebox',options:{height:'auto'}}">End Date</th>
                    <th data-options="field:'fieldName1',width:100,editor:{type:'datebox',options:{height:'auto'}}">Actual End Date</th>
                    <th data-options="field:'fieldName1',width:100,editor:{type:'datebox',options:{height:'auto'}}">Completion Date</th>
                    <th data-options="field:'fieldName1',width:50" formatter="(function(value, row, index){ return format(row); })" sortable="true">Type</th>
                    <th field="Niente" width="500">&nbsp;</th>
                </tr>  
            </thead>  
        </table>
 


Title: Re: dynamically load a databox editor for an editable row in a datagrid
Post by: stworthy on July 23, 2015, 07:26:51 PM
To disable the editor before editing a row, please set the 'editor' property of the special column to null.
Code:
$('#dg').datagrid({
onBeforeEdit:function(index,row){
var col = $(this).datagrid('getColumnOption', 'fieldname');
col.editor = null;
}
})


Title: Re: dynamically load a databox editor for an editable row in a datagrid
Post by: joe on July 23, 2015, 07:58:25 PM
Thanks stworthy...