Отображение сообщения возле TextBox с использованием Javascript

Question

У меня есть форма aspx, и в этом мне нужно делать проверки с помощью jquery или javascript.

Я просто хочу, чтобы дать сообщение рядом с текстовым полем, если пользователь вводит значение, которое не является действительным в том textbox.Inorder, чтобы отобразить сообщение во всплывающем окне [не оповещения («сообщение»)]

Как я могу найти позицию текстового поля, в котором пользователь вводит неверные данные, или как я могу отобразить сообщение рядом с текстовым полем с помощью javascript или jquery?

Мне нужно, чтобы проверка произошла в blur.So, пользователю легко узнать, ввел ли он действительные данные сразу после ввода ввода.

Спасибо заранее. Мне не интересно использовать asp.net ajax validation и его расширитель выноски.
Я просто хочу реализовать функциональность, похожую на расширитель выноски проверки.

Answer 1

Когда вы связываете событие размытия с текстовым полем, вы знаете, в каком текстовом поле оно есть. Просто используйте свой JavaScript-код обратного вызова, чтобы вставить ошибку рядом.

Если вы делаете JQuery, это может выглядеть примерно так:

$('.my_textboxes').blur(function() {

var textbox = $(this);

//ajax validation call 
$.post('/whereever', {}, function(response) { 
    //ajax callback 
    if (response == 'error') { 
     textbox.next().html(error); //something like this to insert the error into the next element after the texrbox, eg, a span to hold the error 
    } 
});` 

Answer 2

Вы можете использовать jQuery (ASP.NET) Validator Callout Plugin

Answer 3

Точно, как вы делаете это зависит от макет вашей формы, но в целом вы, вероятно, сделали бы что-то вроде этого: если проверка re выдает ошибку для текстового поля, проверьте, существует ли в этом поле «поле ошибок». Если это так, то просто обновите его содержимое новым сообщением об ошибке; если нет, то добавьте элемент ошибки.

Один из способов сделать это были бы использовать <span> тег с определенным классом (для целей компоновки), и значение «ID», сделанное из «имени» в поле ввода или «ID»:

$.fn.setValidationResult = function(errorMessage) { 
    return this.each(function() { 
    var errId = 'errMsg_' + this.name, errMsg = $('#' + errId); 
    if (!errMsg.length) { 
     $(this).after($('<span></span>', { class: 'validation-error', id: errId })); 
     errMsg = $('#' + errId); 
    } 
    if (errorMessage) 
     errMsg.html(errorMessage).show(); 
    else 
     errMsg.html('').hide(); 
    }); 
}); 

Тогда вы можете просто использовать $(yourInput).setValidationResult(whatever);, когда «все равно» будет пустым, когда пройдет проверка.

Answer 4

Вы можете использовать плагин проверки JQuery

• http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.js
• http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js
• http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.pack.js
• http://ajax.microsoft.com/ajax/jquery.validate/1.7/additional-methods.js

Какие есть варианты, чтобы указать сообщение рядом с контролем или указать все сообщение в одном месте.

Демонстрационные доступны на http://docs.jquery.com/Plugins/validation