Question

我正在尝试使用jQuery UI的对话框集成新功能。

我有一个带链接的页面。单击链接时，将打开一个包含表单的模式对话框。那部分工作正常。

$("#myForm").hide();
$("#myLink").click(function(){
    $("#myForm").dialog({
        modal: true,
        draggable: false,
        resizable: false,
        width: 450,
        buttons: {
            "Submit": function() {
                // ???
            },
            "Cancel": function() {
                $(this).dialog("close");
            }
        }
    });
});

<a href="#" id="myLink">Open Dialog</a>

<div id="myForm">
    <form>
      <textarea id="myValues" rows="10"></textarea>
    </form>
</div>

现在，我需要在对话框和POST结果中将表单提交到同一页面。我对如何实现其余部分感到困惑。我确实查看了jQuery .post（）示例，这让我更加困惑。该页面是PHP格式，因此在提交结果时，我需要获取post值并执行一些服务器站点操作。

if (isset($_POST["myValues"])) {
   // do something
}

坚持，需要帮助。

Answer 1

在“提交”按钮的jQuery函数中：

$('form#myFormId').submit();

在HTML中：

<form id="myFormId" method="POST" action="processingscript.php">

然后php脚本将获取已经POST的所有值并可以处理它们。

Answer 2

查看使用jQuery提交功能

参考：http://api.jquery.com/submit/

Answer 3

使用此方法更新对话框内容：

              $("#myformid").dialog({
              modal: true,
               draggable: false,
               resizable: false,
               width: 450,
                buttons: {
                    "Submit": function (event) {

                        event.preventDefault();
                        var formvalues = $("#myformid").serialize();
                        $.post('/Home/Edit', formvalues, function (data) {
                           //use data
                            $('#myformid').html(data);

                        }, "html");

                    },
                    "Cancel": function () {
                        $(this).dialog("close");
                    }
                }

            });

在控制中，

    [HttpPost]
    public PartialViewResult Edit(ViewModel model) {

       //use data

        return PartialView("MyDialogView", model);
    }

从jQuery UI对话框发布

3 个答案: