我有jqgrid和模态。通过使用模态窗口，我们可以在网格的行上进行编辑的同时向网格中添加值，必须显示模态窗口并使用网格中的行值进行填充。我已经尝试过@htmlaction在jqgrid上单击，它可以进入控制器，但是可以如何在编辑时调用模态窗口来填充网格行数据。
jQuery("#listvalues_ajaxGrid").jqGrid({
url: '@Url.Action("ListvaluesGrid")',
datatype: "json",
mtype: 'Get',
colNames: [
'List Key', 'List Value Name', 'List Value Code', 'Inactive'],
colModel: [
{ key: false, name: 'list_key', hidden: true },
{
key: false, name: 'list_value_name',
formatter: function (cellvalue, options, rowObject) {
show();
var x = '@Html.ActionLink("Col", "Edit", "Lists", new { id = "listvalid" }, new { @style = "color:black;font-weight:bold;" })';
return x.replace("listvalid", rowObject.list_key).replace("Col", rowObject.list_value_name);
}, sortable: true, align: 'left', width: 200, editable: true
},
@*@Html.ActionLink("Edit", "Edit", null, new { id = 234 }, new { @class = "modal" })*@
//{ key: true, name: 'list_value_name', hidden: false, editable:true },
{ key: false, name: 'list_value_code', hidden: false, editable: false },
{ key: false, name: 'inactive', hidden: false, width: 50, sortable: false, formatter: "checkbox", align: "center", editable: false },
],
sortname: 'list_key',
sortorder: "asc",
viewrecords: true,
rowNum: 5,
pager: '#listvalues_ajaxPager',
onSelectRow: function (id) {
if (id && id !== lastSel) {
listvalues_ajaxGrid.jqGrid('restoreRow', lastSel);
var cm = grid.jqGrid('getColProp', 'Name');
cm.editable = false;
grid.jqGrid('editRow', id, true, null, null, 'clientArray');
cm.editable = true;
lastSel = id;
}
},
height: '200px', mtype: 'GET',
emptyrecords: 'No records found',
autowidth: true,
mutiselect: true,
altRows: true,
'cellEdit': true,
'cellsubmit': 'clientArray',
editurl: '@Url.Action("ListvaluesGrid")',
loadComplete: function () {
var table = this;
setTimeout(function () {
updatePagerIcons(table);
}, 0);
},
jsonReader: {
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: false,
userdata: "userdata"
},
//editurl:
});
my bootstrap modal window
<div class="modal fade" id="modalBootstrap" role="dialog">
@Html.Hidden("hid_listvalues")
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">List Values</h4>
</div>
<div class="modal-body">
<div class="form-group">
@Html.LabelFor(model => model.maslistvalues.list_value_code, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.maslistvalues.list_value_code, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.maslistvalues.list_value_code, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.maslistvalues.list_value_name, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.maslistvalues.list_value_name, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.maslistvalues.list_value_name, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.maslistvalues.inactive, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<div class="checkbox">
@Html.EditorFor(model => model.maslistvalues.inactive)
@Html.ValidationMessageFor(model => model.maslistvalues.inactive, "", new { @class = "text-danger" })
</div>
</div>
</div>
</div>
<div class="modal-footer">
<div class="wizard-actions">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<input type="submit" value="Save" class="btn btn-primary" onclick="saveclick_listvalues();" />
</div>
</div>
</div>
</div>
</div>
在jquery formatter函数中，我们可以调用模式弹出窗口
formatter: function (cellvalue, options, rowObject) {
var x ='@Html.ActionLink("Col", "Index", "Lists", new { id1 = "listid" }, new { @style = "color:black;font-weight:bold;", onclick="check();" })';
//var x+='<a href="#" data-toggle="modal" data-target="#modalBootstrap" onclick="return check();"><i class="fa fa-pencil icon"></i></a>';
var a = sessionStorage["Selected"];
if (a == 0)
{
$('#modalBootstrap').modal('show'); //---popupshow
sessionStorage["Selected"] = null;
}
return x.replace("listid", rowObject.list_value_key).replace("Col", rowObject.list_value_name);
}, sortable: false, align: 'left', editable: false
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句