jQuery的模态窗口中显示的MVC表 [英] jQuery Modal Window to Display a Table in MVC

问题描述

让我说，我没有经验的JavaScript开始的。

Let me start of by saying that I am inexperienced with JavaScript.

这是我想做的事情。当用户点击显示详细信息的数据行，他们得到一个弹出窗口（模式？）窗口，拥有从MVC应用程序中的另一个操作产生的一些数据。我在哪里可以找到实现像这样的例子吗？

Here is what I want to do. When the user clicks "Show Details" on a row of data, they get a pop-up (modal?) window that has some data generated from another action within the MVC application. Where can I find an example of implementing something like this?

此外，当用户点击这两种弹出批准或原始数据行另一个弹出式窗口将与形式的人需要填写显示。

Also, when a user clicks "Approve" on either this pop-up or on the original data row another pop-up will display with a form a person needs to fill out.

任何方向将大大AP preciated。

Any direction will be greatly appreciated.

推荐答案

首先，你需要一个DIV地方在页面上 - 让说给它一个ID为PopUpPanel。现在创建一个准备事件的jQuery初始化弹出/模态对话框：

First of all, you will need a DIV somewhere on your page - let say give it an id "PopUpPanel". Now create a "ready" event for jQuery to initialize the pop-up/modal dialog:

<script type="text/javascript">
    $(document).ready(function () {
        $("#PopUpPanel").dialog({
            modal: true,
            autoOpen: false,
            height: 'auto',
            width: 'auto',
            buttons: {
                "Close": function () {
                    $(this).dialog("close");
                }
            }
        });
    });
</script>

假设该行有一个链接显示详细信息 - 创建显示详细信息点击处理程序：

Assuming the row has a link "Show Detail" - Create a "handler" for "Show Detail" click:

<script type="text/javascript">
    function showDetail(id) {
        $.get('MyController/MyAction/' + id, function(data) {
            $('#PopUpPanel').html(data);
            $('#PopUpPanel').dialog('open');
        });
    }
</script>

这些应该让你到您的详细页面显示弹出/对话框窗口的地步。弹出的其他形式的额外的细节对话框或更换细节对话框，它应该是相似pretty。

Those should get you to the point where your detail page is showing up in a pop-up/dialog window. To pop-up the other form in additional to the detail dialog or to replace the detail dialog, it should be pretty similar.

这篇关于jQuery的模态窗口中显示的MVC表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！