我想在左手风琴中打印一半表记录,在右div中打印剩余的一半记录。我使用以下代码。我在表中列了两列。我有记录。例如,如果表中有4条记录,那么前两条记录应该放在左手风琴上,接下来的两条记录应该放在右侧手风琴上。我使用以下代码。
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "data";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT id, price FROM demo";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
print_r($row);
}
} else {
echo "0 results";
}
$conn->close();
?>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
</head>
<body>
<div class="ordinary">
<div class="container">
<div class="row main-row">
<!--left-->
<div class="col-md-6">
<div class="col-inner left-col">
<div class="accordion-group" id="accordion">
<div class="accordion-panel" >
<div class="heading glyphicon-custom">
<h4 class="title left-title">
<a class="accordion-toggle title-font" data-toggle="collapse" data-parent="#accordion" href="#panel1"><i class="glyphicon glyphicon-plus gly-font "></i><span class="title-panel">Antipasti</span></a>
</h4>
</div>
<div id="panel1" class="panel-collapse collapse">
<div class="contain-body">
<div class="su-spoiler-content su-clearfix inner-content">
1
</div>
</div>
</div>
</div>
</div>
</div>
<!--make it 50% -->
<div class="col-inner left-col">
<div class="accordion-group" id="accordion">
<div class="accordion-panel" >
<div class="heading glyphicon-custom">
<h4 class="title left-title">
<a class="accordion-toggle title-font" data-toggle="collapse" data-parent="#accordion" href="#panel2"><i class="glyphicon glyphicon-plus gly-font "></i><span class="title-panel">Antipasti</span></a>
</h4>
</div>
<div id="panel2" class="panel-collapse collapse">
<div class="contain-body">
<div class="su-spoiler-content su-clearfix inner-content">
2
</div>
</div>
</div>
</div>
</div>
</div>
</div> <!-- left-col-md-6 ends here -->
<div class="col-md-6 ">
<div class="col-inner right-all">
<div class="accordion-group" id="accordion">
<div class="accordion-panel" >
<div class="heading glyphicon-custom">
<h4 class="title">
<a class="accordion-toggle title-font" data-toggle="collapse" data-parent="#accordion" href="#panel3"><i class="glyphicon glyphicon-plus gly-font "></i><span class="title-panel">Antipasti</span></a>
</h4>
</div>
<div id="panel3" class="panel-collapse collapse">
<div class="contain-body">
<div class="su-spoiler-content su-clearfix inner-right">
3
</div>
</div>
</div>
</div>
</div>
</div>
<!-- accordian -->
<div class="col-inner right-all">
<div class="accordion-group" id="accordion">
<div class="accordion-panel" >
<div class="heading glyphicon-custom">
<h4 class="title">
<a class="accordion-toggle title-font" data-toggle="collapse" data-parent="#accordion" href="#panel4"><i class="glyphicon glyphicon-plus gly-font "></i><span class="title-panel">Antipasti</span></a>
</h4>
</div>
<div id="panel4" class="panel-collapse collapse">
<div class="contain-body">
<div class="su-spoiler-content su-clearfix inner-right">
4
</div>
</div>
</div>
</div>
</div>
</div>
<br/>
</div> <!-- right-col-md-6 ends here -->
</div>
</div>
</div>
<script type="text/javascript">
var selectIds =$('#panel1,#panel2,#panel3,#panel4');
$(function ($) {
selectIds.on('hidden.bs.collapse show.bs.collapse', function () {
$(this).prev().find('.glyphicon').toggleClass('glyphicon-plus glyphicon-minus');
})
});
</script>
</body>
答案 0 :(得分:2)
试试这个:
<?php
while($row = fetch_row($result)){
$rows[]=$row;
}
?>
左手风琴内侧
<?php
for($i=0;$i < count($rows)/2;$i++){
echo $row[$i]['id']; //or whatever you want
}
?>
右手风琴
<?php
for($i=count($rows)/2;$i < count($rows); $i++){
echo $row[$i]['id']; //or whatever you want
}
?>