How to submit the correct div elements (not the div that's hidden)?

Posted by user356651 on Stack Overflow See other posts from Stack Overflow or by user356651
Published on 2010-06-02T16:25:47Z Indexed on 2010/06/02 16:34 UTC
Read the original article Hit count: 140

Filed under:
|

Hello,

I have the following code working fine but the problem is that it always submits the first div (article) even though it's hidden. My question is how do I submit the form and the elements in the form in the div that's shown? (if I select Music radiobutton, I want to submit the input elements of the Music Div not the Article div. Thanks.

$(document).ready(function(){ 
    $("input[name$='itemlist']").click(function() {
        var selection = $(this).val();
        $("div.box").hide();
        $("#"+selection).show();
    });
});

 <!--radio buttons-->
 <div id="articleselection"><input name="itemlist" type="radio" value="article" /> Article/Book </div>
 <div id="musicselection"><input name="itemlist" type="radio" value="music" /> Music</div>


 <!--article div starts-->
 <div id="article" class="box">
 <table class="fieldgroup">
 <tr><td>Journal Title: <input id="JournalTitle" name="JournalTitle" type="text" size="60" class="f-name" tabindex="1" value="JournalTitle">
 </table>

 <table class="fieldgroup">
 <tr><td>Article Author: <input id="ArticleAuthor" name="ArticleAuthor" type="text" size="40" class="f-name" tabindex="2" value="<"ArticleAuthor"></td></tr>
 </table>
 </div>

 <!--music div starts-->
 <div id="music" class="box">
 <table class="fieldgroup">
 <tr><td>Music Title: <input id="Music Title" name="Music Title" type="text" size="60" class="f-name" tabindex="1" value="Music Title">
 </table>

 <table class="fieldgroup">
 <tr><td> Music Author: <input id="MusicAuthor" name="Music Author" type="text" size="40" class="f-name" tabindex="2" value="<"MusicAuthor"></td></tr>
 </table>
 </div>                 

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about hide