javascript - 单击服务复选框时隐藏和显示事件复选框

Question

PHP

<?php 
//for service 1
$all_activities = "select * from activity join displayserviceactivitymap on activity.activity_id = displayserviceactivitymap.activity_id right  join services on services.service_id = displayserviceactivitymap.service_id";    

$all_activities = $conn->query($all_activities) or die ($conn>error.__LINE__);
$activities = [];

while ($row = $all_activities->fetch_assoc()) {
    $activities[] = $row;
}
$repeated = 'repeated';

foreach ($activities as $act) {
  if($act['servicename'] != $repeated){

    echo '<br><input type="checkbox" name="arr['.$act['service_id'].'][service]" value="'.$act['service_id'].'" id="'.$act['service_id'].'">'.$act['service_id'].$act['servicename'].'<br>';
    $repeated = $act['servicename'];
  }

  if($act['activity_id'] != '')

  echo '<input type="checkbox" name="arr['.$act['service_id'].'][activity][]" value="'.$act['activity_id'].'" id="'.$act['activity_id'].'">'.$act['nameofactivity'].'<br>';
}

?>

我的代码的输出是

• 所得税

  • 返回
  • 填充

• 消费税

  • 表格
  • 返回
  • 全局贸易总协定
• TDS
  • 申请
  • 退款

这里的 Incometax、GST、TDS 是服务，其他是服务的相关事件。我想在选中复选框时显示事件，在取消选中复选框时隐藏。

Answer 1

请尝试运行整个代码以便更好地理解

<?php
function array_group(array $data, $by_column) {
    $result = [];
    foreach ($data as $item) {
        $column = $item[$by_column];
        unset($item[$by_column]);
        if (isset($result[$column])) {
            $result[$column][] = $item;
        } else {
            $result[$column] = array($item);
        }
    }
    return $result;
}
$activities = array(
    array('service_id' => '1',
          'servicename' => 'Incometax',
          'activity_id' => '1',
          'nameofactivity' => 'Return'),
    array('service_id' => '1',
          'servicename' => 'Incometax',
          'activity_id' => '2',
          'nameofactivity' => 'filling')
);
$activities = array_group($activities, 'servicename');
?>
<link href = "https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel = "stylesheet" />
<script src = "https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<?php foreach ($activities as $key => $act) { ?>
<div id="accordion">
    <h3>
        <label for='product-44-44'>
            <input type='checkbox'  name="arr[<?php echo $act[0]['service_id']; ?>][service]" value="<?php echo $act[0]['service_id']; ?>" id="<?php echo $act[0]['service_id']; ?>"/>
            <?php echo $key; ?>
        </label>
    </h3>
    <div class="columns">
        <?php foreach ($act as $value) { ?>
        <div class="d1">
            <label>
                <input type="checkbox" name="arr[<?php echo $value['service_id']; ?>][activity][]" value="<?php echo $value['activity_id']; ?>" id="<?php echo $value['activity_id']; ?>">
                <?php echo $value['nameofactivity']; ?>
            </label>
        </div>
        <?php } ?>
    </div>
</div>
<?php } ?>
<script>
    $("#accordion")
    .accordion({
        collapsible: true,
        active: false,
        heightStyle: "content",
        beforeActivate: function (event, ui) {
            var oldInput = ui.oldHeader.find('input');
            oldInput.prop('checked', !oldInput.prop('checked')) // this bit unchecks when the accordion is closed
            var newInput = ui.newHeader.find('input');
            // this bit checks when the accordion is opened
            newInput.prop('checked', !newInput.prop('checked'))
        }
    }
              );
</script>