Подтвердить сообщение об ошибке в правильной области

Я использую проверку JQuery для сообщений об ошибках и не могу заставить их отображаться в нужном месте. В настоящее время они по умолчанию отображаются после элемента поля ввода. Я хотел бы, чтобы элемент отображался между меткой и полем ввода.Подтвердить сообщение об ошибке в правильной области

Текущий

<p> 
    <label>Outside Comms:</label><br>  
    <textarea cols="30" rows="5" name="outsideComms"></textarea> 
    <div class="error">This is the error message</div> 
</p>

Ideal

<p> 
    <label>Outside Comms:</label><br> 
    <div class="error">This is the error message</div>  
    <textarea cols="30" rows="5" name="outsideComms"></textarea> 
</p>

В errorPlacement у меня ниже, но это не работает. Все, что я делаю, либо помещает его перед меткой, либо после поля ввода, но не между ними. Как я могу сказать, чтобы положить его после первого родителя родителя?

error.prependTo(element.before);

Любая помощь будет очень признательна.

Благодаря

источник

2015-01-16 KishVaja

И какой из элементов является 'элементом' в вашем коде? – adeneo

Извините, должно быть, было яснее. Проверка JQuery создает этот контейнер div с сообщением об ошибке. Элемент, который, я считаю, является полем ввода, поскольку это то, что он проверяет. Это то, что я продолжал. – KishVaja

@adeneo Документация находится здесь http://jqueryvalidation.org/validate#options, которая подтверждает, что «элемент» на самом деле является полем – KishVaja

-1

Слышит, как я это делаю:

jQuery("#formID").validate({ 

    rules: { 
     grossSalary: { required: true, digits: true, max: 9999999} 
    }, 
    messages: { 
     grossSalary: { required: "Please enter a value", digits: "Please enter a whole number", max: "Please enter a maxiumum amount of &pound;9,999,999"} 
    }, 
    errorPlacement : function(error, element) { 
     element.next('.vError').remove(); 
     element.after('<div class="vError"><span class="arrow"></span>' 
       + error.html() + '</div>'); 
    }, 
    success: function(error, element) { 
     jQuery(element).next().remove(); 
    } 
});

Это ставит ошибку после входе. Так что я сделал небольшое исследование и придумал следующее:

jQuery("#itcForm").validate({ 

    rules: { 
     grossSalary: { required: true, digits: true, max: 9999999} 
    }, 
    messages: { 
     grossSalary: { required: "Please enter a value", digits: "Please enter a whole number", max: "Please enter a maxiumum amount of &pound;9,999,999"} 
    }, 
    errorPlacement : function(error, element) { 
     element.prev('.vError').remove(); 
     element.before('<div class="vError"><span class="arrow"></span>' 
       + error.html() + '</div>'); 
    }, 
    success: function(error, element) { 
     jQuery(element).prev().remove(); 
    } 
});

В основном своп «после» с «до» и (в случае необходимости) «рядом» с «пред» ... Это помещает сообщение об ошибке до входной элемент.

В качестве сноски я добавляю стиль «position: relative» к содержащему div и «position: absolute» в .vError. Таким образом, не имеет значения, где появляется ошибка, вы можете расположить его относительно содержимого контейнеров ...

источник

2015-01-16 15:42:35

Я не могу поверить, что мне так долго нужно было это сделать ... После примерно 50 загрузок ниже работал на меня.

error.insertBefore(element);

источник

2015-01-16 16:02:02 KishVaja

Подтвердить сообщение об ошибке в правильной области

ответ

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