使用jQuery表单插件提交多个表单

我有两种形式使用jQuery Form Plugin提交TinyMCE Inline中的内容。这些工作都很好，但我希望能够在这种情况下使用一个按钮提交所有表单。每页不会有超过5个表格。使用jQuery表单插件提交多个表单

我看了很多其他帖子，他们没有一个似乎适用于我的情况。大多数其他解决方案都使用空值POST值提交表单。

<?php require_once('connect.php'); ?> 
 
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title>Tiny MCE</title> 
 

 
\t <link rel="stylesheet" type="text/css" href="stylesheet.css"> 
 

 
\t <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
 
\t <script type="text/javascript" src="js/tinymce/tinymce.min.js"></script> 
 
\t <script type="text/javascript" src="jquery.form.min.js"></script> 
 

 
\t <script type="text/javascript"> 
 
\t \t tinymce.init({ 
 
\t \t \t selector: '.editable', 
 
\t \t \t inline: true 
 
\t \t }); 
 
\t </script> 
 

 
<!-- Submits forms --> 
 
\t <script type="text/javascript"> 
 
\t \t $(document).ready(function(){ 
 
\t \t \t $('.input_form').ajaxForm({ url: 'qry.php', type: 'post' }); 
 
\t \t }); 
 
\t </script> 
 

 
\t <script type="text/javascript"> <!-- Loads whatever was submitted last time into the respective div --> 
 
\t \t $(document).ready(function(){ 
 
\t \t \t $('#index_s1').load('load.php?form_ID=index_s1'); 
 
\t \t \t $('#index_s2').load('load.php?form_ID=index_s2'); 
 
\t \t }); 
 
\t </script> 
 

 
</head> 
 
<body> 
 
<section> 
 
\t <h1>Tiny MCE Tests</h1> 
 
</section> 
 

 
<section> 
 
<button id="submit_all">Submit All</button> <!-- submit all forms using this button --> 
 
\t 
 
\t <form class="input_form"> 
 
\t \t <div class="editable" id="index_s1"></div> 
 
\t \t <input type="submit" name="sub" value="Submit"> 
 
\t </form> 
 

 
\t <form class="input_form"> 
 
\t \t <div class="editable" id="index_s2"></div> 
 
\t \t <input type="submit" name="sub" value="Submit"> 
 
\t </form> 
 

 
</section> 
 

 
</body> 
 
</html>

我在jQuery的新手这就是为什么我使用的表格插件。

在此先感谢！

来源

2017-06-22 Alex. W

解决了我的问题 - 使用mhatch的答案和this，我加了tinyMCE.triggerSave();，它在发送前填充密钥。

function massSubmit(){ 
    var formsList = document.forms; 
    for(var i=0; i<formsList.length; i++){ 
     tinyMCE.triggerSave(); 
     $.post('qry.php', $(formsList[i]).serialize()) 
    } 
}

来源

2017-06-22 20:37:22

不错！你找到了缺失的行:) – mhatch

看起来你只需要调用'triggerSave（）'一次，所以你可以将它移动到循环之外。 – mhatch

看起来你是对的！谢谢您的帮助 –

尝试使用jQuery这样的事情：

$('#submit_all').click(function(){ 
$('.input_form').each(function(){ 
    $.ajax({type:"POST",url: window.location.pathname ,data:{"post":$(this).serialize()}}) .always(function(e) { 
    // finished 
    }); 
}); 
});

来源

2017-06-22 19:22:26 Richard

认为它会工作，但不会发布'index_s1'或'index_s2'的值。 TinyMCE通常使用ID来张贴表单。 –

您可以使用document的forms属性来获取形式的数组。

function massSubmit(){ 
    var formsList = document.forms; 
    for(var i=0; i<formsList.length; i++){ 
    $.post('server.php', $(formsList[i]).serialize()) 
    } 
}

更新：

您需要使用AJAX否则只有第一种形式将提交提交。

来源

2017-06-22 19:31:22 mhatch

返回'TypeError：formsList [i] .submit不是函数'。另外，我添加了动作属性。 –

如果你'console.log（formsList）'你有没有得到表单对象的数组？ – mhatch

经过进一步思考，一旦第一个表单提交，其他人就不会。最好使用ajax提交它们。但是您应该能够遍历'document.forms'节点列表来访问和提交每个节点列表。 – mhatch

使用jQuery表单插件提交多个表单

回答

相关问题