проверка формы javascript, перед отправкой справки?

Question

У меня есть следующая форма:

<select name="size">
    <option value="">Please Select</option>
    <option value="1">Medium</option>
    <option value="2">Large</option>
</select>
<select name="material">
    <option value="">Please Select</option>
    <option value="9">Wood</option>
    <option value="8">Metal</option>
</select>   
<input type="submit" value="submit">

Мне нужна помощь в создании некоторого javascript; при отправке вышеуказанной формы форма проверяется, что значения были выбраны, и успешно отправляется.Если значения не были выбраны, появляется всплывающее окно с предупреждением о том, что:

1. "Необходимо выбрать размер и выбрать материал", * Необходимо выбрать размер
2. "Размер", или
3. " Материал должен быть выбран "

Спасибо

Answer 1

Если вы уже используете jQuery, попробуйте плагин валидации (http://bassistance.de/jquery-plugins/jquery-plugin-validation/). Много гибкости, и он будет делать именно то, что вы хотите, с минимальным кодом.

Answer 2

С HTML 5 вам не понадобится проверка. Проверьте HTML и JavaScript: http://jsfiddle.net/christopherpl/AkJQn/1/

Answer 3

$("form").submit(function(){
    if ($("#size").val() == "" && $("#material").val() == "") { alert("Size and material  needs to be selected"); return false; }
    elseif ($("#size").val() == "") { alert("Size needs to be selected"); return false; }
    elseif ($("#material").val() == "") { alert("Material needs to be selected"); return false;}
    $(this).submit();
});