datagrid的編輯器無法對齊並自動填充單元格

我使用easyui實現了對datagrid的內聯編輯，動態添加新行並通過一次單擊來保存。但是當單擊一行並開始編輯時，單元格中的編輯器無法對齊它的列，也無法自動填充整個單元格。所以看起來很亂。 before click the row datagrid的編輯器無法對齊並自動填充單元格

after click and begin edit

的基本代碼如下：

//add numberspinner into datagrid. 
$.extend($.fn.datagrid.defaults.editors, { 
numberspinner: { 
    init: function(container, options){ 
     var input = $('<input type="text">').appendTo(container); 
     return input.numberspinner(options); 
    }, 
    destroy: function(target){ 
     $(target).numberspinner('destroy'); 
    }, 
    getValue: function(target){ 
     return $(target).numberspinner('getValue'); 
    }, 
    setValue: function(target, value){ 
     $(target).numberspinner('setValue',value); 
    }, 
    resize: function(target, width){ 
     $(target).numberspinner('resize',width); 
    } 
}, 
empty:{ 
    init: function(container, options){ 
     return $('<div style="padding:0 4px"></div>').appendTo(container); 
    }, 
    getValue: function(target){ 
     return $(target).html(); 
    }, 
    setValue: function(target, value){ 
     $(target).html(value); 
    } 
} 
}); 

var editIndex = undefined; 
$(function(){ 
$('#dg').datagrid({onClickRow:function(index,data){ 
    var row=$('#dg').datagrid('getSelected'); 
}}); 
$('#adddg').datagrid({ 
    columns: [[{ 
     field:'id',hidden:true 
    },{ 
     field:'code',title:'代碼',width:"50",hidden:true, 
     editor:{type:'text'} 
    },{ 
     field:'name',title:'所屬線路',width:"100", 
     editor:{ 
      type:'combobox', 
      options:{ 
       valueField:'text', 
       textField:'text', 
       url:"<c:url value='/nnmis/view/zzjg/comboidLine.tg'/>", 
       onSelect:function(item){ 
        var ed = $('#adddg').datagrid('getEditor', {index:editIndex,field:'code'}); 
        $(ed.target).val(item.id); 
       } 
      } 
     } 
    },{ 
     field:'seq',title:'線路中排序',width:"60", 
     editor:{ 
      type:'text', 
      min:0 
     } 
    },{ 
     field:'kmupstart',title:'上行公里開始',width:"70", 
     editor:{ 
      type:'numberspinner', 
      min:0 
     } 
    },{ 
     field:'kmupend',title:'上行公里結束',width:"70", 
     editor:{ 
      type:'numberspinner', 
      min:0 
     } 
    },{ 
     field:'kmdownstart',title:'下行公里開始',width:"70", 
     editor:{ 
      type:'numberspinner', 
      min:0 
     } 
    },{ 
     field:'kmdownend',title:'下行公里結束',width:"70", 
     editor:{ 
      type:'numberspinner', 
      min:0 
     } 
    }]], 
    onClickRow:function(index,data){ 
     var row=$('#adddg').datagrid('getSelected'); 
     if(editIndex == undefined){ 
      $('#adddg').datagrid('beginEdit', index); 
      editIndex = index; 
     }else{ 
      $('#adddg').datagrid('endEdit', editIndex); 
      $('#adddg').datagrid('beginEdit', index); 
      editIndex = index; 
     } 
    }, 
    onBeforeEdit:function(index,row){ 
     row.editing = true; 
     updateActions(index); 
    }, 
    onAfterEdit:function(index,row){ 
     row.hadedit='1'; 
     row.editing = false; 
     updateActions(index); 
    }, 
    onCancelEdit:function(index,row){ 
     row.editing = false; 
     updateActions(index); 
    } 
}); 
}); 
function updateActions(index){ 
$('#adddg').datagrid('updateRow',{ 
    index: index, 
    row:{} 
}); 
} 

function getRowIndex(target){ 
var tr = $(target).closest('tr.datagrid-row'); 
return parseInt(tr.attr('datagrid-row-index')); 
} 
function addline(){ 
/*var dta = $('#adddg').datagrid('getData'); 
if(dta){ 
    if(dta.rows.length == 0){ 
     $('#adddg').datagrid('appendRow',{ 
      id:'', 
      code:'', 
      seq:'0', 
      kmupstart:'0', 
      kmupend:'0', 
      kmdownstart:'0', 
      kmdownend:'0' 
     }); 
    } 
}*/ 
$('#adddg').datagrid('appendRow',{ 
    id:'', 
    code:'', 
    seq:'0', 
    kmupstart:'0', 
    kmupend:'0', 
    kmdownstart:'0', 
    kmdownend:'0' 
}); 
}

來源

2014-11-25 Joshua

你是指保存後或加載後自動填充，而點擊行？ – 2014-12-04 03:25:32

我的時候我沒有包裹的輸出與<HTML> <體>標籤同樣的問題。當我加<html> <身體>一切都變好了。

來源

2015-11-03 21:00:53 Biga

datagrid的編輯器無法對齊並自動填充單元格

回答

相關問題