Question

我有两套复选框。当第一个div的复选框被选中时，它将通过ajax调用获取数据并填入第二个div。选中另一个复选框后，它将附加到第二个div。但是，如果未选中第一个div的复选框，则必须删除附加的复选框列表。我从没想过会这么难！有人可以帮帮我吗？

触发ajax调用的第一个表

<table class="large-7 large-centered columns"><tr>
              <?php
              $i=0;
              while($row = $stmt->fetch(PDO::FETCH_ASSOC))
              {
                  $i++;
                  //echo $i;

              ?>
             <td>
             <label for="level_<?php echo $row['catid'];?>">
              <input type="checkbox" class="level" id="level_<?php echo $row['catid'];?>" value="<?php echo $row['catid'];?>">
             <span></span>
              <?php echo $row['catname'];?>

              </label>
             </td>

              <?php
              if($i==2)
                  {
                      echo"</tr><tr>";
                      $i=0;
                  }
              }
              ?>
        </tr></table>

其次，附加清单

<div class="small-12 medium-12 large-7 large-centered columns" id="show_subjects">
     <table>
<?php
while($row = $statement->fetch())
{
    $levels=$row['catname'];
    $levels_id=$row['catid'];
    $subjects= $row['subname'];
    $subjects_id= $row['subid'];


    if($last_category != $levels) 
       {
        $last_category = $levels;
       ?> 

      <tr><th class="subjects"><?php echo $levels;?>
       <?php 
       }
       ?>
     <table>
     <tr>
     <td><?php echo $subjects;?></td>
     <td>

    <label for="<?php echo $subjects_id;?>">
   <input type="checkbox" class="sub" name="sub[<?php echo $subjects_id;?>]" id="<?php echo $subjects_id;?>" value="">
    <span></span>
    <?php echo  $subjects;?>
    </label>
    </td>
     </tr>
     </table>
    <?php
    if($last_category != $levels)
    ?>
    </th></tr>

    <?php
}
?>
 </table>   
</div>

脚本

$("input[type=checkbox][id^=level]").on("change",function()
{
    var selectedval = $(this).val();
     if($(this).is(":checked")) {
     var t=this.id;
     //alert("click " + t);
     var nowshow=t.split("level_").join("");

    fetchSub(nowshow);
     }
      else {
         var me=$("th.subjects");
         var remove_id=this.id;
         //alert($id);
         $("th"+selectedval).remove();//This is where I wish to know how to remove


     }
});

HTML，如第二个复选框的Inspect元素

<table>
<tbody>
<tr>
<th class="subjects">...
<table>
<tbody>
<tr>
<td></td>
<label for="5">
<input type="checkbox" class="sub" name="sub[5]" id="5" >
<span></span>
</label>
</td>
</tr>
</tbody>
</table>
</th>
</tr>
</tbody>
</table>

取消选中复选框后，无法删除相关数据

0 个答案: