2011-06-02 123 views
0

你好 昨天我在这里得到了一些帮助,我遇到了tablesorter的问题。如果我自己运行后端查询,它会显示结果。但我从下拉的另一个页面调用它显示所有记录,并且在萤火虫中没有看到错误。我哪里错了?谢谢jquery tablesorter问题

这段代码可以独立工作。

getuserlog.php

<?php 
$q=$_GET["q"]; 

$con = mysql_connect('localhost', 'root', ''); 
if (!$con) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("sample", $con); 

$sql="SELECT * FROM logger_log WHERE idusr_log = '".$q."' order by datein_log desc"; 

$result = mysql_query($sql); 

echo "<table id=\"userlog\" class=\"tablesorter\" cellspacing=\"1\"> 
<thead> 
<tr> 
<th align=\"left\">Ip Address</th> 
<th align=\"left\">Date In</th> 
<th align=\"left\">Date Out</th> 
</tr> 
</thead>"; 
    echo "<tbody>"; 
while($row = mysql_fetch_array($result)) 
    { 

    echo "<tr>"; 
    echo "<td>" . $row['ip_log'] . "</td>"; 
    echo "<td>" . date('d/m/Y H:i:s',strtotime($row['datein_log'])) . "</td>"; 
    echo "<td>" . date('d/m/Y H:i:s',strtotime($row['dateout_log'])) . "</td>"; 
    echo "</tr>"; 

    } 
    echo"</tbody>"; 
echo "</table>"; 


mysql_close($con); 
?> 
<div id="pager" class="pager"> 
    <form> 
     <img src="css/blue/first.png" class="first"/> 
     <img src="css/blue/prev.png" class="prev"/> 
     <input type="text" class="pagedisplay"/> 
     <img src="css/blue/next.png" class="next"/> 
     <img src="css/blue/last.png" class="last"/> 
     <select class="pagesize"> 
      <option selected="selected" value="10">10</option> 
      <option value="20">20</option> 
      <option value="30">30</option> 
      <option value="40">40</option> 
     </select> 
    </form> 
</div> 
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> 
<script type="text/javascript" src="js/jquery.tablesorter.min.js"></script> 
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script> 
<link href="css/blue/style.css" rel="stylesheet" type="text/css" /> 
     <script> 
     $(function() { 
     $("#userlog") 
      .tablesorter({widthFixed: true, widgets: ['zebra']}) 
      .tablesorterPager({container: $("#pager")}); 
    }); 

     </script> 

,这是我从调用它的页面。

userlog.php

<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","getuserlog.php?q="+str,true); 
xmlhttp.send(); 
} 
</script> 

<div class="spacer"></div> 
<div class="userlogTxt">This report shows all users who have logged in up until: <?php echo date("d/m/Y H:i:s"); ?></div> 
     <br /> 
     <?php 
      $conn = mysql_connect('localhost', 'root', '') or die(mysql_error()); 

      mysql_select_db("sample") or die(mysql_error()); 

      $result2 = mysql_query('SELECT * FROM user_usr ORDER BY name_usr ASC', $conn); 
      echo '<select name="users" onchange="showUser(this.value)">'; 
      echo '<option value="selected">'. 'Select a user' . '</option>'; 
      while ($row = mysql_fetch_assoc($result2)) 
      { 

      echo '<option value="'.$row['id_usr'].'">'.$row['name_usr'].'</option>'; 
      } 
      echo '</select>'; 
     ?> 
    <br /><br /> 
<div id="txtHint" class="userlogTxt">Logging information will be shown here.</div></div> 

@inti

它不拉从DB的任何日期。只是显示标题和寻呼机。

userlog.php

<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> 
<script type="text/javascript" src="js/jquery.tablesorter.min.js"></script> 
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script> 
<link href="css/blue/style.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript">  
    function showUser(str)  
     { 
      $.get("getuserlog.php?q="+str,function(response) { 
       $("#txtHint").html(response); 
      // Tablesorter will run, just after you loaded the ajax response    
      $("#userlog").tablesorter({widthFixed: true, widgets: ['zebra']}) 
      .tablesorterPager({container: $("#pager") 
      });   
       });  
     } 
</script> 

<div class="spacer"></div> 
<div class="userlogTxt">This report shows all users who have logged in up until: <?php echo date("d/m/Y H:i:s"); ?></div> 
     <br /> 
     <?php 
      $conn = mysql_connect('localhost', 'root', '') or die(mysql_error()); 

      mysql_select_db("sample") or die(mysql_error()); 

      $result2 = mysql_query('SELECT * FROM user_usr ORDER BY name_usr ASC', $conn); 
      echo '<select name="users" onchange="showUser(this.value)">'; 
      echo '<option value="selected">'. 'Select a user' . '</option>'; 
      while ($row = mysql_fetch_assoc($result2)) 
      { 

      echo '<option value="'.$row['id_usr'].'">'.$row['name_usr'].'</option>'; 
      } 
      echo '</select>'; 
     ?> 
    <br /><br /> 
<div id="txtHint" class="userlogTxt">Logging information will be shown here.</div></div> 

getuserlog.php

<?php 
$q=$_GET["q"]; 

$con = mysql_connect('localhost', 'root', ''); 
if (!$con) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("sample", $con); 

$sql="SELECT * FROM logger_log WHERE idusr_log = '".$q."' order by datein_log desc"; 

$result = mysql_query($sql); 

echo "<table id=\"userlog\" class=\"tablesorter\" cellspacing=\"1\"> 
<thead> 
<tr> 
<th align=\"left\">Ip Address</th> 
<th align=\"left\">Date In</th> 
<th align=\"left\">Date Out</th> 
</tr> 
</thead>"; 
    echo "<tbody>"; 
while($row = mysql_fetch_array($result)) 
    { 

    echo "<tr>"; 
    echo "<td>" . $row['ip_log'] . "</td>"; 
    echo "<td>" . date('d/m/Y H:i:s',strtotime($row['datein_log'])) . "</td>"; 
    echo "<td>" . date('d/m/Y H:i:s',strtotime($row['dateout_log'])) . "</td>"; 
    echo "</tr>"; 

    } 
    echo"</tbody>"; 
echo "</table>"; 


mysql_close($con); 
?> 
<div id="pager" class="pager"> 
    <form> 
     <img src="css/blue/first.png" class="first"/> 
     <img src="css/blue/prev.png" class="prev"/> 
     <input type="text" class="pagedisplay"/> 
     <img src="css/blue/next.png" class="next"/> 
     <img src="css/blue/last.png" class="last"/> 
     <select class="pagesize"> 
      <option selected="selected" value="10">10</option> 
      <option value="20">20</option> 
      <option value="30">30</option> 
      <option value="40">40</option> 
     </select> 
    </form> 
</div> 

我在哪里出了错?感谢

回答

0

我建议你,在userlog.php使用jQuery的Ajax的功能,而且由于内部getuserlog.php剧本是恒定的,它移动到userlog.php,像这样:

<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> 
<script type="text/javascript" src="js/jquery.tablesorter.min.js"></script> 
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script> 
<link href="css/blue/style.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript"> 
    function showUser(str) 
    { 
     $.get("getuserlog.php?q="+str,function(response) { 
      $("#txtHint").html(response); 
      // Tablesorter will run, just after you loaded the ajax response 
      $("#userlog").tablesorter({widthFixed: true, widgets: ['zebra']}) 
         .tablesorterPager({container: $("#pager")}); 
     }); 
    } 
</script> 

编辑:将所有你在主页面的JavaScript。 ajax响应应该只包含你想从服务器获得的数据。

+0

嗨。感谢您的回复。你建议只有一个文件:userlog.php。谢谢 – ploppy 2011-06-02 12:17:34

+0

不,你需要'getuserlog.php',但只在主页面'userlog.php'中使用javascript。 – aorcsik 2011-06-02 12:22:55

+0

请查看更新后的代码,并告诉我我哪里出错了。谢谢 – ploppy 2011-06-02 13:19:36