Как отключить кнопку отправки формы, пока поля не будут заполнены jQuery Mobile? - PullRequest
1 голос
/ 06 ноября 2011

Я искал решение отключить кнопку отправки формы, пока не будут заполнены обязательные поля.Я нашел кое-что здесь в stackoverflow (любезно предоставлено mblase75 ), но это для стандартного jQuery и не работает с jQuery Mobile.

Причина этого в том, что на мобильной странице есть форма, которая требует заполнения всех полей перед отправкой.Валидация решается с помощью php, поэтому это не обязательная часть.

$(document).ready(function() {
    $form = $('#formid'); // cache
    $form.find(':input[type="submit"]').prop('disabled', true); // disable submit btn
    $form.find(':input').change(function() { // monitor all inputs for changes
         var disable = false;
         $form.find(':input').not('[type="submit"]').each(function(i, el) { // test all inputs for values
            if ($.trim(el.value) === '') {
                    disable = true; // disable submit if any of them are still blank
            }
         });
         $form.find(':input[type="submit"]').prop('disabled',disable);
        });
    });

К сожалению, я не гуру jQuery, и, если возможно, мне нужна помощь с этим.Также приветствуются любые другие предложения (даже для проверки с помощью мобильного телефона jQuery).

Ответы [ 2 ]

1 голос
/ 11 апреля 2012
$(function() {
    var form = $('#formid');
    var submitBtn = $('#submitBtnId');

    submitBtn.addClass('disable');

    form.submit(function()

        if(validate()) {
            submitBtn.removeClass('disable');
        }

        if(submitBtn.hasClass('disable')) {
            return false;
        }

        else {
            return true;
        }

    });

    function validate() {
        form.find('input, textarea').change(function(){
            // validation goes here if all inputs are validate then return true otherwise false
        });
    }
});
0 голосов
/ 12 ноября 2011

На самом деле вы можете проверять значения других «кнопок», таких как input [type = "button"] или input [type = "reset"].Они имеют пустое значение, если они не установлены.Это объясняется следующим кодом (плюс еще несколько операторов кэширования):

$(document).ready(function() {
    var $form = $('#formid'), // cache
        $inputs = $form.find(':input'), // MOD extra caching
        $buttons = $inputs.not(':submit, :reset, :button'),
        $fields = $inputs.not($buttons),
        $submits = $buttons.filter(':submit');

    $submits.prop('disabled', true); // disable submit btn
    $fields.keyup(function() { // monitor all inputs for changes, MOD changed to keyup
         var disable = false;
         $fields.each(function(i, el) { // test all inputs for values
            if ($(el).val() === '') { // MOD use jQuery to get value
                    disable = true; // disable submit if any of them are still blank
                    return false; // MOD stop "each" if even one field is blank... less waste
            }
         });
         $submits.prop('disabled',disable);
        });
});

Однако это не будет учитывать группу переключателей, ни одна из которых не была отмечена.

...