leveltwo Business Architects

If you’re anything like me, time is precious, and as the saying goes, time is also money for most of us. Developers are always looking for quick easy ways to get things done so they can move onto the next task. I’ve found that sometimes the best solutions are come from the least expected places. Using jQuery on a data-heavy site; that doesn’t call for AJAX? Sounds crazy right? Well, it isn’t all that crazy…

Table Sorting

Many times when you have a very dynamic website that has lots of information, you’ll have a page where you show that information in the form of a table. Say you’re building a website for your local bakery, and they have an online inventory of all their orders. They want to be able to sort that information with ease. Normally, you’d build lines upon lines of application code which would get information from the URL and build a MySQL query off of that, which could take quite a while. This is where jQuery can save the day. After pulling the library into your page, load in the jQuery Tablesorter plug-in found at the bottom. After formatting your table correctly, you can quickly sort your tables.

Assign your table an ID, and make your table. Make sure the contents of the table are inside a <tbody> tag, and the table header is defined with the table header tag(<th></th>).

Now reference the jQuery, and call the function.

<script type=”text/javascript”>
$(document).ready(function() {
$("#sortable_table").tablesorter();
} );
</script>

Now when you load the page, simply clicking on the table headers, sort the data without ever reloading the page!

Source: http://tablesorter.com/docs/

Form Validation

The other thing that developers often spend is creating complicated loops for making sure all of the form fields that are needed are properly filled in. However this can be time consuming and make for having to do a lot of extra programming that isn’t needed when you put jQuery to work.

To validate a form in jQuery is a quick and painless script. Using bassistance’s plug-in, you can quickly make your form validation. After loading in both jQuery and the plug-in, simply add the “required” class to your form fields, like so:

<input type=’text’ name=”name” class=”required”>

And then at the end of your form, call in the validation script…

<script>
$(document).ready(function(){
$("#your_form_id").validate();
});
</script>

And that’s it! After the user attempts to submit the form without filling in the name field, the script will jump back to where the field is and show an error. All without having to program in complicated PHP loops and without refreshing the page!

Source: http://bassistance.de/jquery-plugins/jquery-plugin-validation/