If you want a quick validation of your form without using any validation plugin, this jQuery snippet could do the trick. This snippet will prevent form submit and change field border color to red, unless user corrects the invalid or empty fields.$(document).ready(function() { $("#my_form").submit(function(e) { //loop through each required field and simply change border color to red for invalid fields $("#my_form input[required=true], #my_form select[required=true], #my_form textarea[required=true]").each(function(){ var proceed = true; $(this).css('border-color',''); //reset border color if(!$.trim($(this).val())){ //if this field is empty $(this).css('border-color','red'); //change border color to red //alert("Field is empty"); proceed = false; //set do not proceed flag } //check invalid email var email_reg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; if($(this).attr("type")=="email" && !email_reg.test($.trim($(this).val()))){ $(this).css('border-color','red'); //change border color to red proceed = false; //set do not proceed flag } if(proceed){ //everything looks good return; //submit form } e.preventDefault(); }); }); });Usage Just set your form id to “my_form” and add required attribute to each input field you want to validate, as shown in example below.
Facebook Connect button alone can pretty much collect all the information we need from user. But sometimes we need to collect additional information during the registration, such as favorite Color, number of kittens, movie star name etc. To collect such information, we can use Facebook Registration Plugin. Instead of just showing Facebook Registration plugin, we will use Facebook Login button and call Registration plugin later. To make it even better I have used colorbox by Jack Moore.
Ajax file uploader is useful web tool, which is actually very easy to create with jQuery and PHP, and with new HTML5 FileReader API support, we can do client side file validation before even uploading the file to server. Today we are going to combine all these web features to make an Ajax based file uploader, which can be easily integrated into any HTML forms.
If you are looking for a simple script to navigate next / previous image without refreshing page, this example will do exactly that using jQuery Ajax and PHP.
