Требуется плагин проверки, если установлен предыдущий флажок

0

Как найти предыдущий флажок для элемента, использующего jquery?

Я пишу настраиваемый плагин проверки "cb-required", который действует как "требуется", если и только если установлен предыдущий флажок. Идея - это флажок, за которым следует одно или несколько зависимых текстовых полей и/или выбирает. Я не заинтересован в том, чтобы скрывать или отключать зависимые поля в любом случае, я просто хочу принудительно выполнить "обязательный", если флажок установлен.

Прямо сейчас я просто пытаюсь получить предупреждение, чтобы всплывать правильно, а.prev() не делает трюк:

$.validator.addMethod("cb-required", function(value, element) {
    alert("current="+$(element).attr("name")+" / previous="+$(element).prev(":checkbox").attr("name"));
    return true;
}, "This information is required");

Поля формы выглядят примерно так:

<input name="EMVEnabled" type="checkbox" value="1" />EMV enabled<br />
<span style="font-size:0.8em">
    &nbsp;&nbsp;&nbsp;&nbsp;<strong>EMV Template</strong>
    <select name="EMVTemplate" size="1" class="cb-required">
        <option></option>
        <option value="1">Template 1</option>
        <option value="2">Template 2</option>
    </select><br />
</span>
<br />
<input name="CashAdvance" type="checkbox" value="1" />Cash advance<br />
<br />
<input name="ExpressPay" type="checkbox" value="1" />Express pay<br />
<span style="font-size:0.8em">
    &nbsp;&nbsp;&nbsp;&nbsp;<strong>Floor Limit Min</strong>
    <input name="ExpressPayFloorMin" type="text" value="" size="12" maxlength="12" class="cb-required numeric" /><br />
    &nbsp;&nbsp;&nbsp;&nbsp;<strong>Floor Limit Max</strong>
    <input name="ExpressPayFloorMax" type="text" value="" size="12" maxlength="12" class="cb-required numeric" /><br />
</span>
Теги:
validation
checkbox

2 ответа

0
Лучший ответ

Верьте или нет, ваш альтернативный метод заставил меня думать о другом способе решения проблемы. В html я обернул флажок и зависимости в атрибуте div с атрибутом class= "cb-group". то работает следующая настройка:

$.validator.addMethod("cb-required", function(value, element) {
    alert("current="+$(element).attr("name")+" / previous="+$(element).closest(".cb-group").find(":checkbox").attr("name"));
    return true;
}, "This information is required");

Теперь я могу продолжить и закончить с реальной логикой. Благодарю.

Поделиться
2

Используя ваш конкретный пример,.prev(": checkbox") не работает, потому что этот метод не перемещается вверх по дереву DOM - он будет смотреть только на прямых братьев и сестер. Вы хотите использовать.parent(). Prev (": checkbox") или parent.prevAll(": checkbox"), если есть вероятность, что другой элемент DOM будет находиться между флажком и зависимым родителем ввода.

Кроме того, вы можете захотеть взглянуть на указание в своем объявлении.validate({}) для правила "cb-required", точный флажок (по строке селектора jquery) для использования для проверки, вместо того, чтобы полагаться на структуру DOM. Это дало бы вам возможность разместить свой флажок в любом месте DOM относительно ввода (-ов), которые зависят от его проверенного состояния, например:

$form.validate({
    rules: {
        ExpressPayFloorMin: {
            "cb-required": "[name=ExpressPay]"
        }
    }
});

Используя этот метод, вам нужно добавить третий параметр "param" к вашей функции проверки, который будет селектором, указанным в.validate():

$.validator.addMethod("cb-required", function(value, element, param) {
    return $(param).prop("checked") && ($(element).val().length > 0);
}, "This information is required");
Поделиться
  • 0
    Я подумал, что это была моя проблема с использованием .prev (), я просто не мог придумать решение с использованием родителя. Я подумал об альтернативном методе, но я надеялся на более общее решение.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню