我创建了一个带有bootstrap框架的网站。在这个网站上,我加载了一个包含数据库记录的表,我使用php进行此操作。
我的问题是:php是在桌面上加载数据的最佳方式还是有更好的选择?
此外,当它加载网站中的数据时,首先显示没有格式的文本,并在1秒后显示css样式:(
这是代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>AddCloud - Edicions</title>
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/bootstrap-table/dist/bootstrap-table.css">
</head>
<body>
<?php
session_start();
if(isset($_SESSION['username']) and $_SESSION['username'] <> ''){
?>
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#defaultNavbar1"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button>
<a class="navbar-brand" href="http://www.addvantage.es"><font color=#8abe44>AddCloud</font></a></div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="defaultNavbar1">
<ul class="nav navbar-nav">
<li class="active"><a href="edicions.php">Edicions<span class="sr-only">(current)</span></a></li>
<li><a href="productes.php">Productes</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><span class="glyphicon glyphicon-user"></span> <?php echo $_SESSION['username'] ?></a>
<ul class="dropdown-menu" role="menu">
<li><a href="preferences.html"><span class="glyphicon glyphicon-wrench"></span> preferències</a></li>
<li><a href="changepassword.html"><span class="glyphicon glyphicon-lock"></span> canviar password</a></li>
<li class="divider"></li>
<li><a href="logout.php"><span class="glyphicon glyphicon-log-out"></span> log out</a></li>
</ul>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container-fluid -->
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<h1 class="text-center">Miquel Alimentació</h1>
</div>
</div>
<hr>
</div>
<div class="container">
<div class="row text-center">
<div class="col-md-6 col-md-offset-3"><h3>Edició 12</h3></div>
</div>
<hr>
<div class="row">
<?php
// Conexió a la base de dades
include("connect.php");
$conn = Conectarse("localhost", "5432", "dbname", "dbuser", "dbpass");
//query
$query = "SELECT * FROM produccion.ma_origen ORDER BY id_articulo ASC";
$result = pg_query($conn, $query);
//se despliega el resultado
echo "<table id='table'
data-toggle='table'
data-toolbar='#toolbar'
data-show-refresh='true'
data-show-toggle='true'
data-sort-name='name'
data-sort-order='desc'
data-show-columns='true'
data-pagination='true'
data-search='true'
data-click-to-select='true'>";
echo "<thead class='thead-inverse'>";
echo "<tr>";
echo "<th data id='seleccion' data-switchable='false' data-checkbox='true'></th>";
echo "<th data id='pagina' data-sortable='true'>pagina</th>";
echo "<th data id='codigo' data-sortable='true' data-switchable='false'>codigo</th>";
echo "<th data id='descripcion' data-sortable='true' data-switchable='false'>descripcion</th>";
echo "<th data id='pvp-cat' data-sortable='true'>pvp-cat</th>";
echo "<th data id='pvp-lev' data-sortable='true'>pvp-lev</th>";
echo "<th data id='pvp-and' data-sortable='true'>pvp-and</th>";
echo "<th data id='pvp-cen' data-sortable='true'>pvp-cen</th>";
echo "<th data id='pvp-nor' data-sortable='true'>pvp-nor</th>";
echo "<th data id='pvp-vas' data-sortable='true'>pvp-vas</th>";
echo "<th data id='fecha-mod' data-sortable='true'>fecha-mod</th>";
echo "<th data id='user' data-sortable='true' data-visible='false'>user</th>";
echo "</tr>";
echo "</thead>";
echo "<tbody>";
while ($row = pg_fetch_row($result)){
echo "<tr>";
echo "<td></td>";
echo "<td>$row[2]></td>";
echo "<td>$row[3]</td>";
echo "<td>$row[4]</td>";
echo "<td>$row[5]</td>";
echo "<td>$row[6]</td>";
echo "<td>$row[7]></td>";
echo "<td>$row[8]</td>";
echo "<td>$row[9]</td>";
echo "<td>$row[10]</td>";
echo "<td>$row[11]</td>";
echo "<td>$row[12]</td>";
echo "</tr>";
}
echo "</tbody>";
echo "</table>";
?>
</div>
</div>
<hr>
<div class="row">
<div class="text-center col-md-6 col-md-offset-3">
<p>Copyright © 2016 · All Rights Reserved · <a href="http://www.addvantage.es/" >http://www.addvantage.es</a></p>
</div>
</div>
<hr>
</div>
<script>
$("td").dblclick(function(){
alert("The paragraph was double-clicked");
});
</script>
<script src="assets/jquery/jquery.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/bootstrap-table/dist/bootstrap-table.js"></script>
<?php
} else{
?><p>La sesión no está activa, por favor ingrese <a href="login_ok.html">aquí</a></p>
<?php
}?>
</body>
</html>
请问你能解决这个问题吗?
谢谢!
答案 0 :(得分:0)
使用Ajax获取数据,并使用.append()* function(jQuery),填写$(document).ready()或任何其他触发事件的表。
*
jQuery.each(data, function(index, value) {
$("#table_div").append("<tr><td>" + value + "</td></tr>");
});
您可以查看以下示例。
var mydata = [{"Nome":"",
"Cognome":"",
"DataN":"0000-00-00",
"Provincia":"",
"Comune":"",
"CAP":"",
"Indirizzo":"",
"Fisso":"",
"Mobile":"",
"Note":""},
{"Nome":"Federico",
"Cognome":"Lupieri",
"DataN":"2015-09-16",
"Provincia":"",
"Comune":"",
"CAP":"34170",
"Indirizzo":"Via Ascoli 1",
"Fisso":"00112233445566",
"Mobile":"00112233445566",
"Note":"Vediamo se funziona questo"}];
$(document).ready(function(){
$.ajax({
url: '/echo/json/',
dataType: 'json',
success: function(data) {
//alert('done');
$('#clienti').bootstrapTable({
data: mydata
});
},
error: function(e) {
console.log(e.responseText);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table class="display table table-bordered" id="clienti">
<thead>
<tr>
<th data-field="Nome">Nome</th>
<th data-field="Cognome">Cognome</th>
<th data-field="DataN">Data Nascita</th>
<th data-field="Provincia">Provincia</th>
<th data-field="Comune">Comune</th>
<th data-field="CAP">CAP</th>
<th data-field="Indirizzo">Indirizzo</th>
<th data-field="Fisso">Fisso</th>
<th data-field="Mobile">Cellulare</th>
<th data-field="Note">Note</th>
</tr>
</thead>
</table>
使用Ajax获取数据,然后直接填写表格,以便在网站上看到的任何数据都将在表格中排序。
答案 1 :(得分:0)
至于你的问题: &#34;我的问题是:php是在桌面上加载数据的最佳方式还是有更好的选择?&#34;
答:如果您正在加载从源(例如:数据库或文件)检索的动态数据,那么执行此操作的最佳方式(或唯一方法)是通过像您提到的PHP这样的脚本语言。