dtt83024 2014-10-08 19:54
浏览 47

如何使用PHP的JQuery AJAX动态加载MySQL的数据?

I will try to describe as simple as possible what I am trying to achieve with my code. I am new with JQuery AJAX and all the examples online confuse me since they're all using Forms which i'm not using at all. Here is my fiddle to have a better understanding of what I'm doing: http://jsfiddle.net/x4d6jqxe/

I have 3 files : map.php , display_desk.php and display_station.php

When map.php is loaded (everything will be shown here) I want it call display_desk.php (this script creates DIVs to show small boxes on screen at XY coordinate thats being read from the database). When a DIV from display_desk.php is clicked, it will then open another DIV with information inside by the use of of a JQuery toggle function which is shown below.

Now, how do I make these JQuery AJAX calls for these scripts? If anything gets updated/deleted/inserted etc in my database I want it to appear LIVE on screen for all of these scripts.

thanks in advance!

map.php

<script type="text/javascript">
    /*I tried multiple examples like this but don't work...*/               
$(document).ready(function(){
$.ajax({
        type: "GET",
      url: "display_desk.php"
    }).done(function(data){
    alert(data);
}).fail(function(jqXHR, textStatus, errorThrown) {
alert(textStatus);
});

 /*I use this function to toggle the station_info DIV that I want it to call display_station.php */
    $(".desk_box").click( function() {
     $(".station_info").hide();   
    $("#station_info"+ $(this).attr('data') ).show();
    });

 </script>

**display_desk.php I want it to be called as soon that map.php is loaded **

<?php
include 'db_conn.php';

    //query to get X,Y coordinates from DB for the DESKS
$desk_coord_sql = "SELECT coordinate_id, x_coord, y_coord FROM coordinates";
$desk_coord_result = mysqli_query($conn,$desk_coord_sql);

//see if query is good
if($desk_coord_result === false) {
    die(mysqli_error()); 
}

//didsplay Desk stations in the map
        while($row = mysqli_fetch_assoc($desk_coord_result)){   
        //naming X,Y values
        $id    = $row['coordinate_id'];
        $x_pos = $row['x_coord'];
        $y_pos = $row['y_coord'];
        //draw a box with a DIV at its X,Y coord     
        echo "<div class='desk_box' data='".$id."' style='position:absolute;left:".$x_pos."px;top:".$y_pos."px;'>id:".$id."</div>";
                } //end while loop for desk_coord_result

 mysqli_close($conn);
?>

display_station.php I want it to load LIVE data when being clicken on with the toggle function above

<?php
include 'db_conn.php';
//query to show workstation/desks information from DB for the DESKS
$station_sql = "SELECT coordinate_id, x_coord, y_coord, section_name FROM coordinates";
$station_result = mysqli_query($conn,$station_sql);

//see if query is good
if($station_result === false) {
    die(mysqli_error()); 
}


//Display workstations information in a hidden DIV that is toggled
    while($row = mysqli_fetch_assoc($station_result)){
        //naming values
        $id       = $row['coordinate_id'];
        $x_pos    = $row['x_coord'];
        $y_pos    = $row['y_coord'];
        $sec_name = $row['section_name'];
        //display DIV with the content inside
echo "<div class='station_info' id='station_info".$id."' style='position:absolute;left:".$x_pos."px;top:".$y_pos."px;'>Hello the id is:".$id."</br>Section:".$sec_name."</br></div>";
            }//end while loop for station_result
   mysqli_close($conn);
  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 素材场景中光线烘焙后灯光失效
    • ¥15 请教一下各位,为什么我这个没有实现模拟点击
    • ¥15 执行 virtuoso 命令后,界面没有,cadence 启动不起来
    • ¥50 comfyui下连接animatediff节点生成视频质量非常差的原因
    • ¥20 有关区间dp的问题求解
    • ¥15 多电路系统共用电源的串扰问题
    • ¥15 slam rangenet++配置
    • ¥15 有没有研究水声通信方面的帮我改俩matlab代码
    • ¥15 ubuntu子系统密码忘记
    • ¥15 保护模式-系统加载-段寄存器