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);
    ?>

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>

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";




}
?>

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>&nbsp;</td>
  </tr>
</table></td>

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.

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.

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.

I suggest you make use of ez sql to make it easier to query the database: http://justinvincent.com/ezsql

And jquery as well: http://jquery.com/

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/

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:

<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

creating dynamic Div Tags for AJAX-PHP-MySQL generated table

精彩评论

关注公众号

热门标签

图文推荐

creating dynamic Div Tags for AJAX-PHP-MySQL generated table

更多 问答 相关资讯：

精彩评论

关注公众号

热门标签

图文推荐

更多问答相关资讯：