4

In my web application a method returns a list of array contains ID's of select options which should have to be selected. Its is hard to make them all selected using DOM methods.

Is there any way to do it using jQuery.

Any suggestions would be more appreciative...

Thanks in Advance!!!

Improve this question
1
  • 3
    @treeface - it's pretty clear what he wants... Commented Aug 31, 2010 at 23:03

4 Answers 4

Reset to default
4

Using jQuery, you can just call attr("selected", true) on the collection of elements. All you have to do is get the selector right:

$('#opt1, #opt2, #opt3').attr("selected", true);

http://api.jquery.com/attr/

Improve this answer
Sign up to request clarification or add additional context in comments.

9 Comments

Actually selected doesn't take true/false, try it with "false" and it will still show as selected.
@Marko: If we were talking about attributes, you'd be correct. However, jQuery's attr() function checks the first parameter to see if it is a valid property name and sets that first. The selected property expects a boolean (true or false) and in this case "selected" would be an invalid value. jQuery does this to work around issues with setAttribute() in Internet Explorer.
@Marko - false does work :) Give it a try here: jsfiddle.net/nick_craver/Qxhbw
@Marko - I think your confusion comes from "false", the string "false" is true in JS, while the boolean keyword false is actually false, so you need to pass it without quotes.
Thanks @Nick Craver and @Andy E: I learn something new every day.. :) All i was trying to say is that the HTML attribute selected can be left without a value, i.e. <option selected> or <option selected="selected"> as per w3schools.com/TAGS/att_option_selected.asp If you add selected="false" it will still show as selected, see here jsfiddle.net/Qxhbw/1
|
2

EDIT: Based on your comment below, your data looks the code below.

There's a problem. It is not valid for an HTML ID attribute to start with a number. IDs must begin with a letter.

I'll show you the solution anyway, but you should fix the IDs.

var array = [{respID:1, respName:null}, 
             {respID:2, respName:null}, 
             {respID:3, respName:null}, 
             {respID:4, respName:null}, 
             {respID:5, respName:null} 
             ];

$.each(array, function(i,val) { 
     $('#' + val.respID).attr("selected", "selected"); 
});

Now this will give you the value of respID in each iteration of the loop.

But again, HTML IDs can not start with a number. I'd suggest updating your HTML ID attributes to something like id_5 instead of 5.

<select>
    <option id="id_1" value="some value">some text</option>
    <option id="id_2" value="some value">some text</option>
    <option id="id_3" value="some value">some text</option>
    ...
</select>

Then you would do this:

$.each(array, function(i,val) { 
     $('#id_' + val.respID).attr("selected", "selected"); 
});
Improve this answer

3 Comments

My List of array is like this {respID:1, respName:null}, {respID:2, respName:null}, {respID:3, respName:null}, {respID:4, respName:null}, {respID:5, respName:null} ] It is dynamically created in run time
I want to select them with the ID's
@MaRaVaN - OK, that's a little different. I'll update in a minute.
1

It's actually quite simple, all you need to do is add an attribute of selected to the elements you want.

$("#id1, #id2", "select").attr("selected", "selected");

You can filter them by value too

$("option[value=someText]", "select").attr("selected", "selected");
Improve this answer

2 Comments

Hey, thanks for your reply... Those multiple select select options are dynamically generated. The list of array comes like this... EmployeeManagement.getSelOptions(id, function(resp){// Jquery Code here...} The "resp" is the list array here.... How shall i use that single variable, i am have to iterate through any loop...???!!!! Thanks again
See @Patrick's and @Vadim's answer for looping through the id's
1

If ids is an array of IDs, the following code should work:

$.each(ids, function() { $("#" + this).attr("selected", true); });
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.