Twitter Bootstrap has some nice styling for error messages in forms. Using jQuery form validation could come handy and its actually pretty easy to integrate. The question is, how do we use the Bootstrap styling along with jQuery Validation plugin? Read on for more.
I was coding a long signup form, a very nice one, with the jQuery Validation Plugin, but it wasn’t working. I started to strip the code, piece by piece so I can identify what was causing the plugin to ignore the form and I came up with the most stupid error you will ever seen in your life (at least I think so).
Yes, a little dot that I don’t even know how to write with my keyboard. I even tried to replicate it and I couldn’t. 2 hours of coding wasted on this little bastard. Can you believe that?…
Once the DOM is structured by the browser, each element in our HTML page has an index relative to its parent. Retrieving an element’s index with jQuery is an easy task, and it is so useful that it can save you a couple of lines of code.
You have a select element, and you need to “select” one of its options based on one of its values. What you do is use the “selected-selector” of jQuery to do it in a single line.
Lets say I have the following select element and I need to dynamically select the option with a value of 3, which would be the “Peach”.
<select name="myselect" id="myselect"> <option value="1">Apple</option> <option value="2">Pear</option> <option value="3">Peach</option> <option value="4">Orange</option> </select>
$("#myselect option[value=3]").attr('selected', 'selected');
// Or just...
$("#myselect").val(3);
If you want to get a little bit more technical, make sure you read the official jQuery documentation regarding this subject.