爲什麼只發送一個表單？

Question

我有這兩種形式，我想通過一次點擊發送它們。第一種形式將圖像加載到服務器中。第二個將信息加載到數據庫中。出於某種原因，總是隻發送「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> 

Answer 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> 

Answer 2

兩個數據您需要修改您的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>