jQuery Validate - только два поля из четырех разрешено заполнять - как проверить? - PullRequest
Новая
       4

jQuery Validate - только два поля из четырех разрешено заполнять - как проверить?

0 голосов
/ 10 октября 2011

У меня есть четыре поля ввода: 

MaxWidth
MaxHeight

и 

Width
Height

Я хочу подтвердить, что были введены только MaxWidth + MaxHeight или Width + Height. Пользователь не должен иметь возможность отправлять значения для обоих наборов.

Есть идеи?

Обновление

Я использую jquery.validate.min.js, поставляемый с приложением по умолчанию .NET MVC3

Это то, что мне в основном нужно для проверки 

    <-- Scale a picture to one of the max attributes and keeping the aspect ratio --/>
    <input type="text" name="cmdMaxWidth" /><br />
    <input type="text" name="cmdMaxHeight" /><br />
    <br />
    <-- Scale a picture to the exact width and height attributes, still keeping the aspect ratio but addting whitespace for the rest --/>
    <input type="text" name="cmdWidth" /><br />
    <input type="text" name="cmdHeight" /><br />

Обновление

Я переписал свою форму, чтобы отразить настройки UI / UX, описанные Мохеном в командах его ответа.

НО я вознагражу Джаендру Патил "принятым" ответом, но я "пометю" ответы и предложения Мохена

С уважением \ T

Ответы [ 2 ]

1 голос
/ 10 октября 2011

Вы можете легко отключить другие входные данные, когда один из них получает значение.

Например, у вас есть эти два входа: 

 <input id="width" placeholder="width"/>
  <input id="maxwidth" placeholder="max width"/>

, и вы хотите запретить ввод максимальной ширины при вводе пользователемширина.Затем вы можете сделать это: 

$('#width').change(function(){
  if($(this).val() != ''){
    $('#maxwidth').attr('disabled', 'disabled');
  }
});

Вы можете сделать то же самое для ширины и максимальной ширины

Файл JsBin

0 голосов
/ 10 октября 2011

Вы также можете попробовать использовать проверку с зависимостью.
Добавьте метод, который проверит два других поля.
И сделайте требуемое зависимым от другого поля.

Демо - http://jsfiddle.net/b3RmV/

Пример для поля cmdMaxWidth (идентификаторы жестко закодированы, вы можете передать в качестве параметров) - 

jQuery.validator.addMethod("allowed", function(value, element) {
    return !($('#cmdWidth').val().length > 0 || $('#cmdHeight').val().length > 0)

}, "Not allowed");

$(document).ready(function(){
    $("#commentForm").validate(
        {   rules: {     
                cmdMaxWidth: {       
                    required:  function(element){
                      return $('#cmdMaxHeight').val().length > 0;
                    },
                    allowed: true
                }   
            }
        }
    );
});
...