Как проверить кредитные карты с помощью jquery.validation creditcard2?

Question

Я надеялся, что кто-то может указать мне правильное направление.Я хочу использовать этот плагин вместе с плагином jquery.validation в моих формах, но из того, что я вижу, мне нужно было бы использовать тег выбора для правильной работы creditcard2.

ЧтоВ настоящее время у меня есть это:

 <p class="ccType">
     <label for="card_type" class="error">You must select a credit card from one of the following.</label>
        <br>
     <input type="radio" value="1000" id="card_type_1000" name="card_type" style="outline:none; border:none;" /> 
        <img src="../visa.png" alt="Visa" width="50" height="30" align="top" /> 
        <input type="radio" value="1002" id="card_type_1002" name="card_type" style="outline:none; border:none;" /> 
        <img src="../mastercard.png" alt="Mastercard" width="50" height="30" align="top" /> 
        <input type="radio" value="1006" id="card_type_1006" name="card_type" style="outline:none; border:none;" /> 
        <img src="../discover.png" alt="Discover" width="50" height="30" align="top" /> 
        <input type="radio" value="1004" id="card_type_1004" name="card_type" style="outline:none; border:none;" /> 
        <img src="../amex.png" alt="American Express" width="50" height="30" align="top" />
    </p>

значение = 1000 это "Visa"

значение = 1002 это "MasterCard"

значение = 1006 это "Откройте"

value = 1004 - это "AmEx"

На сайте плагина упоминается создание поискового хэша.Я не знаю, как его создать.Также в документации, представленной на сайте, приведены только примеры с использованием <select></select>.Я использую входные данные.

Как мне заставить это работать с настройкой, которая у меня есть в настоящее время.

какие-либо предложения?

Answer 1

Хеш поиска будет выглядеть как

var hash = {
    1000: "Visa",
    1002: "MasterCard",
    1004: "AmEx",
    1006: "Discover"
};

Тогда вы можете использовать следующую функцию проверки, конечно, встроенную в вашу текущую настройку:

$("#myform").validate({
    rules: {
        cardnum: { // this should be the id of the card number field
            creditcard2: function(){ return hash[$('.ccType > input:checked').val()]; }
        }
    }       
});

Этот довольно лаконичный код сначала ищет все inputs в вашем .ccType элементе. Затем он выбирает тот, который проверен (если есть), и получает его значение. Затем значение пропускается через хеш, чтобы изменить его на значение, которое нравится плагину. И ... будем надеяться, что это сработает.