0

我想知道使用jqGrid创建一列按钮的最佳方法？因为我看到可以通过在 colModel 行中创建属性格式化程序或使用 gridCOmplete 方法来做到这一点，但在任何地方都没有看到最适合这个问题的方法。

在此链接中解释了如何使用格式化程序。

<script>
jQuery("#grid_id").jqGrid({
...
colModel: [ 
... 
      {name:'price', index:'price', width:60, align:"center", editable: true, formatter:currencyFmatter},
 ...
   ]
...
});

function currencyFmatter (cellvalue, options, rowObject)
{
   be = "<input style='height:22px;width:20px;' type='button' value='E' onclick=\"jQuery('#rowed2').editRow('"+cellvalue+"');\"  />"; 
   se = "<input style='height:22px;width:20px;' type='button' value='S' onclick=\"jQuery('#rowed2').saveRow('"+cellvalue+"');\"  />"; 
   ce = "<input style='height:22px;width:20px;' type='button' value='C' onclick=\"jQuery('#rowed2').restoreRow('"+cellvalue+"');\" />"; 
   return be+se+ce;
}
</script>

此链接用于 gridComplete（转到Row Editting (new)-> Edit Custom）

Java Script code
...
jQuery("#rowed2").jqGrid({
    url:'server.php?q=3',
    datatype: "json",
    colNames:['Actions','Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    colModel:[
        {name:'act',index:'act', width:75,sortable:false},
        {name:'id',index:'id', width:55},
        {name:'invdate',index:'invdate', width:90, editable:true},
        {name:'name',index:'name', width:100,editable:true},
        {name:'amount',index:'amount', width:80, align:"right",editable:true},
        {name:'tax',index:'tax', width:80, align:"right",editable:true},        
        {name:'total',index:'total', width:80,align:"right",editable:true},     
        {name:'note',index:'note', width:150, sortable:false,editable:true}     
    ],
    rowNum:10,
    rowList:[10,20,30],
    pager: '#prowed2',
    sortname: 'id',
    viewrecords: true,
    sortorder: "desc",
    gridComplete: function(){
        var ids = jQuery("#rowed2").jqGrid('getDataIDs');
        for(var i=0;i < ids.length;i++){
            var cl = ids[i];
            be = "<input style='height:22px;width:20px;' type='button' value='E' onclick=\"jQuery('#rowed2').editRow('"+cl+"');\"  />"; 
            se = "<input style='height:22px;width:20px;' type='button' value='S' onclick=\"jQuery('#rowed2').saveRow('"+cl+"');\"  />"; 
            ce = "<input style='height:22px;width:20px;' type='button' value='C' onclick=\"jQuery('#rowed2').restoreRow('"+cl+"');\" />"; 
            jQuery("#rowed2").jqGrid('setRowData',ids[i],{act:be+se+ce});
        }   
    },
    editurl: "server.php",
    caption:"Custom edit "
});
jQuery("#rowed2").jqGrid('navGrid',"#prowed2",{edit:false,add:false,del:false});

我认为第一种方法更简单，因此我的问题。

4

0 回答 0