Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery multi form submit individually
    primarykey
    data
    text
    <p>I have two forms on page</p> <pre><code> &lt;div class="list"&gt; &lt;div class="item"&gt;&lt;a href="javascript: void(0);" class="okrug"&gt;Area 1&lt;/a&gt; &lt;div class="okrug_box"&gt; &lt;form method="post" class="okrug_form"&gt; &lt;div class="success" style="display: none;"&gt;New item is added.&lt;/div&gt; &lt;div class="label"&gt;Opština&lt;/div&gt; &lt;div class="field"&gt;&lt;input type="text" id="opstina" name="opstina" /&gt;&lt;/div&gt; &lt;div class="clear"&gt;&lt;/div&gt; &lt;input type="hidden" name="oid" id="oid" value="2" /&gt; &lt;input type="submit" value="Add" class="submit"&gt; &lt;p&gt;&lt;a href="javascript: void(0);" id="close"&gt;Close&lt;/a&gt;&lt;/p&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="list"&gt; &lt;div class="item"&gt;&lt;a href="javascript: void(0);" class="okrug"&gt;Area 2&lt;/a&gt; &lt;div class="okrug_box"&gt; &lt;form method="post" class="okrug_form"&gt; &lt;div class="success" style="display: none;"&gt;New item is added.&lt;/div&gt; &lt;div class="label"&gt;Opština&lt;/div&gt; &lt;div class="field"&gt;&lt;input type="text" id="opstina" name="opstina" /&gt;&lt;/div&gt; &lt;div class="clear"&gt;&lt;/div&gt; &lt;input type="hidden" name="oid" id="oid" value="1" /&gt; &lt;input type="submit" value="Add" class="submit"&gt; &lt;p&gt;&lt;a href="javascript: void(0);" id="close"&gt;Close&lt;/a&gt;&lt;/p&gt; &lt;/form&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>and I need to submit them individually with same jquery code</p> <pre><code>$(document).ready(function(){ $('.okrug').click(function() { if($(this).next().is(':visible')) { $('div.okrug_box').slideUp('normal'); } else { $('div.okrug_box').slideUp('normal'); $(this).next().slideDown('normal'); } }); $('a#close').click(function(){ $('div.okrug_box').slideUp('normal'); }) //HIDE THE DIVS ON PAGE LOAD $("div.okrug_box").hide(); $(".okrug_form").submit(function() { // we want to store the values from the form input box, then send via ajax below var opstina = $('#opstina').attr('value'); var oid = $('#oid').attr('value'); var part = $('#part').attr('value'); $.ajax({ type: "POST", url: "okrug.php", data: "part="+ part +"&amp;oid="+ oid +"&amp;opstina="+ opstina, success: function(){ $('div.success').fadeIn(); setTimeout("$('div.success').fadeOut();", 6000); } }); return false; }); }); </code></pre> <p>How can I do this? Here is a preview <a href="http://jsfiddle.net/WvQXQ/" rel="nofollow">http://jsfiddle.net/WvQXQ/</a></p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload