Перенос сообщений об ошибках

Тема в разделе "JavaScript", создана пользователем monah, 13 май 2015.

Модераторы: ZiX
  1. monah

    monah

    Регистр.:
    21 мар 2009
    Сообщения:
    165
    Симпатии:
    47
    Добрый день! Подскажите как перенести сообщения под в нужное место, точнее под input, а то умолчанию выводится в одном месте.
    HTML:
    <form id="login" action="http://index.php" method="post"><input type='hidden' name='CSRFName' value='' />
            <input type='hidden' name='CSRFToken' value=' />
                    <fieldset>
                      <input type="hidden" name="page" value="login" />
                      <input type="hidden" name="action" value="login_post" />
                      <label for="email">Электронная почта</label>
                      <input id="email" type="text" name="email" value="" />                  <div class="clear"></div>
                      <label for="password">Пароль</label>
                      <input id="password" type="password" name="password" value="" />                  <div class="clear"></div>
                      <div class="checkbox"><input id="remember" type="checkbox" name="remember" value="1" /> <label for="rememberMe">Запомнить меня</label></div>
                      <div class="clear"></div>
                      <button type="submit" id="blue">Вход</button>
                      <a href="http:///user/recover">Забыли пароль?</a>
                    </fieldset>
                  </form>
    
    HTML:
    <form name="register" id="register" action="<?php echo osc_base_url(true) ; ?>" method="post" >
              <input type="hidden" name="page" value="register" />
              <input type="hidden" name="action" value="register_post" />
              <fieldset>
                <div class= "placeholder" title="Введите ваше имя"> <label for="name" placeholder="dfdsf"><span><?php _e('Name', '') ; ?></span><span class="req">*</span></label> <?php UserForm::name_text(); ?></div>
                <div class= "" title="Введите свой почтовый ящик (e-mail). Пример petrov@mail.ru"><label for="email"><span><?php _e('E-mail', '') ; ?></span><span class="req">*</span></label> <?php UserForm::email_text() ; ?></div>
                <div class= "" title="Придумайте пароль для входа на сайт (не менее 5 знаков или символов)"> <label for="password"><span><?php _e('Password', '') ; ?></span><span class="req">*</span></label> <?php UserForm::password_text(); ?></div>
               <div class= "" title="Повторите свой пароль"> <label for="password"><span><?php _e('Re-type password', '') ; ?></span><span class="req">*</span></label> <?php UserForm::check_password_text(); ?></div>
                <p id="password-error" style="display:none;">
                  <?php _e('Passwords don\'t match', '') ; ?>.
                </p>
                <div class= "" title="Укажите Вашу область"><label for="region"><span><?php _e('Region', '') ; ?></span><span class="req">*</span></label><?php UserForm::region_select(osc_get_regions()) ; ?></div>
                <div class= "" title="Укажите Ваш город"><label for="city"><span><?php _e('City', '') ; ?></span><span class="req">*</span></label><?php UserForm::city_select(osc_get_cities(), osc_user()); ?></div>
                   <div class= "" title="Укажите Ваш номер телефона"><label for="phoneMobile"><span><?php _e('Телефон', '') ; ?></span><span class="req"></span></label><?php UserForm::mobile_text() ; ?></div>
    
     
               <?php UserForm::js_validation() ; ?>
                <?php osc_run_hook('user_register_form') ; ?>
                <script type="text/javascript">var RecaptchaOptions = {theme : 'white'};</script>
                <?php osc_show_recaptcha('register'); ?><br />
               
              
                <button type="submit" id="green"><?php _e('Create account', '') ; ?></button></form>
              </fieldset>
              </form>
    
    Код:
    <script type="text/javascript">
        $(document).ready(function(){
            // Code for form validation
            $("form[name=register]").validate({
                rules: {
                    s_name: {
                        required: true
                    },
                    s_email: {
                        required: true,
                        email: true
                    },
                    s_password: {
                        required: true,
                        minlength: 5
                    },
                    s_password2: {
                        required: true,
                        minlength: 5,
                        equalTo: "#s_password"
                    }
                },
                messages: {
                    s_name: {
                        required: "<?php _e("Name: this field is required"); ?>."
                    },
                    s_email: {
                        required: "<?php _e("Email: this field is required"); ?>.",
                        email: "<?php _e("Invalid email address"); ?>."
                    },
                    s_password: {
                        required: "<?php _e("Password: this field is required"); ?>.",
                        minlength: "<?php _e("Password: enter at least 5 characters"); ?>."
                    },
                    s_password2: {
                        required: "<?php _e("Second password: this field is required"); ?>.",
                        minlength: "<?php _e("Second password: enter at least 5 characters"); ?>.",
                        equalTo: "<?php _e("Passwords don't match"); ?>."
                    }
                },
                errorPlacement: function(error, element) {
                var er = element.attr("name");
                error.appendTo( element.parent().find("label[@for='" + er + "']").find("em") ),
                   
                submitHandler: function(form){
                    $('button[type=submit], input[type=submit]').attr('disabled', 'disabled');
                    form.submit();
                }
            });
        });
    </script>
    
     
  2. DevOrc

    DevOrc Создатель

    Регистр.:
    5 июн 2014
    Сообщения:
    31
    Симпатии:
    10
    Приветствую, что-то у Вас как-то сложно все, почему не воспользоваться HTML5 валидацией, к тому же все современные браузеры ее поддерживают
    Неплохой пример: http://www.sitepoint.com/html5-form-validation/
    Хочется кастома, это тоже есть: http://www.html5rocks.com/en/tutorials/forms/constraintvalidation/?redirect_from_locale=ru
    Надо плагином под CSS фреймворки, тоже есть: http://formvalidation.io/
     
  3. zardoz

    zardoz Постоялец

    Регистр.:
    6 май 2008
    Сообщения:
    84
    Симпатии:
    60
    Такие вещи делаются с помощью css стилей
     
  4. proskurnin

    proskurnin Создатель

    Регистр.:
    31 июл 2008
    Сообщения:
    23
    Симпатии:
    0
    Ребята, у кого есть скачать как раз вот этот CSS фреймворк - http://formvalidation.io/ ???
    На официальном сайте просят сумасшедшие деньги!