Связать тип входного элемента для ввода типа текста

Question

У меня возникла проблема, мне нужно связать флажок типа ввода с текстом типа ввода.

ситуация выглядит следующим образом:

Извлечение данных из базы данных. Данные PK являются значением флажка. Когда checbox выбирает текст типа ввода, в котором вы можете ввести определенный номер, активируется.

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

Мой HTML код (Этот код создает входной флажок и ввода текста для каждой записи в базе данных, а также то, что я хочу, чтобы активировать определенный флажок установлен, то ввод текста типа):

<form action="send.php" method="POST" id="form-touch"> 
    <?php foreach ($data as $key): ?> 
     <div id="inputsForm"> 
       <input type="checkbox" class="id-check" name="nuevoid[]" value="<?php echo $key['pr_id'] ?>"> 
       <input type="newquantity[]" class="myinput" disabled name="newQuantity" value="" placeholder="Enter quantity"> 
     </div> 
    <?php endforeach; ?> 
       <input type="submit" value="Send"> 
</form> 

Мой код JQuery (код, который активирует или деактивирует текстовое поле, выбрав флажок):

$('.id-check').change(function(){ 
    if ($('.id-check').is(':checked') == false){ 
     $('.myinput').val('').prop('disabled', true); 
    } else { 
     $('.myinput').val('1').prop('disabled', false); 
    } 
}); 

Как я могу добиться того, чего я хочу? Привет из Чили.

Answer 1

Попробуйте

$('.id-check').change(function() { 
 
    if ($(this).is(':checked') == false) { 
 
    $(this).closest('div').find('.myinput').val('').prop('disabled', true); 
 
    } else { 
 
    $(this).closest('div').find('.myinput').val('1').prop('disabled', false); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="send.php" method="POST" id="form-touch"> 
 

 
    <div id="inputsForm"> 
 
    <input type="checkbox" class="id-check" name="nuevoid[]" value=""> 
 
    <input type="newquantity[]" class="myinput" disabled name="newQuantity" value="" placeholder="Enter quantity"> 
 
    </div> 
 
    <div id="inputsForm"> 
 
    <input type="checkbox" class="id-check" name="nuevoid[]" value="1"> 
 
    <input type="newquantity[]" class="myinput" disabled name="newQuantity" value="" placeholder="Enter quantity"> 
 
    </div> 
 

 
    <input type="submit" value="Send"> 
 
</form>

Answer 2

вы можете использовать .next() селектор JQuery. Я изменил ваш обработчик изменения jQuery ниже. Это работает для меня, так что попробуйте. Это должно сработать и для вас.

$('.id-check').change(function(){ 
    if ($(this).is(':checked') == false){ 
     $(this).next().val('').prop('disabled', true); 
    } else { 
     $(this).next().val('1').prop('disabled', false); 
    } 
}); 

Goodluck и счастливое кодирование! :-)