Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Jun 21st, 2012  |  syntax: None  |  size: 3.71 KB  |  hits: 9  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. Javascript / jQuery form validation
  2. function new_receiver(){
  3.  
  4.  
  5. if (document.getElementById("RecieversName").value ==""){ //First Name
  6.  
  7.         var txt=document.getElementById("error_receiver");
  8.         txt.innerHTML="<p><font color="#FF0000">You need to enter a Name!</font></p>";    
  9.         window.document.getElementById("RecieversName_label").style.color = '#FF0000';
  10.  
  11.         //Reset
  12.         window.document.getElementById("receiver_check_label").style.color = '#000000';
  13.         window.document.getElementById("RecieversNumber_label").style.color = '#000000';
  14.         window.document.getElementById("RecieversEmail_label").style.color = '#000000';
  15.  
  16. }else if (document.getElementById("RecieversNumber").value ==""){ //First Name
  17.  
  18.         var txt=document.getElementById("error_receiver");
  19.         txt.innerHTML="<p><font color="#FF0000">You need to enter a Phone Number!</font></p>";    
  20.         window.document.getElementById("RecieversNumber_label").style.color = '#FF0000';
  21.  
  22.         //Reset
  23.         window.document.getElementById("receiver_check_label").style.color = '#000000';
  24.         window.document.getElementById("RecieversName_label").style.color = '#000000';
  25.         window.document.getElementById("RecieversEmail_label").style.color = '#000000'
  26.  
  27. }else if (document.getElementById("RecieversNumber").value ==""){ //First Name
  28.  
  29.         var txt=document.getElementById("error_receiver");
  30.         txt.innerHTML="<p><font color="#FF0000">You need to enter an Email!</font></p>";  
  31.         window.document.getElementById("RecieversEmail_label").style.color = '#FF0000';
  32.  
  33.         //Reset
  34.         window.document.getElementById("receiver_check_label").style.color = '#000000';
  35.         window.document.getElementById("RecieversName_label").style.color = '#000000';
  36.         window.document.getElementById("RecieversNumber_label").style.color = '#000000';
  37.  
  38.  
  39. }else{
  40. from.receiver.submit();
  41.        
  42. function new_receiver() {
  43.     var inputs = [
  44.         {
  45.             id: "RecieversName",
  46.             name: "a Name"
  47.         },
  48.         {
  49.             id: "RecieversNumber",
  50.             name: "a Phone Number"
  51.         }
  52.         // add more here
  53.     ],
  54.     length = inputs.length,
  55.     error = document.getElementById("error_receiver"),
  56.     hasError = false,
  57.     i;
  58.  
  59.     // reset
  60.     for (i = 0; i < length; i++) {
  61.         document.getElementById(inputs[i].id + "_label").style.color = "#000000";
  62.     }
  63.     error.innerHTML = "";
  64.  
  65.     for (i = 0; i < length; i++) {
  66.         if (document.getElementById(inputs[i].id).value == "") {
  67.             error.innerHTML = "<p><font color="#FF0000">You need to enter " + inputs[i].name + "!</font></p>";    
  68.             document.getElementById(inputs[i].id + "_label").style.color = "#FF0000";
  69.             hasError = true;
  70.             break;
  71.         }
  72.     }
  73.  
  74.     if (!hasError) {
  75.         from.receiver.submit();
  76.     }
  77. }
  78.        
  79. $('input').blur(function() {
  80.      if($(this).val()==""){
  81.             $("#error_receiver").html("<p><font color="#FF0000">This field is required!");
  82.             $("label[for=' + this.attr("id") + ']").css('color', '#FF0000');
  83.          }
  84.   });
  85.        
  86. <form onsubmit="return new_receiver()">
  87. .
  88. .
  89.  
  90. var formFields = {
  91.   "RecieversName": "You need to enter a Name!",
  92.   "RecieversNumber":"You need to enter a Number!",
  93.   "RecieversEmail":"You need to enter an Email!"  
  94. }
  95. function new_receiver(){
  96.   var txt=document.getElementById("error_receiver");
  97.   //Reset
  98.   txt.innerHTML="";
  99.   for (var o in formFields) document.getElementById(o+"_label").style.color = '#000000';
  100.  
  101.   for (var o in formFields) {
  102.     if (document.getElementById(o).value ==""){
  103.       txt.innerHTML="<p><font color="#FF0000">"+formFields[o]+"</font></p>";    
  104.       window.document.getElementById(o+"_label").style.color = '#FF0000';
  105.       return false;
  106.     }
  107.   }
  108.   return true
  109. }