Question

我在异常列中的数据非常大，我决定显示动作链接而不是数据，当用户点击该链接时，模态弹出将显示数据。我能够显示模型弹出点击Action Link但我的问题是我无法在Modal Pop Up中显示与该Record相对应的数据。下面是我调用Modal PopUp的Javascript代码

@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>

以下是显示数据的网格

<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 
})

在单击Web Grid Column后以模态弹出显示数据

1 个答案: