I have the following markup, and I want to make the All
radio button checked.
<ul> <li><input type="radio" value="All" name="Foo"/>All</li> <li><input type="radio" value="New" name="Foo"/>New</li> <li><input type="radio" value="Removed" name="Foo"/>Removed</li> <li><input type="radio" value="Updated" name="Foo"/>Updated</li> </ul>
I'd like to match via attribute, but I need to match on 2 attributes, @name='Foo'
and @value='All'
.
Something like this:
$("input[@name='Foo' @value='all']").attr('checked','checked');
Can someone show how this can be done?
With jQuery, it is easy to select elements with a given attribute value. For example: var elements = $('div[attr1="value1"]');
To select multiple elements of an html page using multiple elements selector, we pass the element names inside parenthesis, in double quotes, separated by commas. For example: $(“div, p, h2”) this will select all the div, p and h2 elements of a page.
You can specify any number of selectors to combine into a single result. This multiple expression combinator is an efficient way to select disparate elements. The order of the DOM elements in the returned jQuery object may not be identical, as they will be in document order.
The following HTML file shows how you can do this:
<html> <head> <script type="text/javascript" src="jquery-1.2.6.pack.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("a").click(function(event){ $("input[name='Foo'][value='All']").attr('checked','checked'); event.preventDefault(); }); }); </script> </head> <body> <ul> <li><input type="radio" value="All" name="Foo" />All</li> <li><input type="radio" value="New" name="Foo" />New</li> <li><input type="radio" value="Removed" name="Foo" />Removed</li> <li><input type="radio" value="Updated" name="Foo" />Updated</li> </ul> <a href="" >Click here</a> </body> </html>
When you click on the link, the desired radio button is selected. The important line is the one setting the checked
attribute.
I was beating my head against a wall similar to this and just want to point out that in jQuery 1.3 the syntax used in the accepted answer is the ONLY syntax that will work. The questioner uses the @ syntax for the expression which does not work at all in jQuery. Hopefully this helps the next guy to come across this question via Google =p
To be clear, you have to use
jQuery('input[name=field1][val=checked]')
and not
jQuery('input[@name=field1][@val=checked]')
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With