How to submit the correct div elements (not the div that's hidden)?
- by user356651
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>
