2012-08-31 2 views
1

Я не могу получить подтверждение моей формы ниже, чтобы ответить, если я не введу текст и вкладку в следующую. Нажатие на другое поле или нажатие submit ничего не делает, и я хочу, чтобы он отвечал во всех сценариях. Честно говоря, это первый раз, когда я использовал jquery для чего-то более сложного, чем включение или отключение классов, поэтому я, вероятно, делаю базовую ошибку где-то. Я не могу понять, что это такое.Невозможно запустить плагин проверки JQuery при нажатии

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script> 

<script type="text/javascript"> 
    //form validation 
    $(document).ready(function() { 
     $("#form").validate({ 
      rules: { 
       organization: { 
        required: true, 
        minlength: 2, 
        }, 
       firstname: { 
        required: true, 
        minlength: 2, 
        }, 
       lastname: { 
        required: true, 
        minlength: 2, 
        }, 
       email: { 
        required: true, 
        email: true, 
        }, 
       phone: { 
        required: true, 
        minlength: 10, 
        number: true, 
        }, 
      }, 
      messages: { 
       organization: "Please enter a valid organization name", 
       firstname: "Please enter your first name", 
       lastname: "Please enter your last name", 
       email: "Please enter a valid email address", 
       phone: "Please enter a valid phone number", 
      }, 
     });   
    }); 
</script> 
</head> 
<body> 
<div id="form_container"> 
    <div id="form_title">REQUEST INFO</div> 
    <form id="form" name="form_container" action="#"> 
     <!-- fields --> 
     <input id="organization" type="text" name="organization" minlength="2" /> 
     <input id="firstname" type="text" name="firstname" minlength="2" /> 
     <input id="lastname" type="text" name="lastname" minlength="2" /> 
     <input id="email" type="text" name="email" /> 
     <input id="phone" type="text" name="phone" /> 
     <!-- submit button --> 
     <input type="button" id="button" name="submit" type="submit" value="submit" > 
    </form> 
</div> 
</body> 
</html> 

ответ

0

У вас есть 2 типа атрибутов на кнопке отправить

<input type="button" id="button" name="submit" type="submit" value="submit" > 

изменить его к этому

<input id="button" name="submit" type="submit" value="submit" /> 

Это заставит кнопку отправить форму, и вызвать плагин валидации как вы ожидаете. Кроме того, ваш объект конфигурации проверки имеет несколько дополнительных запятых в нескольких местах (после последнего поля каждого подобъекта), которые могут отключить некоторые старые браузеры (в частности, IE).

+0

Ничего себе. Спасибо, что указали это! В моем центре внимания jquery я полностью забыл дважды проверить атрибуты html. Также спасибо за подсказку о запятых. –

+0

Без проблем, вы можете принять его в качестве ответа? :) – mdellanoce

+0

Готово. Извините ... первый раз на самом деле спрашивает о stackoverflow. –

0

Посмотрите на методы события jQuery .focusin() и .focusout(). Другая вещь, которую вы, возможно, захотите посмотреть, - это метод .submit(), если вы намереваетесь сделать больше проверки, когда посетитель нажимает кнопку «отправить», прежде чем выполнять подачу.

Сообщите мне, если вам нужны дополнительные рекомендации или дополнительные разъяснения/примеры. Удачи! :)

+0

Спасибо! Это указывает мне в правильном направлении для будущих взаимодействий. –

+0

Всегда рад помочь. Обновите его, если вы считаете, что это будет полезно для других :) –

Смежные вопросы