Radio Button, Meet JQuery and be dominated!

posted by Steve on

Let JQuery determine which radio button has been selected

Oh Man, I just want to know which radio button has been selected when I get to my javascript function so I do this in the form:

<form class="frm-full hint">
             <fieldset>
                     <label for="count" title="Count">Number of Users to Create</label><br/>
                     <input type="text" id="count"/><br/>

                     <div>
                             <ul id="selectOne" style="list-style:none">
                                     <li>
                                     <label for="mongoDB">mongoDB</label>
                                     <input type="radio" value="mongoDB" id="mongoDB" name="dbType" />
                                     </li>
                                     <li>
                                     <label for="couchDB">couchDB</label>
                                     <input type="radio" value="couchDB" id="couchDb" name="dbType" />
                                     </li>
                                     <li>
                                     <label for="markLogic">markLogic</label>
                                     <input type="radio" value="markLogic" id="markLogic" name="dbType" />
                                     </li>
                             </ul>
                     </div>
                     <div style="margin:20 20 20 0;">
                             <ul style="list-style:none">
                                     <li style="float:left">
                                             <input type="button" class="" value="createUsers"
                                                        onclick="users.createUsers($('#count'),$('input[name=dbType]:radio:checked'))"
                                                        id="createUsers"/><br/>

                                     </li>
                                     <li>
                                             <input type="button" class="" value="clearUsers"
                                                        onclick="users.clearUsers(this)"
                                                        id="clearUsers"/><br/>

                                     </li>
                             </ul>
                     </div>
             </fieldset>
     </form>

The delicious part is the selector in the javascript call. I'll repeat it here for your grey matter:

$('input[name=dbType]:radio:checked')

And then I do this in the Javascript

var users = {
       createUsers : function(count,dbName){
               alert(count.val()+' users created in'+dbName.val());
       }
};

And then I go home happy.

Leave a comment

blog comments powered by Disqus