我有一个局部视图,其中WebGrid中有一个链接可以打开一个对话框模式框。 以前,我在非局部视图上运行时,代码运行良好。 但是,当我将相同的代码转移到局部视图时,单击事件不起作用。
请参阅WebGrid的第4列,那里的click事件不会触发并进入脚本代码。我尝试将警报放在函数声明的开头进行检查,但javascript无法正常工作。 相同的代码正在使用非局部视图,但在此处不起作用。
以下是我的部分视图的代码:
@model LpResources.Models.ATMCRM.ATMCRMProcedureDetails
@{ var grid = new WebGrid(
canPage: true,
rowsPerPage: 30,
canSort: true,
ajaxUpdateContainerId: "result"
);
grid.Bind(Model.GetReviewDetails, autoSortAndPage: true, rowCount: Model.GetReviewDetails.Count());
grid.Pager(WebGridPagerModes.All);
}
<html>
<head>
<link href="https://code.jquery.com/ui/1.12.0-rc.2/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width" />
<title>SDMDesk</title>
</head>
<body>
<div class="row">
<div class="col-md-1 col-sm-1 col-xs-1 "></div>
<div class="col-md-10 col-sm-10 col-xs-10 ">
<div class="panel panel-primary">
<div class="panel-heading" style="text-align:left">
<h3 class="panel-title">Work-done Details</h3>
</div>
<div class="panel-collapse collapse in" role="tabpanel">
<div class="panel-body">
<div class="table-responsive" style="text-align: left">
@grid.GetHtml(tableStyle: "table table-hover table-bordered",
headerStyle: "text-align: center",
mode: WebGridPagerModes.All,
firstText: "<< First",
previousText: "< Prev",
nextText: "Next >",
lastText: "Last >>",
columns: grid.Columns(
grid.Column("CALLTICKETNUMBER", " CallTicket Number"),
grid.Column("CALLTICKETDATE", "CallTicket Date"),
grid.Column("CUSTOMERNAME", "Customer"),
grid.Column(header: "Action",
format: @<text><a data-value='@item.CALLTICKETNUMBER' href='javascript:void(0)' class='btnEdit'>Review</a></text>)))
<div id="dialog" title="edit view" style="overflow: hidden;"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<hr />
</body>
</html>
@section Scripts{
<script src="https://code.jquery.com/ui/1.12.0-rc.2/jquery-ui.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script type="text/javascript">
$(function () {
var url = '@Url.Action("GetDetailByTicket", "BankingService")';
var CALLTICKETNUMBER = 0;
$(document).on('click', '.btnEdit', function () {
CALLTICKETNUMBER = $(this).attr("data-value");
$('#dialog').dialog('open');
});
$('#dialog').dialog({
autoOpen: false,
width: 400,
resizable: false,
title: 'Review Call Ticket',
modal: true,
open: function (event, ui) {
// Load partial view _GridEditPartial
$(this).load(url, { CALLTICKETNUMBER: CALLTICKETNUMBER });
},
buttons: {
"Close": function () {
$(this).dialog("close");
}
}
});
});
</script>
}