将输入类型复选框关联到输入类型文本

Question

我有问题，我需要将输入类型复选框关联到输入类型文本。

情况如下：

从数据库中提取数据。 PK 数据是复选框的值。当复选框 select 激活输入类型文本时，您可以在其中输入特定数字。

现在的问题是，select选中一个复选框输入文本，各种类型的都被激活。我希望通过 select 复选框输入仅与启用的复选框关联的输入。

我的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 代码（通过 select 复选框激活或停用文本字段的代码）：

$('.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);
    }
});

祝你好运，编码愉快！ :-)

将输入类型复选框关联到输入类型文本

Associate input type checkbox to input type text

html

php

forms

jquery

input