如何使用jquery,PHP在不刷新页面的情况下显示数据库中的数据

时间:2013-06-21 22:46:41

标签: php jquery

无论如何都要将新插入的行加载到数据库而不使用jQuery刷新页面?我可以将数据发送到数据库而无需使用jquery刷新,但我仍然坚持在不刷新页面的情况下显示数据。如何在不刷新页面的情况下显示表中的数据,并将其显示在index.php中的表中,我必须显示检索到的数据?谢谢

这是我的index.php

<html>
        <head>
            <script src="jquery.js" type="text/javascript"></script>
            <script type="text/javascript">
            $(document).ready(function(){
            $('#submit').click(function(){
            $.ajax({
            type: "POST",

            url: 'send.php',
            data: "user=" + $('#user').val() + "&comment=" + $('#comment').val(),
            success: function(data){

            $('input[type=text]').val('')
            $('#status').html(data);

            }

            });
            });
            });
            </script>
                            </head>
                     <body>
                      <div>
        <input type="text" name="user" id="user">
        <input type="text" name="comment" id="comment">
        <input name="submit"  type="submit" id="submit">

        <div id="status"></diV>
        </div>
        <br>


        <?php
       $con=mysqli_connect("localhost","root","","user");
        // Check connection
        if (mysqli_connect_errno())
      {
      echo "Failed to connect to MySQL: " . mysqli_connect_error();
      }

        $result = mysqli_query($con,"SELECT * FROM comments");

    echo "<table  width='640' >
    <tr>

    </tr>";

    while($row = mysqli_fetch_array($result))
      {
      echo "<tr >";
      echo "<td  style='vertical-align:text-top'>" . $row['user'] . "</td>";

      echo "<td><br><br><br>" . wordwrap($row['comment'], 90, '<br>',true) . "</td>";
      echo "</tr>";
      }
    echo "</table>";

    mysqli_close($con);
    ?> 

这是我的send.php,它将数据提交给表格。

<?php
                $mysqli = new mysqli("localhost", "root", "", "user");
                    if ($mysqli->connect_errno) {
                    echo "Failed to connect to MySQL: (" . $mysqli->connect_errno . ") " . $mysqli->connect_error;
                }

                $username = $_POST["user"];
                $comment = nl2br($_POST['comment']);
                $stmt = $mysqli->prepare("INSERT INTO comments (user, comment) VALUES (?,?)");
                $stmt->bind_param('ss', $username, $comment);
                $stmt->execute();

                echo"comment posted successfully";

                ?>

3 个答案:

答案 0 :(得分:2)

这是使用JQuery AJAX和php从mysql数据库中获取数据的简短示例。 JQuery AJAX允许我们在不重新加载页面的情况下更新页面内容:

http://openenergymonitor.org/emon/node/107

http://viralpatel.net/blogs/jquery-ajax-tutorial-example-ajax-jquery-development/

答案 1 :(得分:0)

您应该在ajax请求的成功回调函数中使用jquery将新注释附加到表中。

追加:

$("table").append("<tr><td style='vertical-align:text-top'>"+$('#user').val()+"</td><td><br><br><br>"+$('#comment').val()+"</td></tr>");

将要添加的内容保留在一行代码中,并确保在将它们包含到追加字符串之前不清除#user和#comment的值。

答案 2 :(得分:0)

make send.php会将您加载新插入行所需的数据发回给您。

假设您插入了一条评论为“Hello world”的评论。如果没有出错,send.php可以,例如,回显注释的内容(在这种情况下是Hello world),你可以在success函数中使用它(来自data参数)。

查看this question中的第一个答案,可能会有用。