Solved

how to get all drop down values

Posted on 2014-11-13
8
243 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
Comment Utility
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
Comment Utility
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
Comment Utility
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
 
LVL 20

Author Comment

by:Sathish David Kumar N
Comment Utility
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
Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

 
LVL 8

Accepted Solution

by:
vr6r earned 500 total points
Comment Utility
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 82

Expert Comment

by:leakim971
Comment Utility
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
Comment Utility
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
Comment Utility
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

Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Where to begin studying? 5 63
Javascript - output csv file 18 17
angularjs controller not found 1 16
What does this javascript do? 7 23
Introduction Chart.js, used properly, can visually add a difference to your charting applications. It engages your visitors and allows them to interact with data they otherwise wouldn't be able to without expensive and complicated systems. For this…
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.
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)

763 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

6 Experts available now in Live!

Get 1:1 Help Now