如果为动态输入选中复选框，则禁用多个输入字段，如果没有，则重新启用 [英] Disabling multiple input field if a checkbox is checked for dynamic inputs and reenable it if no

问题描述

我有几个动态输入字段和复选框，我想禁用输入框，如果复选框具有类似的id值

I have several dynamic input fields and checkboxes and i would like to disable the input box if the checkbox having a similar id value is checked

这是php代码：

   <table class="table table-striped">
                <thead>
                <tr>
                    <th>#</th>
                    <th>Description</th>
                    <th>Status</th>
                    <th>Comment</th>
                </tr>
                </thead>
                <tbody>

 foreach ($checks as $m => $check) {
    $item ="";
    $checkbox ="";
   $textinput ="";
   $displayx="";

if ($check->mandatory_customer == 1) { //mandatory customer checks
 $displayx .="<i style='color:red;'>*</i>";
  $item .=  $check->item.$displayx;
   $checkbox .='<input type="checkbox" class="1" id="'.$m.'"' ;
   $textinput .='<input type="text" class="1" id="'.$m.'"' ;

     } else { //not mandatory customer
    $item .=  $check->item;
   $checkbox .='<input type="checkbox" class="0" id="'.$m.'"' ;
 $textinput .='<input type="text" class="0" id="'.$m.'"' ;

    }

echo "<tr id='" . $m . "'>";
echo "<td>" . $m . "</td>";
echo "<td>" . $item . "</td>";
echo "<td>".$checkbox."</td>";
echo "<td>".$textinput."</td>";
echo "</tr>";
}
  ?>
     }

</tbody>

如果选中复选框，则要禁用与复选框具有相同ID的输入框。我如何通过使用jquery通过这个

Now i would like to disable the input boxes having the same id's as the checkboxes if the checkbox is checked. How do i go through this using jquery

推荐答案

如我在评论中所述，它不允许有更多的比一个元素。您应该在分配 $ checkbox 和 $ textinput 的行上更新ID，以便分配唯一的ID值，这也将帮助您检索另一端提交的值。将它们更改为 id =chk _'。$ m。'和 id =txt _'。$ m。'就足够了。

As stated in my comment, it is not permitted to have the same ID on more than one element. You should update the ID on the lines where you assign $checkbox and $textinput so that unique ID values are assigned, which will also help you retrieve the submitted values on the other end. Changing them to something like id="chk_'.$m.'" and id="txt_'.$m.'" would be sufficient.

此外，您似乎没有关闭输入标签。将 /> 添加到您分配 $ checkbox 和 $ textinput行末，或只是> （如果不使用HTML 5）。

Also, it looks like you are not closing your input tags. Add /> to the end of the lines where you assign $checkbox and $textinput, or just > if not using HTML 5.

修复这些问题，下面的jquery会为你工作：

Once you've fixed those issues, the following jquery will work for you:

$(function() {
  $('input[type=checkbox]').change(function() {
    if (this.checked) {
        $(this).closest('tr').find('input[type=text]').prop('disabled', true);
    } else {
        $(this).closest('tr').find('input[type=text]').prop('disabled', false);
    }
  });
});

演示： https://jsfiddle.net/BenjaminRay/nnphq559/

这篇关于如果为动态输入选中复选框，则禁用多个输入字段，如果没有，则重新启用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！