Kann ich diesen Jquery-Code überhaupt vereinfachen/optimieren?

Question

Ich habe einen Code geschrieben, der zwei Daten überprüft - sie sind in zwei Tageseingaben aufgeteilt (# enddate-1-dd, # date-1-dd), zwei Monate Eingaben (# enddate-1-mm, #date -1-mm) und 2-Jahres-Eingaben (# enddate-1, # date-1)

Ich wollte zuerst einmal überprüfen, dass es sich eigentlich um Nummern handelt, aber dann wollte ich das jeweils überprüfen es ist in einem Datumsformat, im Moment ist es so:

function validate_form() { 

retVal = true; // if the statements below fail, return true 

if(retVal == true) { 
    // check whether the available hours they've entered are a valid time! 
    $(":text").each(function() { 
     $this = $(this); // cache the object 
     if (isNaN($this.val())) { 
      $this.focus(); 
      $.jGrowl('Please enter a valid date!', { theme: 'smoke' }); 
      retVal = false; return false; 
     } 
    }); 
} 

if(retVal == true) { 
    $("#date-1-dd").each(function() { 
     $this = $(this); // cache the object 
     if ($this.val() > 31) { 
      $this.focus(); 
      $.jGrowl('Please enter a valid day, should be no more than 31!', { theme: 'smoke' }); 
      retVal = false; return false; 
     } 
    }); 
} 

if(retVal == true) { 
    $("#enddate-1-dd").each(function() { 
     $this = $(this); // cache the object 
     if ($this.val() > 31) { 
      $this.focus(); 
      $.jGrowl('Please enter a valid day, should be no more than 31!', { theme: 'smoke' }); 
      retVal = false; return false; 
     } 
    }); 
} 

if(retVal == true) { 
    $("#date-1-mm").each(function() { 
     $this = $(this); // cache the object 
     if ($this.val() > 12) { 
      $this.focus(); 
      $.jGrowl('Please enter a valid month, should be no more than 12!', { theme: 'smoke' }); 
      retVal = false; return false; 
     } 
    }); 
} 

if(retVal == true) { 
    $("#enddate-1-mm").each(function() { 
     $this = $(this); // cache the object 
     if ($this.val() > 12) { 
      $this.focus(); 
      $.jGrowl('Please enter a valid month, should be no more than 12!', { theme: 'smoke' }); 
      retVal = false; return false; 
     } 
    }); 
} 

if(retVal == true) { 
    $("#date-1").each(function() { 
     $this = $(this); // cache the object 
     if ($this.val() < 1900 || $this.val() > 3000) { 
      $this.focus(); 
      $.jGrowl('Please enter a valid year!', { theme: 'smoke' }); 
      retVal = false; return false; 
     } 
    }); 
} 

if(retVal == true) { 
    $("#enddate-1").each(function() { 
     $this = $(this); // cache the object 
     if ($this.val() < 1900 || $this.val() > 3000) { 
      $this.focus(); 
      $.jGrowl('Please enter a valid year!', { theme: 'smoke' }); 
      retVal = false; return false; 
     } 
    }); 
} 

return retVal; // return either true or false, depending on what happened up there!^

}

Sorry, wenn es scheint, als ob ich eine dumme Frage bin gefragt, wie mein Code in Ordnung arbeitet, ich denke nur, es ist Müllweg von es zu tun, mit vielen Wiederholungen, aber ich kann mir wirklich keinen Weg vorstellen, es effizienter zu machen?

Dank

Answer 1

function validate_form_checks() { 
    var error; 
    // check whether the available hours they've entered are a valid time! 
    $(':text').each(function() { 
     if(isNaN($(this).val())) { 
      $(this).focus(); 
      error = 'Please enter a valid date!'; 
      return false; 
     } 
    }); 
    if(error) 
     return error; 
    $('#date-1-dd, #enddate-1-dd').each(function() { 
     if($(this).val() > 31) { 
      $(this).focus(); 
      error = 'Please enter a valid day, should be no more than 31!'; 
      return false; 
     } 
    }); 
    if(error) 
     return error; 
    $('#date-1-mm, #enddate-1-mm').each(function() { 
     if($(this).val() > 12) { 
      $(this).focus(); 
      error = 'Please enter a valid month, should be no more than 12!'; 
      return false; 
     } 
    }); 
    if(error) 
     return error; 
    $('#date-1, #enddate-1').each(function() { 
     if($(this).val() < 1900 || $(this).val() > 3000) { 
      $(this).focus(); 
      error = 'Please enter a valid year!'; 
      return false; 
     } 
    }); 
    if(error) 
     return error; 
    return true; 
} 

function validate_form() { 
    var result = validate_form_checks(); 
    if(result === true) { 
     return true; 
    } else { 
     $.jGrowl(result, { theme: 'smoke' }); 
     return false; 
    } 
} 

Natürlich, Validierung, das Feedback auf alle die Fehler in einer Form statt nur die ersten bietet Art ist, weißte, besser.

Answer 2

Auf den ersten Blick eine Funktion von diesen identischen Abschnitten schaffen könnte und nur bei Bedarf aufrufen. You shouldn't repeat yourself.

Hier ist ein blog post über Validierungsdaten, die aufschlussreich sein können. Und hier ist eine SO-Antwort, die eine jQuery plugin answer Validierung gibt.

Answer 3

Ja, hier:

function validate_form() { 
return retVal = !0, retVal == 1 && $(":text") 
    .each(function() { 
    return $this = $(this), isNaN($this.val()) ? ($this.focus(), $.jGrowl("Please enter a valid date!", { 
     theme: "smoke" 
    }), retVal = !1, !1) : void 0 
}), retVal == 1 && $("#date-1-dd") 
    .each(function() { 
    return $this = $(this), $this.val() > 31 ? ($this.focus(), $.jGrowl("Please enter a valid day, should be no more than 31!", { 
     theme: "smoke" 
    }), retVal = !1, !1) : void 0 
}), retVal == 1 && $("#enddate-1-dd") 
    .each(function() { 
    return $this = $(this), $this.val() > 31 ? ($this.focus(), $.jGrowl("Please enter a valid day, should be no more than 31!", { 
     theme: "smoke" 
    }), retVal = !1, !1) : void 0 
}), retVal == 1 && $("#date-1-mm") 
    .each(function() { 
    return $this = $(this), $this.val() > 12 ? ($this.focus(), $.jGrowl("Please enter a valid month, should be no more than 12!", { 
     theme: "smoke" 
    }), retVal = !1, !1) : void 0 
}), retVal == 1 && $("#enddate-1-mm") 
    .each(function() { 
    return $this = $(this), $this.val() > 12 ? ($this.focus(), $.jGrowl("Please enter a valid month, should be no more than 12!", { 
     theme: "smoke" 
    }), retVal = !1, !1) : void 0 
}), retVal == 1 && $("#date-1") 
    .each(function() { 
    return $this = $(this), 1900 > $this.val() || $this.val() > 3e3 ? ($this.focus(), $.jGrowl("Please enter a valid year!", { 
     theme: "smoke" 
    }), retVal = !1, !1) : void 0 
}), retVal == 1 && $("#enddate-1") 
    .each(function() { 
    return $this = $(this), 1900 > $this.val() || $this.val() > 3e3 ? ($this.focus(), $.jGrowl("Please enter a valid year!", { 
     theme: "smoke" 
    }), retVal = !1, !1) : void 0 
}), retVal 
}