Отключить кнопки, когда есть минимальное значение Textbox с помощью Jquery

У меня есть 10 кнопок с различными значениями в HTML ..Отключить кнопки, когда есть минимальное значение Textbox с помощью Jquery

<button class="btn btn-warning" name="table_no" value="2" id="tblidno2">2</button> 
<button class="btn btn-warning" name="table_no" value="3" id="tblidno3">3</button> 
<button class="btn btn-warning" name="table_no" value="5" id="tblidno5">5</button> 
<button class="btn btn-warning" name="table_no" value="8" id="tblidno8">8</button> 
<button class="btn btn-warning" name="table_no" value="3" id="tblidno3">3</button> 
<button class="btn btn-warning" name="table_no" value="2" id="tblidno2">2</button> 
<button class="btn btn-warning" name="table_no" value="7" id="tblidno7">7</button> 
<button class="btn btn-warning" name="table_no" value="4" id="tblidno4">4</button> 
<button class="btn btn-warning" name="table_no" value="6" id="tblidno6">6</button> 
<button class="btn btn-warning" name="table_no" value="4" id="tblidno4">4</button>

и один входной ящик,

<input type="text" name="given_tblno" id="given_tblno" value="6" />

Всякий раз, когда я изменить (с помощью OnChange событие) значение в поле ввода из given_tblno я хочу, чтобы отключить все кнопки с условием данным, как,

$a=$('#given_tblno').val(); 
$b=$('#tblidno').val(); // Need to check Each and every Button values using any loop 

if($a<$b) 
{ 

    //....Here i want Disable buttons when condition is true.... 

}

так здесь, в моем примере, когда это условие истинно, кнопки будут отключены, если значения произойдут в кнопках 2,3,5,3,2,4,4 .. Только 8,7,6 значений имеют кнопки, которые должны быть включены для клика действия.

Использование JQuery, которым я хотел заниматься.

источник

2014-11-01 Arockiaraj

вы можете объяснить более подробно, что вы хотите сделать? – Chanckjh

$(function() { 
 
    var btns = $('button[name=table_no]'); 
 
    $('#given_tblno').on('input', function() { 
 
    var cur = parseInt($(this).val()) || 0; 
 
    btns.prop('disabled', function() { 
 
     return parseInt(this.value) < cur; 
 
    }); 
 
    }).trigger('input'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button class="btn btn-warning" name="table_no" value="2" id="tblidno2">2</button> 
 
<button class="btn btn-warning" name="table_no" value="3" id="tblidno3">3</button> 
 
<button class="btn btn-warning" name="table_no" value="5" id="tblidno5">5</button> 
 
<button class="btn btn-warning" name="table_no" value="8" id="tblidno8">8</button> 
 
<button class="btn btn-warning" name="table_no" value="3" id="tblidno3">3</button> 
 
<button class="btn btn-warning" name="table_no" value="2" id="tblidno2">2</button> 
 
<button class="btn btn-warning" name="table_no" value="7" id="tblidno7">7</button> 
 
<button class="btn btn-warning" name="table_no" value="4" id="tblidno4">4</button> 
 
<button class="btn btn-warning" name="table_no" value="6" id="tblidno6">6</button> 
 
<button class="btn btn-warning" name="table_no" value="4" id="tblidno4">4</button> 
 
<input type="text" name="given_tblno" id="given_tblno" value="6" />

источник

2014-11-01 07:07:48 Arvind

Использование

var vals = ['2','3','4','5']; 
$("#given_tblno").on('change keyup',function() { 
$a = parseInt($('#max_tblno').val()); 
$b = parseInt($('#given_tblno').val()); 
    if($a<$b){ 
    $("[value='" + vals.join("'],[value='") + "']").attr('disabled','disabled'); 
    }else{ 
    $('button[name="table_no"]').removeAttr('disabled'); 
    } 
});

Working Demo

источник

2014-11-01 06:36:53

max_tblno будет постоянным и не может быть изменен, вы можете видеть, что я задан как скрытое поле. Так что только given_tblno может быть изменено. Пожалуйста, обновите свой вопрос – Arockiaraj

попробовать это

HTML

<head><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script></head> 

<button class="btn btn-warning" name="table_no" value="2" id="tblidno2">2</button> 
<button class="btn btn-warning" name="table_no" value="3" id="tblidno3">3</button> 
<button class="btn btn-warning" name="table_no" value="5" id="tblidno5">5</button> 
<button class="btn btn-warning" name="table_no" value="8" id="tblidno8">8</button> 
<button class="btn btn-warning" name="table_no" value="3" id="tblidno3">3</button> 
<button class="btn btn-warning" name="table_no" value="2" id="tblidno2">2</button> 
<button class="btn btn-warning" name="table_no" value="7" id="tblidno7">7</button> 
<button class="btn btn-warning" name="table_no" value="4" id="tblidno4">4</button> 
<button class="btn btn-warning" name="table_no" value="6" id="tblidno6">6</button> 
<button class="btn btn-warning" name="table_no" value="4" id="tblidno4">4</button> 
<input type="text" name="given_tblno" id="max_tblno" value="3" /> 
<input type="text" name="given_tblno" id="given_tblno" value="6" />

JQuery

$(function(){ 
      $('#given_tblno').on('keyup', function() { 
       $a=parseInt($('#max_tblno').val()); 
      $b=parseInt($('#given_tblno').val()); 
      if($a<$b) 
      {  
       $("button[id^='tblidno']").prop("disabled",true);    
      } 
      else 
       $("button[id^='tblidno']").prop("disabled",false); 
      }); 
     });

fiddle link

источник

2014-11-01 06:55:54 Rasel

Это не работает – Arockiaraj

Вы видели скрипку? я изменил ваше скрытое поле на текст, потому что вы не можете его изменить, если он остается скрытым. – Rasel

Вы можете взять метод и JS ParseInt JQuery HTML() метод advantageof. Проверить, что кнопка $(this).html() меньше, чем $('#given_tblno').val(), и если да, то изменяем $(this).attr('disabled','disabled').

Вот ваш код:

<script> 
$("#max_tblno,#given_tblno").change(function() { 
    a = parseInt($('#max_tblno').val()); 
    b = parseInt($('#given_tblno').val()); 
    if(a<b){ 
     $(this).siblings().removeAttr('disabled'); 
      $('button').each(
      function(){ 
       if(parseInt($(this).html())<b){ 
        $(this).attr('disabled','disabled'); 
       } 
      }); 
     } 
    }); 
</script>

Вот Fiddle: http://jsfiddle.net/piyushkmr/xyL0p6ay/1/

источник

2014-11-01 07:05:39

Я отредактировал свой вопрос .. Не будет max_tblno для сравнения given_tbleno .. Когда загрузка и изменение given_tblno должны сравниваться со всеми значениями кнопок, и это должно быть отключено в состоянии. – Arockiaraj

Отключить кнопки, когда есть минимальное значение Textbox с помощью Jquery

ответ

Смежные вопросы