Задача: Валидация, динамическая проверка заполнения html форм
Исходник: Версия с указанием незаполненных полей. В стиле "джин-в-бутылке", язык: javascript [code #606, hits: 12568]
аноним: Innuil [добавлен: 10.02.2010]
  1. function CheckFields(form)
  2. {
  3. var EmptyFieldsForUser = new Array();
  4. var FormFields = form.elements;
  5. for (var i = 0; i < FormFields.length; i++) {
  6. if (FormFields[i].id.indexOf('Check') > -1 && FormFields[i].value == "")
  7. {
  8. EmptyFieldsForUser.push(FormFields[i].id.substr(5));
  9. }
  10. }
  11. if(EmptyFieldsForUser.length==0)
  12. {
  13. return true;
  14. }else
  15. {
  16. var EmptyMessageContainer = document.getElementById('EmptyMessage');
  17. if(EmptyMessageContainer)
  18. {
  19. EmptyMessageContainer.innerText = 'Вы не заполнили поля: ';
  20. for (var i = 0; i < EmptyFieldsForUser.length; i++) {
  21. EmptyMessageContainer.innerText = EmptyMessageContainer.innerText + EmptyFieldsForUser[i] + '; ';
  22. }
  23. EmptyMessageContainer.innerText = EmptyMessageContainer.innerText.substr(0, EmptyMessageContainer.innerText.length -2) + '.';
  24. }
  25. return false;
  26. }
  27. }
  28.  
  29.  
  30. <form action="SendOrder" method="post" enctype="multipart/form-data" name="OrderFields" lang="ru" onsubmit="return CheckFields(this);">
  31. <table>
  32. <tr>
  33. <td colspan="3"><div id="EmptyMessage"></div></td>
  34. </tr>
  35. <tr align="left">
  36. <td><input name="NameCustomer" type="text" id="CheckИмя" /></td> <td><b>Имя</b></td> <td width="25px" rowspan="6" class="TextTopCenter"><b>Жирным выделены обязательные поля.</b></td>
  37.  
  38. </tr>
  39. <tr align="left">
  40. <td><input name="SurNameCustomer" type="text" id="CheckФамилия" /></td> <td>Фамилия</td>
  41.  
  42. </tr>
  43. <tr align="left">
  44. <td><input name="FatherNameCustomer" type="text" /> </td><td>Отчество</td>
  45. </tr>
  46. <tr align="left">
  47. <td><input name="TelephoneCustomer" type="text" /></td> <td>Контактный телефон</td>
  48. </tr>
  49. <tr align="left">
  50. <td>
  51. <input name="EmailCustomer" type="text" id="CheckE-mail" /></td><td> <b>E-mail</b></td>
  52. </tr>
  53. <tr>
  54. <td colspan="2">
  55. <b>Сообщение</b>
  56. <textarea name="OrderText" class="TextAreaForOrder" id="CheckСообщение"></textarea>
  57. </td>
  58. </tr>
  59. <tr>
  60. <td colspan="2">
  61. <input name="submit" type="submit" />
  62. </td>
  63. </tr>
  64. </table>
  65. </form>

+добавить реализацию