This is jquery accordion code for effect:
这是jquery手风琴代码:
$(function() {
$( "#accordion" ).accordion({
header: "h3"
});
});
This is the output of database (mysql) which is loop (uncertain loop):
这是数据库(mysql)的输出,它是循环(不确定循环):
while($showE = mysqli_fetch_array($show))
{
echo $showE['un_name']; /* this should be accordion head */
echo $showE['un_name_dec']; /* this should be accordion description */
}
So my question is, how to show them in accordion effect, everything is working( i can fetch records from database), but accordion effect is not forming, (accordion effect is not working) and how to show them with loop?
所以我的问题是,如何在手风琴效果中显示它们,一切都运行(我可以从数据库中获取记录),但是手风琴效果没有形成(手风琴效果无效),以及如何用循环来显示它们?
2 个解决方案
#1
2
So, you have two files: index.html and load_entries.php
你有两个文件:索引。html和load_entries.php
index.html:
index . html:
<html>
<head>
<!-- Make the imports of your stylesheets and scripts here -->
<script type="text/javascript">
$(function() {
$("#accordion").accordion({header: "h3"});
});
function load_entries() {
$.ajax({
url: "load_entries.php",
complete: function(data) {
$("#accordion").html(data.responseText);
}
});
}
</script>
</head>
<body>
<button onclick="load_entries();">Load</button> <!-- Button to load the entries -->
<div id="accordion">
</div>
</body>
</html>
load_entries.php:
load_entries.php:
<?php
//connect to your database here
$sql = "SELECT * FROM entries"; //replace entries by your own table name
$result = mysqli_query($sql);
while($row = mysqli_fetch_array($result)) {
echo '<h3>'.$row['un_name'].'</h3>';
echo '<div>'.$row['un_name_dec'].'</div>';
}
?>
#2
2
jquery Script
jquery脚本
$.post('server.php', function(data) {
$("#accordion").html(data);
$("#accordion").accordion();
});
Server.php
Server.php
$html='';
while($showE = mysqli_fetch_array($show)) {
$html.= '<h3>'.$showE['un_name'].'</h3>';
$html.= '<div>'.$showE['un_name_dec'].'</div>';
}
echo $html;
HTML MARKUP
HTML标记
<div id='accordion'></div>
#1
2
So, you have two files: index.html and load_entries.php
你有两个文件:索引。html和load_entries.php
index.html:
index . html:
<html>
<head>
<!-- Make the imports of your stylesheets and scripts here -->
<script type="text/javascript">
$(function() {
$("#accordion").accordion({header: "h3"});
});
function load_entries() {
$.ajax({
url: "load_entries.php",
complete: function(data) {
$("#accordion").html(data.responseText);
}
});
}
</script>
</head>
<body>
<button onclick="load_entries();">Load</button> <!-- Button to load the entries -->
<div id="accordion">
</div>
</body>
</html>
load_entries.php:
load_entries.php:
<?php
//connect to your database here
$sql = "SELECT * FROM entries"; //replace entries by your own table name
$result = mysqli_query($sql);
while($row = mysqli_fetch_array($result)) {
echo '<h3>'.$row['un_name'].'</h3>';
echo '<div>'.$row['un_name_dec'].'</div>';
}
?>
#2
2
jquery Script
jquery脚本
$.post('server.php', function(data) {
$("#accordion").html(data);
$("#accordion").accordion();
});
Server.php
Server.php
$html='';
while($showE = mysqli_fetch_array($show)) {
$html.= '<h3>'.$showE['un_name'].'</h3>';
$html.= '<div>'.$showE['un_name_dec'].'</div>';
}
echo $html;
HTML MARKUP
HTML标记
<div id='accordion'></div>