创建动态div标签的AJAX PHP，MySQL的生成的表 [英] creating dynamic Div Tags for AJAX-PHP-MySQL generated table
问题描述
<?php
$q=$_GET["q"];
$con = mysql_connect('localhost', 'root', '');
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("world", $con);
$sql="SELECT * FROM country WHERE Code = '".$q."'";
$result = mysql_query($sql);
echo "<table border='1'>
<tr>
<th>Code</th>
<th>Name</th>
<th>Continent</th>
<th>GNP</th>
<th>GNPOld</th>
</tr>";
while($row = mysql_fetch_array($result))
{
echo "<tr>";
echo "<td>" . $row['Code'] . "</td>";
echo "<td>" . $row['Name'] . "</td>";
echo "<td>" . $row['Continent'] . "</td>";
echo "<td>" . $row['GNP'] . "</td>";
echo "<td>" . $row['GNPOld'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysql_close($con);
?>
以上是PHP及以下的HTML一样的，我的工作在MySQL的样本世界数据库了。
Above is PHP and below is HTML for same and I am working on sample world database of mysql now.
<html>
<head>
<script type="text/javascript">
function showUser(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","moviedetail.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<table width="100%" border="0">
<tr>
<td>
<select name="Country" onChange="showUser(this.value)">
<option>Select Name</option>
<?php
mysql_connect('localhost','root','')
or die ("could not connect DB");
mysql_select_db('world')
or die ("could not connect database");
$query="select code, name from country order by name asc"
or die ("query failed");
$result=mysql_query($query);
while(list($code, $name)=mysql_fetch_row($result)) {
echo "<option value=\"".$code."\">".$name."</option>";
echo "<div id=\"".$code."\">".$name."</div>";
}
?>
</select>
</td>
<td>
<div id="txtHint"><b>Country info will be listed here.</b></div>
</td>
</tr>
</table>
</body>
</html>
这需要采取的名字从形式和显示表相同。 我的另一套codeS是： -
This takes takes name from form and display table for same. My other set of codes are:-
<?php
for (;$i<$nrows;)
{
#add 1 so that numbers don't start with 0
echo"<tr>\n";
for ($j=0;$j<10&&$i<=$nrows;$j++)
{
$n = $i;
$i=$i + 1;
$k=$n%30;
$row = mysqli_fetch_assoc($result);
extract($row);
echo "<td>
<table>
<tr>
<td>$n</td>\n
</tr>\n
<tr>
<td>$Name</td>\n
</tr>\n
<tr>\n
<td>$Continent</td>\n
</tr>\n
<tr>\n
<td>$Region</td>\n
</tr>\n
<tr>\n
<td>$SurfaceArea</td>\n
</tr>\n
<tr>\n
<td>$IndepYear</td>\n
</tr>\n
<tr>\n
<td>$GNP</td>\n
</tr>\n
<tr>\n
<td>$k</td>\n
</tr>\n
</table>\n
</td>";
if ($k==0)break 2;
}
echo"</tr>\n";
}
?>
和HTML的相关章节是
and relevant sections of html is
<td><table border="1">
<tr>
<td>
<?php
include ("/connections/query.php");
$nrows = mysqli_num_rows($result);
/* Display results in a table */
echo "<table>\n
<tr>\n";
$i=1;
include ("/function/movietable.php");
echo "</tr>\n
</table>\n";
?>
</td>
<td> </td>
</tr>
</table></td>
我有一些麻烦，设计它。我想要一个鼠标悬停效果（如前两集codeS）显示关于每个国家的表（全）由最后两集codeS列这是在code空白的正上方产生了更多的细节。我希望它一直保持在尽管机芯同一位置显示出来。
I have few trouble with designing it. I want a mouseover effect(like in first two set of codes) showing more details about each country table(entire) generated by last two set of codes in column which is blank in code right above. I want it to remain displayed always at same position despite the page movement.
和我有一个更简单的问题。正如你可以在上面看到我已经在30个结果停止查询。我想补充一个节目，更按钮下方，显示同一页上的更多结果。
And I have one more simple problem. As you can see above I have stopped query at 30 results. I want to add a show-more button at bottom to show more results on same page.
我是新手，所以如果u指正在codeS这将是pretty的没什么太大的帮助。截至目前，它正在完全可以在本地主机。
I am a newbie, so it would be pretty much helpful if u point out mistakes in the codes. Till now it is working perfectly on localhost.
推荐答案
我建议你使用EZ SQL来更容易地查询数据库：的 http://justinvincent.com/ezsql
I suggest you make use of ez sql to make it easier to query the database: http://justinvincent.com/ezsql
和jQuery还有： http://jquery.com/
And jquery as well: http://jquery.com/
和这里的教程向您展示如何在jQuery中进行的Ajax调用：的http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/
And here's a tutorial showing you how to perform ajax calls in jquery: http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/
从code，我可以看到你想查询使用$ _GET变量数据库。我假设你的搜索字段的名称为Q。而使用JavaScript动态地显示结果。
From your code, I can see that you're trying to query the database using a $_GET variable. And I assume that the name of your search field is 'q'. And displaying the results dynamically using javascript.
HTML：
<input type="text" id="q" name="q"/>
<div id="your_div"></div><!--this is where your html table will be loaded dynamically as you type a value on the textbox-->
JavaScript的：
JAVASCRIPT:
<script src="jquery.js"></script>
<script>
$(function(){
$('#q').keyup(function(){
var query = $.trim($(this).val());
$('#your_div').load('phpfile.php', {'q' : query});
});
});
</script>
PHP：
//database configuration here
$q = mysql_real_escape_string($_POST['q']);
//html table here
这篇关于创建动态div标签的AJAX PHP，MySQL的生成的表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
