2012-02-10 102 views
0

如何在双击时使单元格不可编辑?单击即可编辑单元格 。如何在双击时禁用单元格可编辑选项

我已经做单元格编辑启用使用下面的代码:

jQuery("#tree").jqGrid({ 
       url:'json/jsonSamplePots.json', 
       datatype: "json", 
       mtype:'GET', 
       colNames: ["Task id", "Task no.", "Task name", "Priority", "Start", "End", "Effort(hrs)", "Actual start", "Actual end", "Actual effort(hrs)", "Baseline start", "Baseline end", "Baseline effort(hrs)", "Task type", "Link", "Resources", "Tag"], 
       colModel: [ 
        {name:'id',width: 30, editable:false, align:"right",sortable:false, hidden: true, key: true}, 
        {name:'no',width:80, editable:false, align:"left", sortable:true, sorttype:"int"}, 
        {name:'name', width:150, editable:true, sortable:true, sorttype:"text"}, 
        {name:'priority', width:80, editable:true, align:"right", sortable:true, sorttype:"int"}, 
        {name:'sDate', width:80, editable:true, align:"right", sortable:true, sorttype:"date"}, 
        {name:'eDate', width:80, editable:true, align:"right", sortable:true, sorttype:"date"}, 
        {name:'effort', width:80, editable:true, align:"right", sortable:true, sorttype:"int"}, 
        {name:'asDate', width:80, editable:true, align:"right", sortable:true, sorttype:"date"}, 
        {name:'aeDate', width:80, editable:true, align:"right", sortable:true, sorttype:"date"}, 
        {name:'aeffort', width:80, editable:true, align:"right", sortable:true, sorttype:"int"}, 
        {name:'bsDate', width:80, editable:true, align:"right", sortable:true, sorttype:"date"}, 
        {name:'beDate', width:80, editable:true, align:"right", sortable:true, sorttype:"date"}, 
        {name:'beffort', width:80, editable:true, align:"right", sortable:true, sorttype:"int"}, 
        {name:'type', width:120, editable:true, align:"left", sortable:true, sorttype:"text"}, 
        {name:'link', width:80, editable:true, align:"left", sortable:true, sorttype:"text"}, 
        {name:'resources', width:300, editable:true, align:"left", sortable:true, sorttype:"int"}, 
        {name:'ref', width:80, editable:true, align:"right", sortable:true, sorttype:"int"}, 
       ], 
       rowNum:10, 
       rowList:[10,20,30], 
       pager: '#pcolch', 
       sortname: 'no', 
       treeGridModel:'adjacency', 
       autowidth:false, 
       sortorder: 'desc', 
       caption:"<a href="#">Task</a> 
       toolbar:[true,"top"], 
       treeGrid: true, 
       cellEdit: true, 
       sortable: true, 
       shrinkToFit :true, 
       //viewrecords: true, 
       height:'auto', 
       ExpandColumn:'name', 
       cellsubmit : 'clientArray', 

回答

1

我建议使用行编辑,而不是cellediting。我一直在挣扎一段时间,但单元编辑并不像行编辑那样灵活。通过行编辑,您可以实现与单元编辑完全相同的目标。

您可以使用onCellSelect事件来启用“单元格编辑”(行编辑)并使用事件参数来捕获事件是否是双击事件。我用我自己的项目类似的东西:上面

'onCellSelect' : function(rowId, iCol, cellcontent, e) { 
    if(rowId && rowId !== lastsel && e.type != 'onDblClick') { 
    $('#resultsgrid').jqGrid(
     'saveRow', 
     lastsel, 
     null, 
     'clientArray', 
     null, 
     saveEditRow 
    ); 

    $('#resultsgrid').jqGrid('restoreRow', lastsel); 
    $('#resultsgrid').jqGrid('editRow', rowId, false); 

    lastsel = rowId; 
    } 
} 

注意仅仅是一个例子,你proberly不能复制/粘贴在自己的项目中使用它。你应该测试它是否适合你。

不是说onCellSelect不能在celledit模式下工作。

希望它可以帮助你!

相关问题