Как отключить вход при смене других входов (jQuery) - PullRequest
Новая
       50

Как отключить вход при смене других входов (jQuery)

0 голосов
/ 01 ноября 2018

Я хотел бы добавить атрибут отключить d для ввода # stock , если какое-либо значение # option_name-x не пусто. Мой код работает, только если я ввожу что-то в # option_value_1 , но он не работает, если я оставлю # option_value_1 пустым и введу что-то в # option_value_2 или следующий. Другими словами, код работает только с первым вводом. 

<tr>
    <td><input name="option_name[]" id="option_name_1" type="text"></td>
</tr>
<tr>
    <td><input name="option_name[]" id="option_name_2" type="text"></td>
</tr>
<tr>
    <td><input name="option_name[]" id="option_name_3" type="text"></td>
</tr>
<tr>
    <td><input name="option_name[]" id="option_name_4" type="text"></td>
</tr>
<tr>
    <td><input name="option_name[]" id="option_name_5" type="text"></td>
</tr>
<tr>
    <td>
        Stock (*disabled if any option_name field is NOT EMPTY*)<br>
        <input name="stock" id="stock" type="text">
    </td>
</tr>


// on input change
    $("input").change(function() {
// i want to react on whichever input with id starting with "option_name"
        if($("[id^='option_name']").val() !== "") {
            $("#stock").attr('disabled', 'disabled');
        } else {
            $("#stock").removeAttr('disabled', 'disabled'); 
        }
})

Ответы [ 2 ]

0 голосов
/ 01 ноября 2018

Я надеюсь, что это сработает отлично для вас, всегда помните, on лучше в этом сценарии, и вам может потребоваться выполнить его также на paste 

// on input change
$("input").on("change paste keyup", function() {
  var optionsInputHavevalue = $("[id^='option_name']").filter(function() {
    return $(this).val().trim().length > 0 ;
  }).length > 0;
  $("#stock").prop('disabled', optionsInputHavevalue);
}).change();

рабочий контейнер можно найти здесь. https://jsbin.com/zojukij/edit?html,js,output

0 голосов
/ 01 ноября 2018

Вы можете использовать .filter() для получения входных данных, т.е. $("[id^='option_name']") иметь значение и .prop() для установки свойства. 

// on input change
$("input").change(function() {
  var optionsInputHavevalue = $("[id^='option_name']").filter(function() {
    return $(this).val().trim().length > 0 ;
  }).length > 0;
  $("#stock").prop('disabled', !optionsInputHavevalue);
}).change();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td><input name="option_name[]" id="option_name_1" type="text"></td>
  </tr>
  <tr>
    <td><input name="option_name[]" id="option_name_2" type="text"></td>
  </tr>
  <tr>
    <td><input name="option_name[]" id="option_name_3" type="text"></td>
  </tr>
  <tr>
    <td><input name="option_name[]" id="option_name_4" type="text"></td>
  </tr>
  <tr>
    <td><input name="option_name[]" id="option_name_5" type="text"></td>
  </tr>
  <tr>
    <td>
      Stock (*disabled if any option_name field is NOT EMPTY*)<br>
      <input name="stock" id="stock" type="text" >
    </td>
  </tr>

</table>
...