多个表单,一次点击,发布所有表单的输入?

时间:2014-09-04 14:42:33

标签: javascript php html

我们说我在一个页面中有多个表单。用户可以逐个提交这些表格。但用户希望发布所有这些表格'只需一个按钮(如phpmyadmin界面)输入。怎么能解决这个问题呢?

3 个答案:

答案 0 :(得分:0)

您不能使用普通的HTML表单来执行此操作,但是,您可以使用AJAX解决此问题并以异步方式单独提交每个请求。例如,假设你有三种形式:

<form action="url1.php" id="frm1">
  <input type="text" name="username" />
  <input type="text" name="email" />
</form>
<form action="url2.php" id="frm2">
  <input type="text" name="firstname" />
</form>
<form action="url3.php" id="frm3">
  <input type="text" name="username" />
  <input type="text" name="email" />
</form>

在AJAX Call中,暂时使用jQuery:

$(".submitAll").click(function(){
  $("form").each(function(){
    $.post($(this).attr("action"), $(this).serialize());
  });
});

答案 1 :(得分:0)

这应该有用......至少应该让你开始走上正轨。 使用jQuery:

$("form").submit(function(e){ 

    e.preventDefault();
    e.stopPropagation(); 
    formData = []; 

    $("form").each(function(){

        formData.push($(this).serializeArray());

    });


    $.ajax({

        url: "yourProcessingScript.php", 
        type: "POST",
        data: formData,
        success:function(response){

            alert("Success, probably - ! ");

        } 

     });

});  

答案 2 :(得分:0)

你可以在没有ajax的情况下做到这一点,但它有点棘手。将提交按钮放在单独的<form>中,您只需点击提交按钮即可复制所有表单数据。

<?php
    $result = (isset($_POST)) ? $_POST : "";
?>

<!-- Your forms -->
<form action="" method="POST" class="myForm" onsubmit="return false;">
    <input type="text" name="a" />
</form>
<form action="" method="POST" class="myForm" onsubmit="return false;">
    <input type="text" name="b" />
</form>
<form action="" method="POST" class="myForm" onsubmit="return false;">
    <input type="text" name="c" />
</form>
<form action="" method="POST" class="myForm" onsubmit="return false;">
    <input type="text" name="d" />
</form>

<!-- Target form -->
<form action="" method="POST" id="submit-form">
    <input type="submit" id="submit" />
</form>

<pre><?php print_r($result); ?></pre>

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#submit").click(function(event) {
            inputs = $(".myForm input");
            inputs.each(function(index) {
                $(inputs[index]).clone(true).appendTo("#submit-form").css("display", "none");
            });
        });
    });
</script>

PHPFiddle链接:http://phpfiddle.org/main/code/g6ba-iyqn

相关问题