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 如何用Labview在myRIO上做LCD显示?(语言-开发语言)
    • ¥15 Vue3地图和异步函数使用
    • ¥15 C++ yoloV5改写遇到的问题
    • ¥20 win11修改中文用户名路径
    • ¥15 win2012磁盘空间不足,c盘正常,d盘无法写入
    • ¥15 用土力学知识进行土坡稳定性分析与挡土墙设计
    • ¥70 PlayWright在Java上连接CDP关联本地Chrome启动失败,貌似是Windows端口转发问题
    • ¥15 帮我写一个c++工程
    • ¥30 Eclipse官网打不开,官网首页进不去,显示无法访问此页面,求解决方法
    • ¥15 关于smbclient 库的使用