Проверка формы jQuery - добавление новых ключевых слов на основе значения меню «Выбрать»

Question

Проверка формы jQuery - добавление новых ключевых слов на основе значения меню «Выбрать»

0

У меня простая форма с несколькими полями выбора и несколькими полями ввода. Я хочу выполнить проверку jQuery только для этих трех полей внутри формы:

<form action="action/buy.php" method="post" class="form-horizontal" id="boosterForm">
<select name="Quantity" id="selectQuantity" tabindex="1" class="span2">
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
        <option value="10">10</option>
        <option value="11">11</option>
        <option value="12">12</option>
        <option value="13">13</option>
        ..................
        <option value="99">99</option>
</select>

<input class="span11" id="wizard_url" type="text" name="Website" placeholder="http://www.example.com">

<input class="span11" type="text" name="Keywords">

<button class="btn btn-large btn-warning" type="submit" name="campaignSubmit" value="Buy Now" >Buy Now</button>

</form>

То, что я хочу сделать, это разрешить/заблокировать пользователя, когда он выбирает из меню выбора "Количество" следующих значений 3, 6, 9, 12, 15, 18, 21, 24, 27, 30, 33, 36, 39, 42, 45.... 99 для ввода 1 нового ключевого слова, разделенного комой на каждые три количества.

Например, если он выбрал № 3 из раскрывающегося меню "Количество", ему не разрешено добавлять какие-либо запятые (,) в поле "Ключевые слова", если он выбирает между # 4- # 6, ему разрешено вводить только одну запятую, если он выберет # 7- # 9, ему будет разрешено вводить только две запятые и вплоть до № 99, когда ему разрешено вводить запятые.

Если они вводят больше запятых, тогда разрешено я хочу показать простое предупреждение под полем, позволяя им знать, что они не могут добавить больше ключевых слов, например "Максимальное количество добавленных ключевых слов". Также я не хочу позволять им отправлять форму до тех пор, пока они не исполнит это.

И последнее, они также не могут отправить форму, если поле "Веб-сайт" пуст.

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

Любая помощь очень ценится. Большое спасибо.

DigitalWhirl LLC 21 сен. 2013, в 18:36

Источник

Теги:

javascript

jquery

forms

1 ответ

Ещё вопросы

The Alpha · Accepted Answer · 2013-09-21T16-34-00.000Z

Вы можете попробовать это (он работает как 4-6= 1 запятая, разрешено 7-9= 2 запятых, разрешено 10-12= 3 запятых и т.д., И website не может быть оставлен пустым)

$(function(){
    $('#selectQuantity').on('change', function(){
        var val = $(this).val();
        if(val > 3) {
            var div = val / 3, mod = val % 3;
            if(mod == 0) {
                var commas = div-1;
            }
            else {
                var commas = parseInt(div);
            }
            $('input[name="Keywords"]').attr('data-commas', commas);
        }
    });

    $('[name="campaignSubmit"]').closest('form').on('submit', function(e){
        var el = $('input[name="Keywords"]');
        val = el.val(), commas = (val.split(',').length -1), msg = '';
        if(commas) {
            if(!el.attr('data-commas')) { 
                msg = "You can't put any commas in 'Keywords' field !";
            }
            else {
                if( el.attr('data-commas') && commas > el.attr('data-commas')) {
                    msg = "You can't put more than " + el.attr('data-commas') + " comma(s) in 'Keywords' field!";
                }
            }
        }
        if($('input[name="Website"]').val() == '') {
            msg += "\nWebsite can't be left blank !";
        }
        if(msg) {
            e.preventDefault();
            alert(msg);
        }
    });
});

DEMO.

Еще один отличный ответ от вас. Работает по мере необходимости. Большое спасибо!