我正在尝试在我的ASP.Net MVC应用程序中使用jqGrid，并要求在“添加”对话框中编辑某些列，但不能编辑“编辑”对话框。显然，这样做的方法是使用beforeShowForm javascript事件并在特定输入字段上设置属性。
到目前为止，我无法设法触发beforeShowForm事件。下面是我在另一个SO question上找到的一个例子，但到目前为止我还没有设法让它工作。有什么技巧我不见了？我正在使用最新的3.8版jqGrid。
控制器：
[Authorize]
public ActionResult Index()
{
var gridModel = new MyGridModel();
SetUpGrid(gridModel.MyGrid);
return View(gridModel);
}
private void SetUpGrid(JQGrid grid)
{
grid.DataUrl = Url.Action("GridDataRequested");
grid.EditUrl = Url.Action("EditRows");
grid.ToolBarSettings.ShowSearchToolBar = false;
grid.ToolBarSettings.ShowEditButton = true;
grid.ToolBarSettings.ShowAddButton = true;
grid.ToolBarSettings.ShowDeleteButton = true;
grid.ToolBarSettings.ShowRefreshButton = true;
grid.EditDialogSettings.CloseAfterEditing = true;
grid.AddDialogSettings.CloseAfterAdding = true;
grid.EditDialogSettings.Modal = false;
grid.EditDialogSettings.Width = 500;
grid.EditDialogSettings.Height = 300;
grid.ClientSideEvents.GridInitialized = "initGrid";
}
型号：
public class MyGridModel
{
public JQGrid MyGrid { get; set; }
public MyGridModel()
{
MyGrid = new JQGrid
{
Columns = new List<JQGridColumn>()
{
new JQGridColumn { DataField = "id",
PrimaryKey = true,
Visible = false,
Editable = false },
new JQGridColumn { DataField = "username",
Editable = true,
EditFieldAttributes = new List<JQGridEditFieldAttribute>()
{
new JQGridEditFieldAttribute(){ Name = "readonly", Value = "true"},
new JQGridEditFieldAttribute(){ Name = "disabled", Value = "true"}
},
Width = 100},
new JQGridColumn { DataField = "domain",
Editable = true,
EditFieldAttributes = new List<JQGridEditFieldAttribute>()
{
new JQGridEditFieldAttribute(){ Name = "readonly", Value = "true"},
new JQGridEditFieldAttribute(){ Name = "disabled", Value = "true"}
},
Width = 100}
}
}
}
}
查看：
function initGrid() {
jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
{ }, //options
{ // edit options
beforeShowForm: function(frm) {
alert("beforeShowForm edit");
}
},
{ // add options
beforeShowForm: function(frm) {
alert("beforeShowForm add");
}
},
{ }, // del options
{ } // search options
);
}
<div>
<%= Html.Trirand().JQGrid(Model.MyGrid, "myGrid") %>
</div>
答案 0 :(得分：3)
在我看来，您的问题的答案会找到here和here（也请查看示例）。
更新：我不知道jqGrid的纪念版。如果您没有解决问题，请在论坛http://www.trirand.net/forum/default.aspx中更好地发布您的问题。
如果我理解您的代码是否正确，您可以尝试从readonly中删除属性disabled和JQGridEditFieldAttribute（EditFieldAttributes）的定义。而不是你可以尝试做以下
如果您想在编辑对话框中显示只读字段'username'和'domain'，您可以执行以下操作
jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
{ }, //options
{ recreateForm: true, // edit options
beforeShowForm: function(form) {
$('#username',form).attr('readonly','readonly');
$('#domain',form).attr('readonly','readonly');
}
});
或不使用recreateForm: true选项：
jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
{ }, //options
{ // edit options
beforeShowForm: function(form) {
$('#username',form).attr('readonly','readonly');
$('#domain',form).attr('readonly','readonly');
}
},
{ // add options
beforeShowForm: function(frm) {
$('#username',form).removeAttr('readonly');
$('#domain',form).removeAttr('readonly');
}
});
如果您不想在编辑对话框中显示字段“用户名”和“域名”，则可以执行
jQuery("#myGrid").jqGrid('navGrid','#myGrid-pager',
{ }, //options
{ recreateForm: true, // edit options
beforeShowForm: function(form) {
$('#username',form).hide();
$('#domain',form).hide();
}
});
它应该在jqGrd的免费版本中工作，但因为你使用SetUpGrid来设置jqGrid导航栏的ome设置（如grid.ToolBarSettings.ShowEditButton = true）。你也用
grid.ClientSideEvents.GridInitialized = "initGrid"
我不确定你在initGrid函数内可以做些什么。可能你应该定义一些额外的回调而不是调用jQuery("#myGrid").jqGrid('navGrid', ...);。查看http://www.trirand.net/documentation/aspnet/_2s20v9uux.htm和http://www.trirand.com/blog/phpjqgrid/docs/jqGrid/jqGridRender.html#methodsetNavOptions
答案 1 :(得分：3)
我最终购买了jqGrid的付费版本 - 我通过使用干净的.Net对象模型来节省的时间与javascript相比，很快就能收回成本。
直接来自Trirand支持的这个问题的答案是。
您可以使用客户端事件AfterEditDialogShown和AfterAddDialogShown来禁用/启用两个对话框的编辑字段。用于编辑/添加的字段具有相同的ID是DataField（区分大小写）。例如：
型号：
JQGrid1.ClientSideEvents.AfterEditDialogShown="disableFields";
JQGrid1.ClientSideEvents.AfterEditDialogShown="enableFields";
查看：
<script type="text/javascript">
function disableFields() {
//jQuery("#fieldname").attr("disabled", "disabled");
$("#Source").attr("disabled", "true");
$("#ProgramName").attr("disabled", "true");
$("#Division").attr("disabled", "true");
$("#Medium").attr("disabled", "true");
$("#content").attr("disabled", "true");
}
function enableFields() {
$("#Source").attr("disabled", "false");
$("#ProgramName").attr("disabled", "false");
$("#Division").attr("disabled", "false");
$("#Medium").attr("disabled", "false");
$("#content").attr("disabled", "false");
}
</script>
答案 2 :(得分：0)
当前解决方案：jqGrid 4.5.4 - jQuery Grid
在editGridRow（第7447行）
之后的这一行之后if (rowid === "new") {
rowid = "_empty";
frmoper = "add";
p.caption=rp_ge[$t.p.id].addCaption;
} else {
p.caption=rp_ge[$t.p.id].editCaption;
frmoper = "edit";
}
我把这个修改
$t.p.custom_frmoper = frmoper;
然后我可以决定在Popup EDIT和Popup ADD中做什么元素
$.ajax($.extend({
url: $.isFunction(options.dataUrl) ? options.dataUrl.call($t, rowid, vl, String(options.name)) : options.dataUrl,
type : "GET",
dataType: "html",
data: $.isFunction(postData) ? postData.call($t, rowid, vl, String(options.name)) : postData,
context: {elem:elem, options:options, vl:vl},
success: function(data){
var ovm = [], elem = this.elem, vl = this.vl,
options = $.extend({},this.options),
msl = options.multiple===true,
a = $.isFunction(options.buildSelect) ? options.buildSelect.call($t,data) : data;
if(typeof a === 'string') {
a = $( $.trim( a ) ).html();
}
if(a) {
$(elem).append(a);
setAttributes(elem, options, postData ? ['postData'] : undefined);
// CUSTOM CODE
$.each($t.p.colModel, function (i, current) {
if (current.not_editable) {
if ($t.p.custom_frmoper == 'edit') {
$("#" + current.name).attr('readonly', 'readonly');
$("#" + current.name).attr('disabled', 'disabled');
}
else {
$("#" + current.name).removeAttr('readonly');
$("#" + current.name).removeAttr('disabled');
}
}
});
我还在列模型中添加了一个自定义not_editable属性，以确定在ADDING时可以编辑特定列，在MODIFIYING时可以编辑只读
{ name: 'ID', index: 'ID', not_editable: true }
我希望它有所帮助。我创建了这个修改，因为SELECT元素不适用于此线程中的当前解决方案。