以模式显示数据单击“ Web网格列”后弹出

Question

我的“异常栏中的数据”非常大，我决定显示“动作链接”而不是“数据”，当用户单击该链接时，模式弹出窗口将显示数据。单击“动作链接”可以显示模型弹出窗口但我的问题是我无法在模式弹出窗口中显示与该记录对应的数据。 下面是我的Java代码，用于调用Modal PopUp

@model IList<ClaimBuildMVC.Models.ApplicationLog>
@{        
    Layout = "~/Views/Shared/_SuperAdminLayout.cshtml";
    WebGrid grid = new WebGrid(Model, canSort: false, canPage: false, columnNames: new[] { "Logger", "User", "Date", "Message", "Exception", "ErrorID" });
}
<script type="text/javascript">
    $(document).ready(function () {
        $('#ErrorLog').DataTable({
            "bSort": false,                
            "oLanguage": {
                "sLengthMenu": "_MENU_ records per page",
                "sSearch": ""
            }
        });
        $('.dataTables_filter input').attr("placeholder", "Search by Error details...");
        $(".ActionEdit").click(function () {
            $(".ActionEdit").removeAttr('href');
            $(".ExceptionModal").modal();
        });
    });
</script>

下面是显示数据的Web网格

<div class="Content-inner-pages">
    <div class="TopHeading TopHeading2">
        <h2>Error Log</h2>
    </div>
    <div class="box">
        <div class="box-content">
            <div class="CustomerUsers">
                <div class="box">
                    <div class="box-content Custom-DataTable">
                        @grid.GetHtml(
                         htmlAttributes: new { id = "ErrorLog" },
                         fillEmptyRows: false,
                         alternatingRowStyle: "alternate-row",
                         tableStyle: "table table-hover dt-responsive CustomDatable",
                         headerStyle: "grid-header",
                         footerStyle: "grid-footer",
                         mode: WebGridPagerModes.All, columns: new[] {
                         grid.Column("Logger",header: "Page", canSort:false),
                         grid.Column("User",header:"UserId",canSort:false),
                         grid.Column("Date",header: "CreatedDate",canSort:false),
                         grid.Column("Message",header: "ErrorMessage",canSort:false),
                         grid.Column(header: "Exception", format:(item) =>
                             new HtmlString(Html.ActionLink("Edit", "#", new { id =item.ErrorID }, new { @class = "ActionEdit"}).ToString()
                         ))
                         })
                    </div>

                    <div class="modal fade ExceptionModal" role="dialog">
                        <div class="modal-dialog modal-lg">
                            <div class="modal-content">
                                //Here i want to Load Exception Column Data that will Display to End user
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

让我知道我在哪里做错了或应该采取什么解决方案。

Answer 1

您必须执行两个步骤，首先将您当前点击的td存储在会话或全局变量中，例如

$(".ActionEdit").click(function () {
        $(".ActionEdit").removeAttr('href');
        //storing your td in session 
        session["currentTdData"] = $(this);
        $(".ExceptionModal").modal();
    });

然后您必须在加载模式弹出窗口后的bootstrap事件中用当前td数据填充模式

$('.ExceptionModal').on('shown.bs.modal', function() {
      // here you can session["currentTdData"] data 
})