2016-10-03 2 views
2

Я хочу включить кнопку отправки, когда выбраны FromDate и ToDate.включить кнопку отправки, когда выбраны FromDate и ToDate

В моем случае вся форма заполнена для включения кнопки отправки.

$('#myform > input').on('input', function() { 
 
    var empty = false; 
 
    $('form > input, form > select').each(function() { 
 
    if ($(this).val() == '') { 
 
     empty = true; 
 
    } 
 
    }); 
 

 
    if (empty) { 
 
    $('#register').attr('disabled', 'disabled'); 
 
    } else { 
 
    $('#register').removeAttr('disabled'); 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="myform"> 
 
    Name 
 
    <input type="text" id="" name="name" /> 
 
    <br/> 
 
    <br/>From Date 
 
    <input type="date" name="fdate" /> 
 
    <br/> 
 
    <br/>To Date 
 
    <input type="date" name="fdate" /> 
 
    <br/> 
 
    <br/> 
 

 
    <input type="submit" id="register" value="Register" disabled="disabled" /> 
 
</form>

Мое требование когда FromDate и ToDate подбираются чем кнопка отправки должна быть включить.

+0

Вы хотите проверить все входы или только входные данные даты? –

ответ

0

Try привязывать отправить событие:

$('#myform').on('submit', function() { 
    var empty = false; 
    $('form > input, form > select').each(function() { 
     if ($(this).val() == '') { 
      empty = true; 
     } 
    }); 
    if (empty) { 
     return false; 
    } 
}); 

и удалить инвалида атрибут:

<input type="submit" id="register" value="Register"/> 
+0

Это не совсем то, что он ожидает ... –

+0

Кнопка отправки отключена по умолчанию, я не верю, что она включит кнопку, когда входные данные будут заполнены. Пожалуйста, исправьте меня, если я ошибаюсь – Franco

+0

@SteevePitis это было также не нужно было проголосовать за его ответ. – Franco

1

$('#myform > input').on('input', function() { 
 
     var empty = false; 
 
     $('form > input[type=date], form > select').each(function() { 
 
      if ($(this).val() == '') { 
 
       empty = true; 
 
      } 
 
     }); 
 
     if (empty) { 
 
      $('#register').attr('disabled', 'disabled'); 
 
     } else { 
 
      $('#register').removeAttr('disabled'); 
 
     } 
 
    });
<form id="myform"> 
 
Name 
 
<input type="text" id="" name="name" /><br/><br/> 
 

 
From Date 
 
<input type="date" name="fdate1" /><br/><br/> 
 
To Date 
 
<input type="date" name="fdate2" /><br/><br/> 
 

 
<input type="submit" id="register" value="Register" disabled="disabled" /> 
 
</form> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>></script>

Это прекрасно работает;), код был хороший, но $("form > input") будет проверять каждую дату ввода И имя;)

+0

Это решение не работает, если конечный пользователь меняет ввод данных на пустой после заполнения .. Проверьте мой ответ –

1

Вы можете сделать кнопку disabled отправить каждый раз, когда вводимый пользователя или изменить поле даты:

var $formInputsDate = $('#myform > input[type="date"]'), 
 
    $submit = $('#register'); 
 

 
$formInputsDate.on('input change', function() { 
 
    var isEmpty = false; 
 
    $formInputsDate.each(function() { 
 
    $(this).val() === '' && (isEmpty = true); 
 
    }); 
 
    return isEmpty ? $submit.attr('disabled', 'disabled') : $submit.removeAttr('disabled'); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form id="myform"> 
 
    Name 
 
    <input type="text" id="" name="name"><br><br> 
 

 
    From Date 
 
    <input type="date" name="fdate1"><br><br> 
 

 
    To Date 
 
    <input type="date" name="fdate2"><br><br> 
 

 
    <input type="submit" id="register" value="Register" disabled="disabled"> 
 
</form>

Обратите внимание, что вы можете прикрепить обработчик события для всех входов в форме используя $('#myform > input').