2016-06-01 7 views
0

私はフォームを提出したい。ページに複数のフォームがある場合、どのように特定のフォームを送信できますか?

<form> 
    <input name="name" value="somebody"><br> 
    <button type="submit" name="action" value="Submit" name="submit" >Submit</button> 
    </form> 

<script> 
    $(document).on('submit','form',function(e){ 
      e.preventDefault(); 
      $form = $(this); 
      submit($form); 
      }); 

     function submit($form){ 
      ...do something.... 
     } 
</script> 

をしかし、私は私のページに複数のフォームを持っているので、私はこのような何かをしようとしています:このように、それは非常にうまく機能している

 <form name="myform"> 
     <input name="name" value="somebody"><br> 
     <button type="submit" name="action" value="Submit" name="submit" >Submit</button> 
     </form> 

    <script> 
     $(document).on('submit','myform',function(e){ 
       e.preventDefault(); 
       $form = $(this); 
       submit($form); 
       }); 

      function submit($form){ 
       $.ajax('action.php', { 
       method: 'POST', 
       data: $form.serialize(), 
       success: function(result) { 
       $('#result').html(result); 
       } 
      }); 
     } 
    </script> 

をしかし、これは、残念ながら機能していません。なぜなのかご存知ですか?

+1

ちょうどそれに一意のIDやクラス、次に$フォーム= $(this)を与えます。 $ form = $( '#formId')になります。 –

+0

@DanWeberさて、私はそれをテストします!どうもありがとうございました! – Jarla

+0

@DanWeberあなたの解決策では、私の関数 'submit($ form)'はもう役に立たなかった – Jarla

答えて

1

これはあなたを始めてくれるはずです。また、フォーム提出ごとに異なる機能を持つこともできます。

function submit($form, action) { 
 
    alert("Submitting form"); 
 

 
    $.ajax(action, { 
 
    method: 'POST', 
 
    data: $form.serialize(), 
 
    success: function(result) { 
 
     $('#result').html(result); 
 
    } 
 
    }) 
 
} 
 

 
// Shorthand for $(document).ready() 
 
$(function() { 
 

 
    $("#btn1").click(function() { 
 
    alert("Submitting form 1"); 
 

 
    submit($("#frm1"), 'action1.php'); 
 
    }); 
 

 
    $("#btn2").click(function() { 
 
    alert("Submitting form 2"); 
 

 
    submit($("#frm2"), 'action2.php'); 
 
    $("#frm1").submit(); 
 
    }); 
 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<form id="frm1" name="frm1"> 
 
    <input name="name" value="somebody"> 
 
    <br> 
 
    <button type="submit" id="btn1" name="btn1" value="Submit">Submit Form 1</button> 
 
</form> 
 

 
<br> 
 
<br> 
 

 
<form id="frm2" name="frm2"> 
 
    <input name="name2" value="somebody else"> 
 
    <br> 
 
    <button type="submit" id="btn2" name="btn2" value="Submit">Submit Form 2</button> 
 
</form>

+0

ありがとうございました!これは働いています:) – Jarla

+0

あなたは大歓迎です。 –

関連する問題