我实现了一个带内联添加,编辑,删除的jqgrid。当我添加新行时,新添加的行有一个编辑图标和一个取消图标,而保存图标则位于添加旁边的工具栏上。
有没有办法指定新添加的行有一个保存和取消图标而不是编辑图标?
我在此链接上找到了相同的问题
但无法找到在那里添加指定功能的位置。
这是我的代码
function BindGridView(columnNames, colModel) {
colModel = [
{ index: 'Id', name: 'Id', align: 'center', 'hidden': true, editable: false },
{
index: 'Value', name: 'Value', editable: true, editrules: { custom: true, custom_func: myvaluecheck },
sorttype: function (cell) { if (cell == 'Value') return '1'; }
},
{ index: 'Name', name: 'Name', align: 'center', editable: true, editrules: { custom: true, custom_func: CheckName } },
{
name: 'myac', width: 80, fixed: true, sortable: false, resize: false,
formatter: inlineNavAction(cellvalue, options, rowObject, (options.rowid != 'new_row')),
formatoptions: {
keys: true,
onEdit: null,
onSuccess: null,
onError: null,
afterSave: null,
afterRestore: null,
delOptions: {
onclickSubmit: function (rp_ge, rowid) {
var selRowId = $('#dataList').jqGrid('getGridParam', 'selrow');
var celValue = $('#dataList').jqGrid('getCell', selRowId, 'Id');
Delete(celValue);
rp_ge.processing = true;
$("#dataList").delRowData(rowid);
$("#delmod" + grid[0].id).hide();
if (grid[0].p.lastpage > 1) {
grid.trigger("reloadGrid", [{ page: grid[0].p.page }]);
}
return true;
},
processing: true
}
}
}];
var gridimgpath = '/Scripts/jqgrid/themes/redmond/images';
var gridDataUrl = '@Url.Action("GetGridData", "Grid")';
var grdurl = gridDataUrl + "?lookupId=" + guid();
$("#dataList").jqGrid('GridUnload');
jQuery("#dataList").jqGrid({
formatter: {
number: { decimalSeparator: ".", thousandsSeparator: " ", decimalPlaces: 2, defaultValue: '0.00' }
},
url: grdurl,
datatype: "json",
colNames: columnNames,
colModel: colModel,
autowidth: true,
width: 'auto',
height: 'auto',
rowNum: 10,
rowList: [10, 20, 30],
scrolling: true,
shrinktofit: true,
pager: '#pager',
sortname: 'Name',
rownumbers: false,
rownumWidth: 30,
viewrecords: true,
sortorder: "desc",
multiselect: false,
imgpath: gridimgpath,
editurl: "/Grid/PerformCRUDAction",
inlineData: {
myParam: function () {
var selRowId = $("#dataList").jqGrid('getGridParam', 'selrow');
getActualRowData(selRowId);
var jsonOfLog = JSON.stringify(myKeyValuePairs);
return jsonOfLog;
}
},
beforeShowForm: function (id) {
alert("deleted");
},
onSelectRow: function (id) {
if (id && id !== lastSel) {
// debugger;
$(this).jqGrid('restoreRow', lastSel);
$(this).jqGrid('editRow', id, true, null, null, null, {
myNextParam: function () {
alert("extraparam of 'editRow' is calling!!!");
return "Fine";
}
});
lastSel = id;
}
},
}).navGrid("#pager",
{ refresh: false, add: false, edit: false, search: false, del: false },
{}, // settings for edit
{}, // settings for add
{}, // settings for delete
{} // Search options. Some options can be set on column level
);
//{ refresh: false, add: false, edit: false, del: false },
$("#dataList").jqGrid('inlineNav', '#pager',
{
refresh: false,
edit: false,
add: true,
del: false,
search: false,
//edittext: "Edit",
//addtext: "Add",
//save: false,
// cancel: false,
//addtext: "Add",
//savetext: "Save",
// canceltext: "Cancel",
addicon: "ui-icon-plus"//,
});
}
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);
}
}
当我点击“添加”时,新生成的行会显示“编辑”按钮&amp; “删除”,当我点击“修改”时,按钮变为“保存”和“取消”。现在点击此取消(内联)新行消失,但添加按钮不可见。
答案 0 :(得分:1)
更改此行
formatter: inlineNavAction(cellvalue, options, rowObject, (options.rowid != 'new_row')),
到
formatter: function(cellvalue,options,rowObject) {
return inlineNavAction(cellvalue,options,rowObject, (options.rowId!='new_row'));
}