title: Disable the inputs when checkbox not checked
body: <p>I have this code and I want to disable all the inputs when the checkbox is not checked.</p>
  
  <pre><code>&lt;tr class="select_tr"&gt;
      &lt;td&gt;&lt;?= ucwords($food_name); ?&gt;&lt;/td&gt;
  
      &lt;td class="form-group text-center"&gt;
          &lt;input value="&lt;?= $order_food_id; ?&gt;" type="checkbox" name="select_food[]" checked&gt;
      &lt;/td&gt;
  
      &lt;td class="form-group"&gt;
          &lt;input value="&lt;?= $order_food_total_members; ?&gt;" type="text" name="total_members[]" class="form-control" placeholder="Total Members"&gt;
      &lt;/td&gt;
  
      &lt;td class="form-group "&gt;
          &lt;input value="&lt;?= $order_food_date; ?&gt;" type="date" name="food_date" class="form-control"&gt;
      &lt;/td&gt;
  
      &lt;td class="form-group "&gt;
          &lt;input value="&lt;?= $order_food_time; ?&gt;" type="time" name="food_time" class="form-control"&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p>I have used this code but it is disabling only the first input and I don't know how to taget the remaining two.</p>
  
  <pre><code>$('input[type="checkbox"]').click(function () {
      if(!this.checked) {
          $(this).closest('td').next('td').find('input:text').attr('disabled' , true);
      } else {
          $(this).closest('td').next('td').find('input:text').attr('disabled' , false);
      }
  });
  </code></pre>