Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

how to get all drop down values

Posted on 2014-11-13
8
Medium Priority
?
252 Views
Last Modified: 2014-11-18
Hi ,

I have  n number of drop down in my JSp .   n   value will depends upon the user need (requirement).


i want to get all the drop down values. how to get that ?
div id="headNo1">
<select name="headNo1" id="headNo1">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
	<option value="5">5</option>
	<option value="6">6</option>
	<option value="7">7</option>
	<option value="8">8</option>
	<option value="9">9</option>
</select>
</div>
<div id="headNo2">
<select name="headNo2" id="headNo2">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
	<option value="5">5</option>
	<option value="6">6</option>
	<option value="7">7</option>
	<option value="8">8</option>
	<option value="9">9</option>
</select>
</div>
<div id="headNo3">
<select name="headNo3" id="headNo3">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
	<option value="5">5</option>
	<option value="6">6</option>
	<option value="7">7</option>
	<option value="8">8</option>
	<option value="9">9</option>
</select>
</div>

...........

<div id="headNon">
<select name="headNon" id="headNon">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
	<option value="5">5</option>
	<option value="6">6</option>
	<option value="7">7</option>
	<option value="8">8</option>
	<option value="9">9</option>
</select>
</div>

Open in new window

0
Comment
  • 4
  • 3
8 Comments
 
LVL 8

Expert Comment

by:vr6r
ID: 40441953
This will loop through any dropdown elements found and perform the code within the function on them.  Access the dropdown value within the fuction using $(el).val()

$('select').each(function(ix,el){
	//add code here.
	//dropdown val = $(el).val()
});

Open in new window


Working example: http://jsfiddle.net/vp20abhh/
0
 
LVL 20

Author Comment

by:Sathish David Kumar N
ID: 40442000
Thanks vr6r ....

may i know what is ix and el

is el means element ?

but if i want to take value with id because ...

some other drop down(element id will differ eg: counId like that ) also there
0
 
LVL 8

Expert Comment

by:vr6r
ID: 40442061
Yes in that example, el is the element referenced in the current loop iteration.  Likewise, ix is the index number of that element within the collection of elements returned by the selection, which in this case is all "select" dropdown elements.

Are you asking how you would get the element id, along with the value?
If so, you would do something like this...

$('select').each(function(ix,el){
	alert($(el).attr('id') + ": " + $(el).val());
});

Open in new window


Hope this helps.
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
LVL 20

Author Comment

by:Sathish David Kumar N
ID: 40442068
no no...
div id="headNo1">
<select name="headNo1" id="headNo1">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
	<option value="5">5</option>
	<option value="6">6</option>
	<option value="7">7</option>
	<option value="8">8</option>
	<option value="9">9</option>
</select>
</div>
<div id="headNo2">
<select name="headNo2" id="headNo2">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
	<option value="5">5</option>
	<option value="6">6</option>
	<option value="7">7</option>
	<option value="8">8</option>
	<option value="9">9</option>
</select>
</div>
<div id="xxxx">
<select name="xxxxx" id="xxxx">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
	<option value="5">5</option>
	<option value="6">6</option>
	<option value="7">7</option>
	<option value="8">8</option>
	<option value="9">9</option>
</select>
</div>

...........

<div id="headNon">
<select name="headNon" id="headNon">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
	<option value="5">5</option>
	<option value="6">6</option>
	<option value="7">7</option>
	<option value="8">8</option>
	<option value="9">9</option>
</select>
</div>

Open in new window


you can check the above code there is 2 diffrent Id there

one is headno(1,2,3...n)
other  one xxxx

i want only headno values no other drop down values
0
 
LVL 8

Accepted Solution

by:
vr6r earned 2000 total points
ID: 40442104
Oh ok I see.
In that case I would suggest using a class name to differentiate between dropdowns you want and those that you don't.  Then you could just include that class name in the jquery selector.

So your dropdowns that you want to loop through would be defined like this... note the addition of the class "headNo":
<select class="headNo" name="headNo1" id="headNo1">
...
</select>
<select class="headNo" name="headNo2" id="headNo2">
...
</select>

Open in new window


Then include the class name in the jquery selection like this:
$('select.headNo').each(function(ix, el)){ 
    .... 
});

Open in new window


Here is an updated jsfiddle example:  http://jsfiddle.net/vp20abhh/1/
0
 
LVL 83

Expert Comment

by:leakim971
ID: 40444011
Test page : http://jsfiddle.net/31fbvfbo/

$("select[id^=headNo] option").each(function() {
      // checking, we alert value and text of option all select with ID like headNo(1,2,...)
      alert( $(this).val() + " / " + $(this).text() );
});

Open in new window

0
 
LVL 20

Author Comment

by:Sathish David Kumar N
ID: 40446633
vr6r its not working in my code ....

leakim971 i think your getting my question wrongly ...
i want the selected values of all drop down

i changed your code like this but not working can you help me
 
$("select[id^=headNo] selected ").each(function() {
      // checking, we alert value and text of option all select with ID like headNo(1,2,...)
      alert( $(this).val() + " / " + $(this).text() );
});

Open in new window

0
 
LVL 8

Expert Comment

by:vr6r
ID: 40446753
Are you getting an error message at all?  The jsfiddle link I included in my example will show you a working version of the code so you can see that it definitely works but it will be hard to tell what the problem is without more info.

If you can post the code you are using so we can take a look I suspect we'll be able to spot the issue pretty quickly.
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

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

In this article you'll learn how to use Ajax calls within your CodeIgniter application. To explain this, I'll illustrate how to implement a simple contact form to allow visitors to send you an email through your web site.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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)
Suggested Courses

564 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