Solved

Convert javascript to jquery for form with select options

Posted on 2008-11-02
3
1,412 Views
Last Modified: 2010-04-21
How do you make this code into jquery javascript code? Your help is greatly appreciated.

////////////////////
The original question was http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/HTML/Q_23868468.html
The issue was:
When the user selects a choice, I need the choiceCode which is a1,a2, or a3.
I also need the words "Information" or "Sessions" or "Case Studies" passed via the form also to choiceInfo.

I need where it says:
   <input type="hidden" name="choiceInfo" value="">
For the value to be filled in with the above selection.
One last thing, I would like to actually *not* use the submit button, and just have onChange submit the form.
////////////////////

And now I would like to see this solution as jquery ... is this possible?
Thank you!

<script type="text/javascript">

function setValue()

{

var form=document.getElementById('choice');

form['choiceInfo'].value=form['choiceCode'].getElementsByTagName('option')[form['choiceCode'].selectedIndex].innerHTML; 

form.submit();

}

</script>

 

<form id="choice">

<select name="choiceCode" onchange="setValue()">

<option value="00" selected="">Choose</option>

<option value="a1">Information</option>

<option value="a2">Sessions</option>

<option value="a3">Case Studies</option>

</select>

 

<input type="hidden" name="choiceInfo" value="">

</form>

Open in new window

0
Comment
Question by:ssjo22
  • 2
3 Comments
 
LVL 16

Accepted Solution

by:
sh0e earned 500 total points
ID: 22863925
jQuery code is JavaScript code.  There are just things that jQuery makes easier.  I don't see any reason that you need to replace the above.
<script type="text/javascript">

function setValue()

{

  var form=$('#choice');

  form.find(':hidden[name="choiceInfo"]').val(

    form.find('select[name="choiceCode"] option:selected').text()

  );

  form.submit();

}

$(document).ready(function(){

  $('#choice select[name="choiceCode"]').change(setValue);

});
 

</script>

 

<form id="choice">

<select name="choiceCode">

<option value="00" selected="">Choose</option>

<option value="a1">Information</option>

<option value="a2">Sessions</option>

<option value="a3">Case Studies</option>

</select>

 

<input type="hidden" name="choiceInfo" value="">

</form>

Open in new window

0
 

Author Comment

by:ssjo22
ID: 22864479
Thank you. I got some basic jquery working, but this would really help me to learn how that javascript can be converted to how jquery works. As I really was unsure of how to convert it over ...

This really helps me understand javascript and jquery more. Thanks!
0
 

Author Closing Comment

by:ssjo22
ID: 31512531
Thanks again!
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

867 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now