为什么只发送其中一个表格?

时间:2016-11-03 12:18:32

标签: javascript php ajax forms

我有这两种形式,我想一键发送它们。第一种形式将图像加载到服务器中。第二个将信息加载到数据库中。出于某种原因,总是只有" myform"已发送。有什么想法吗?

<form action="uploadpic.php" method="POST" enctype="multipart/form-  data" />
    <input type="file" name="user_image" id="user_image" />
</form>

<form method = "post" id= "myform" name="myform" action = "<?php $_PHP_SELF  ?>">
    <table width = "400" border = "0" cellspacing = "1" cellpadding = "2">

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
   $(document).ready(function () {
       $("#add").click(function () {

           var $form1 = $("#myform");

           $.post($form1.attr("action"), $form1.serialize(), function () {
               alert('Form 1 elküldve');
           });

           $('form[name="user_image"]').each(function () {

               var $form = $(this);

               $.post($form.attr("action"), $form.serialize(), function () {
                   alert('Form 2 elküldve');
               });
           })
      });
  });
</script>

2 个答案:

答案 0 :(得分:1)

您可以同样使用一个表单并将数据发送到您想要的地方

<form action="uploadpic.php" method="POST" enctype="multipart/form-  data" />
   <input type="file" name="user_image" id="user_image" />

          <table width = "400" border = "0" cellspacing = "1" 
             cellpadding = "2">
//... other form details
</form>
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
   <script type="text/javascript">
   $(document).ready(function () {
   $("#add").click(function () {
   var $form1 = $("#myform");
   $.post($form1.attr("action"), $form1.serialize(), function () {
    alert('Form 1 elküldve');
   });

   $('form[name="user_image"]').each(function () {
    var $form = $(this);
    $.post($form.attr("action"), $form.serialize(), function () {
        alert('Form 2 elküldve');
    });
   })
  });
  });
 </script>

答案 1 :(得分:1)

你需要稍微修改一下你的javascript。 $('input[name="user_image"]').each(function () {将使用name="user_image"迭代输入并获取其形式。 (我想这就是你想要的)

<script type="text/javascript">
$(document).ready(function () {
   $("#add").click(function () {

       var $form1 = $("#myform");

       $.post($form1.attr("action"), $form1.serialize(), function () {
           alert('Form 1 elküldve');
       });

       $('input[name="user_image"]').each(function () {

           var $form = $(this).parent('form');

           $.post($form.attr("action"), $form.serialize(), function () {
               alert('Form 2 elküldve');
           });
       })
  });
});
</script>

但是如果您只有一个带name="user_image"的输入元素,那么这更合适:

<script type="text/javascript">
$(document).ready(function () {
   $("#add").click(function () {

       var $form1 = $("#myform");

       $.post($form1.attr("action"), $form1.serialize(), function () {
           alert('Form 1 elküldve');
       });

       var $form = $('input[name="user_image"]').parent('form');

       $.post($form.attr("action"), $form.serialize(), function () {
           alert('Form 2 elküldve');
       });
  });
});
</script>