Пожалуйста, попробуйте запустить весь этот код для лучшего понимания
<?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>