Как включить кнопку, когда все текстовое поле имеет значение в JQuery?

Question

Я новичок в программировании. Здесь я дал описание моей проблемы У меня есть одна пара из двух текстовых полей. одно текстовое поле предназначено для URL, а другое - для инструкции, но все текстовые поля создаются динамически в зависимости от значения, получаемого из базы данных.

например, $ testing_type_id = 2, поэтому я получаю всего две пары текстовых полей, пусть это называется bundle. $ I используется для уникального определения текстового поля.

  <input type = "text"  size="33"   class="uploadtxt1 url" name="txturl_<?php echo $testing_type_id ; ?>" id = "txturl_<?php echo $testing_type_id; ?>_<?php echo $i ; ?>" value="" />
             <input type = "text"  class="uploadtxt2" size="33" name="txtinstruction_<?php echo $testing_type_id ; ?>" id = "txtinstruction_<?php echo $testing_type_id; ?>_<?php echo $i ; ?>" value=""  /> <br/>
             <input type="submit" name="checkout" id="checkout"   class="graybtn1 ptr  button_float_left_checkout" disabled="disabled" value="Proceed To Checkout" />

вот что я хотел сделать, если все пакеты имеют значение, либо в одном текстовом поле, либо в обоих текстовых полях, чтобы включить функцию отправки кнопки. Если я удалил значение, отключите кнопку отправки с помощью jquery.

нужна срочная помощь. Заранее спасибо.

Answer 1

Я думаю, что это будет работать

$(document).ready(function(){
    $("input[class^='uploadtxt']").keyup(function(e){
        var alltxt=$("input[class^='uploadtxt']").length;
        var empty=true;
        $("input[class^='uploadtxt']").each(function(i){
            if($(this).val()=='')
            {
                empty=true;
                $('#checkout').prop('disabled', true);
                return false;
            }
            else
            {
                empty=false;
            }
        });
        if(!empty)  $('#checkout').prop('disabled', false);                    
    });
});​

Например, здесь .

Answer 2

Итак, если вы хотите показать / включить кнопку, если текстовые области / входы имеют значения.Вы можете сделать что-то подобное, используя jQuery.

$(window).ready(function(){

   if( $('input, textarea').val().length >=0 ){

     //run function to enable button

   }

   else if ( $('input, textarea').val().length <=0 ){

      //run function to disable button

   }

});

Я думаю, это то, что вы ищете.Дайте мне знать, если я далеко или неправильно вас понимаю.

Answer 3

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

Оберните элементы в <div>

<div class="item">
    <input type = "text"  size="33"   class="uploadtxt1 url" name="txturl_<?php echo $testing_type_id ; ?>" id = "txturl_<?php echo $testing_type_id; ?>_<?php echo $i ; ?>" value="" />
    <input type = "text"  class="uploadtxt2" size="33" name="txtinstruction_<?php echo $testing_type_id ; ?>" id = "txtinstruction_<?php echo $testing_type_id; ?>_<?php echo $i ; ?>" value=""  /> <br/>
    <input type="submit" name="checkout" id="checkout"   class="graybtn1 ptr  button_float_left_checkout" disabled="disabled" value="Proceed To Checkout" />
</div>

Затем присоедините фрагмент к событию change

$("input[type=text]", $(".item")).change(function() {
    var allField = true;
    $(this).closest(".item").find("input[type=text]").each(function() {
         allField = allField && ($(this).val().length > 0)
    });
    if(allField) {
        $(this).closest(".item").find("input[type=submit]").prop('disabled', false);
    }
});

Демонстрация рабочего раствора

Answer 4

if($('.uploadtxt1').val() !='' && $('.uploadtxt2').val() !='')
{
    $('#checkout').hide();
}
else
{
    $('#checkout').show();
}