Проверка пользовательских правил JQuery с зависимостями и параметрами

Question

Итак, у меня есть раскрывающийся список html с 4 значениями A, B, C и D. И 4 предварительно заполненных текстовых поля (P1, P2, P3, P4) с некоторыми текстами в них и 4 пустых текстовых поля (B1, B2, B3 и B4).

Я хочу, чтобы проверки применялись на основе того, какое значение выбрано в раскрывающемся списке.

Если выпадающее значение является A, я хочу только проверить, что это значение в пустое текстовое поле B1 не равно значению в предварительно заполненном текстовом поле P1 и B1, также не может быть пустым.

То же самое для выпадающего значения коробки с B -> P2.val! = B2.val и B2 не должно быть пустым. и то же самое относится и к другим.

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

И для предполагаемого результата для приведенного ниже фрагмента кода, когда dropdownbox имеет значение A в нем, он должен только после этого продолжить проверку того, что значение в двух текстовых полях одинаково, то есть в P1 и B1. !!

HTML

<form> 
    <select class="inlineEdit" name="Dropdownbox" id="Dropdownbox"> 
    <option value="A"> 
     A 
    </option><option value="B"> 
     B 
    </option><option value="C"> 
     C 
    </option><option value="D"> 
     D 
    </option> 
</select> 
    <br/><br/> 
    <input type="text" name="P1" value="Old Value" /> 
    <br/><br/> 
    <input type="text" name="B1" /> 
    <button type="submit">Test</button> 
</form>​​​​​​​​​​​ 

JQuery

jQuery.validator.addMethod("change", function(value, element, param) { 
alert(param + " " + value); 
    return this.optional(element) || value != param; 
}, jQuery.format("You must enter {0}")); 


$("form").validate({ 
    rules: { 
     B1: { 
      required: function(element) { 
       return $("#Dropdownbox").val() == "A"; 
      }, 
      change: { 
       param: $("#P1").val(), 
       depends: function(element) { 
        return $("#Dropdownbox").val() == "A"; 
       } 
      } 
     } 
    }, 

    debug: true 
});​ 

........

Можно попробовать запустить приведенный выше код здесь: http://jsfiddle.net/

Проблема: $ ("# P1"). Val отправляет true, а не фактическое значение в param, поэтому он не работает. Если я жестко кодирую значения в параметре, код работает нормально. любые решения ???

Спасибо,

Answer 1

Несколько мыслей:

Это может быть, что вы пропустили знак # перед P1. Если вы пытаетесь идентифицировать P1 как имя, для этого требуется $('[name="P1"]'). Для ловли таких тиков это помогло бы, если бы вы могли включить фактический код, вместо того, чтобы помещать строки по умолчанию. Аналогично, похоже, что вы идентифицируете B1 по имени. Если это будет id или класс или что-то еще, это будет вашей проблемой. По таким причинам, также может быть полезно иметь образец кода, содержащий соответствующий HTML.

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

Не так много, как предложение, учитывая, что у вас есть семантические проблемы, я предпочитаю хранить всю логику в вызове jQuery.Validator.addMethod, поскольку это помогает сохранить семантику немного проще, и все это в одном месте. Я не вижу ничего плохого в своей семантике.

Редактировать: yep. Как я думал. Вы используете $("#P1"). Это даст вам узел с идентификатором «P1». Чтобы использовать JQuery для получения по имени, вам необходимо использовать $('[name="P1"]'). В качестве альтернативы вы можете настроить свой HTML так, чтобы соответствующий тег имел идентификатор, соответствующий его имени (как вы это делали с Dropdownbox).