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 Matlab怎么求解含参的二重积分?
    • ¥15 苹果手机突然连不上wifi了?
    • ¥15 cgictest.cgi文件无法访问
    • ¥20 删除和修改功能无法调用
    • ¥15 kafka topic 所有分副本数修改
    • ¥15 小程序中fit格式等运动数据文件怎样实现可视化?(包含心率信息))
    • ¥15 如何利用mmdetection3d中的get_flops.py文件计算fcos3d方法的flops?
    • ¥40 串口调试助手打开串口后,keil5的代码就停止了
    • ¥15 电脑最近经常蓝屏,求大家看看哪的问题
    • ¥60 高价有偿求java辅导。工程量较大,价格你定,联系确定辅导后将采纳你的答案。希望能给出完整详细代码,并能解释回答我关于代码的疑问疑问,代码要求如下,联系我会发文档