在 JQuery 对话框中提交 HTML 表单答案

【问题标题】：Submitting HTML form in JQuery dialog在 JQuery 对话框中提交 HTML 表单
【发布时间】：2018-07-25 06:31:21
【问题描述】：

我正在尝试转换现有的 HTML 表单并使其出现在 JQuery 对话框中。我不确定如何更改代码，以便在单击提交按钮后提交数据。我的代码如下：

旧形式：

<form method="post" name="callbackrequest" id="ccallbackrequest" action="action.php" onsubmit="return validateThis(this)">

<button type="submit" class="submit">Submit Request</button>

新形式：

buttons: {
                "Submit": function() {
if ( bValid ) {

        HERE GOES THE CODE!

        $( this ).dialog( "close" );
              }

然后是新形式：

<form class="center" method="post" name="callbackrequest" id="ccallbackrequest" action="??">
 fields listed
no submit button
</form>

关于我应该如何处理的任何建议？

【问题讨论】：

你能做一个 jsfiddle 并向我们展示什么是破坏性的吗？我不确定发生了什么问题，或者你想要什么行为......jsfiddle.net
没有刹车，它不工作。我只是想提交按钮，我不知道在 JQuery 中执行此操作的代码。在 HERE GOES THE CODE 部分应该有一个提交表单的调用，但是我不知道该怎么做。

标签： jquery html jquery-ui jquery-ui-dialog

【解决方案1】：

让我们更进一步...这是一个使用 ajax 提交的对话框表单！

<form id="modalform" style="display:none">
     <input type="text" name="something">
     <input type="text" name="somethingelse">
</form>




$("#modalform").dialog({                                                            //Shows dialog
        height: 250,
        width: 450,
        modal: true,
        buttons: {
            "Cancel": function() {
                $( this ).dialog( "close" );
            },
            "Save": function() {
                $.ajax({
                    url: "/url/to/submit",                   //
                    timeout: 30000,
                    type: "POST",
                    data: $('#modalform').serialize(),
                    dataType: 'json',
                    error: function(XMLHttpRequest, textStatus, errorThrown)  {
                        alert("An error has occurred making the request: " + errorThrown)
                    },
                    success: function(data){                                                        
                         //Do stuff here on success such as modal info      
                             $( this ).dialog( "close" );
            }
        }
    });

【讨论】：

虽然我对 ajax 很熟悉，但我不确定如何使用对话框来实现它。这非常有帮助，谢谢！

【解决方案2】：

试试$('#ccallbackrequest').submit();。 submit 方法只是提交选择器返回的任何表单。

【讨论】：

【解决方案3】：

你只需要输入

 $("#FORM_ID").submit()

【讨论】：