无需刷新页面即可从数据库重新加载数据

时间:2017-06-03 17:55:20

标签: javascript php jquery html ajax

我的Ajax成功更新了数据库中的一些信息,因此他应该更新一个显示此信息的元素。但事实并非如此。但是,刷新页面后,会导致重新连接到db,信息更新。这是功能:

function topUpTheBalance(){
        var d = document.getElementById("numberForm").value;
        $.ajax({
        type: 'POST',
        url: 'handler.php',
        data: {
            'topUpBalance':d,
        },
        success: function () {
            var k = document.getElementById("balanceNumber");
            k.innerHTML ="Your balance: "+ <?php echo $userRow['userBalance']; ?>;
        }
        }
        );
    }

和handler.php

<?php 
    ob_start();
    session_start();
    require_once 'dbconnect.php';

    if( !isset($_SESSION['user']) ) {
    header("Location: index.php");
     exit;
    }
    $res=mysqli_query($link, "SELECT * FROM users WHERE userId=".$_SESSION['user']);
    $userRow=mysqli_fetch_array($res);
    //$link =  mysqli_connect("localhost","username","password", "users");
    $bal = $userRow['userBalance']+$_POST['topUpBalance'];
    if($stmt = mysqli_prepare($link, "UPDATE users SET userBalance = ? WHERE userId = ?")){
            mysqli_stmt_bind_param($stmt, "di", $bal, $userRow['userId']);
            mysqli_stmt_execute($stmt);
            mysqli_stmt_bind_result($stmt, $result);
            mysqli_stmt_fetch($stmt);
            mysqli_stmt_close($stmt);
    }
    mysqli_close($link);
?>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
<?php ob_end_flush(); ?>

有人可以建议我如何在不刷新页面的情况下更新此信息吗?

3 个答案:

答案 0 :(得分:0)

问题是当你编写k.innerHTML =“string”+ php代码时,你试图在客户端运行php 您应该在您请求的php文件中生成一个输出并检索该输出并将其放在此处。

https://www.w3schools.com/jquery/jquery_ajax_get_post.asp 该链接说明了如何通过POST将数据发送到服务器并通过GET从服务器获取数据。

答案 1 :(得分:0)

没有详细信息可以帮助您,但我注意到的第一件事就是您的AJAX调用,以获取您需要通过GET类型调用它的数据:

$.ajax({
    'url': 'getdata.php', 
    'type': 'GET',
    'dataType': 'json', 
    'data': {'topUpBalance':d}, 
    'success': function(data) {
      // if the request calls properly
    },
    'error': function(data) {
      // if the request fails.
    }
});

答案 2 :(得分:0)

主要的是你应该从php端抛出输出但你没有发送输出你应该使用isset($ _ POST ['topUpBalance'])然后转到其他进程例如: -

if(isset($_POST['topUpBalance'])){
     $res=mysqli_query($link, "SELECT * FROM users WHERE 
     userId=".$_SESSION['user']);
     $userRow=mysqli_fetch_array($res);
    $bal = $userRow['userBalance'] + $_POST['topUpBalance'];

   if($stmt = mysqli_prepare($link, "UPDATE users SET userBalance = ? 
     WHERE userId = ?")){
        mysqli_stmt_bind_param($stmt, "di", $bal, $userRow['userId']);
        mysqli_stmt_execute($stmt);
        mysqli_stmt_bind_result($stmt, $result);
       //Send output echo ...... ;
        mysqli_stmt_fetch($stmt);
        mysqli_stmt_close($stmt);
      }
       mysqli_close($link);
}

在jquery方面: - 使用参数

接收数据
function topUpTheBalance(){
    var d = document.getElementById("numberForm").value;
    $.ajax({
    type: 'POST',
    url: 'handler.php',
    data: {
        'topUpBalance':d,
    },
    success: function (data) {
     // use sent data or unsent data for processing  
    }
    }
    );
}