dqyz48470
2016-10-12 16:39
浏览 85
已采纳

如果选中动态输入的复选框,则禁用多个输入字段,否则启用它

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

This is the php code:

   <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>

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

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • dsfds2353 2016-10-12 17:11
    已采纳

    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.

    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.

    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);
        }
      });
    });
    

    Demo: https://jsfiddle.net/BenjaminRay/nnphq559/

    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • douchun9719 2016-10-12 17:08
        $(document).ready(function () {
            $(":checkbox").on("change", function () {
                if ($(this).prop("checked"))
                    $(":text#"+$(this).attr("id")).prop("disabled", "disabled");
                else
                    $(":text#" + $(this).attr("id")).removeAttr("disabled");
            });
        });
    
    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题