jqgrid inlineNav add - 在添加的行上显示保存图标

时间:2013-10-10 05:09:49

标签: jquery jqgrid jqgrid-formatter jqgrid-inlinenav

我正在使用jqgrid的inlineNav选项向工具栏添加“添加”选项。我还使用动作格式化程序进行编辑和删除。 当我添加新行时,新添加的行具有编辑图标和取消图标,而保存图标位于添加旁边的工具栏上。

有没有办法指定新添加的行有一个保存和取消图标而不是编辑图标?

2 个答案:

答案 0 :(得分:2)

如果有人有类似的问题。

我最终滚动了自己的格式化程序。

    inlineNavAction = function(cellvalue, options, rowObject, isSavedRow){
        if(isSavedRow !== true){
            var rowid = options.rowId;
            var ocl = "id='jSaveButton_"+rowid+"' onclick=jQuery.fn.fmatter.rowactions.call(this,'save'); onmouseover=jQuery(this).addClass('ui-state-hover'); onmouseout=jQuery(this).removeClass('ui-state-hover'); ";
            var str = "<div title='"+$.jgrid.edit.bSubmit+"' style='float:left;' class='ui-pg-div ui-inline-save' "+ocl+"><span class='ui-icon ui-icon-disk'></span></div>";
            ocl = "id='jCancelButton_"+rowid+"' onclick=jQuery.fn.fmatter.rowactions.call(this,'cancel'); onmouseover=jQuery(this).addClass('ui-state-hover'); onmouseout=jQuery(this).removeClass('ui-state-hover'); ";
            str += "<div title='"+$.jgrid.edit.bCancel+"' style='float:left;margin-left:5px;' class='ui-pg-div ui-inline-cancel' "+ocl+"><span class='ui-icon ui-icon-cancel'></span></div>";
            return "<div style='margin-left:8px;'>" + str + "</div>";

        }else{
            return $.fn.fmatter.actions(cellvalue, options, rowObject);
        }   

    } 

isSavedRow在由于添加而保存行后再次调用格式化程序的情况下传递为true。我还将rowId默认为0。 默认操作传递false。 我将标记保存并从github上可用的源代码中取消4.5版

用法:

formatter:  function(cellvalue,options,rowObject) {
    return inlineNavAction(cellvalue,options,rowObject, (options.rowId!='new_row'));
 }

中的new_row
(options.rowId!='new_row')

是您为添加的行设置的默认rowId。 new_row是默认值。

答案 1 :(得分:0)

formatter列的action更改为:

formatter: function (cellvalue, options, rowObject) {
               if (cellvalue === undefined && options.rowId === "_empty") {
                  // remove edit and del buttons  
                  options.colModel.formatoptions.editbutton = false;
                  options.colModel.formatoptions.delbutton = false;
               }
           return $.fn.fmatter.actions(cellvalue, options, rowObject);
         },

然后在addParams inlineNav我们有:

            addParams: {
                position: "last", 
                rowID: '_empty',
                useDefValues: true,
                addRowParams: {
                url: '....',
                key: true,
                restoreAfterError: false,
                oneditfunc: function(rowId) {
                    // display the save and cancel buttons
                    $("#jSaveButton_" + rowId).show();
                    $("#jCancelButton_" + rowId).show();
                },
        // ... the rest
            },