JQuery - AJAX - 单击Div显示与ID相关的SQL数据

时间:2016-11-22 14:44:34

标签: javascript php jquery html ajax

我正在尝试在屏幕上向用户动态显示有用的注释。

如果你转到http://discovertheplanet.net/general_notes.php

左边的列表是我的Notes表中有多少行。

我的数据库中有三列,' NoteID ',' NoteName '和' 注意'

每个' NoteName '从数据库中提取并使用' NoteID '来获取ID。数据库中的列

PHP / HTML:

<div class="main-container-notes">
    <div id="left-box">
        <?php 

        echo "<div style='width: 100%;'>";

        while( $noteName = sqlsrv_fetch_array( $resultNotes, SQLSRV_FETCH_ASSOC)) 
        {
            echo "<div class='hvr-bounce-to-right1 hover-cursor output' data-noteid='{$noteName['NoteID']}' style='width: 100%; border-right: 5px solid #00AA88; height: 50px;'>" . $noteName['NoteName'] . "</div>";
        }

        echo "</div>";
        ?>
    </div>
    <div id="right-box">

    <!-- Where the actual full note description will go -->

    </div>
</div>

我当前的脚本:位于<script type="text/javascript" src="scripts/scripts.js"></script>

看起来像:

$(".output").click(function() {
    var noteid = $(this).data("noteid");
    $("#right-box").load("connectionDetails.php", { noteid: noteid });
});

修改

这是我的connectionDetails.php:

<?php
$myServer = "replacement";
$connectionInfo = array('Database' => 'DiscoverThePlanet', 'UID' => 'replacement', 'PWD' => 'replacement');

//connection to the database
$conn = sqlsrv_connect($myServer, $connectionInfo)
  or die("Couldn't connect to SQL Server on $myServer"); 

//Test connection to server
// if ($conn) 
// {
//     echo "connection successful";    # code...
// }

//Defining my queries
$getNotes = "SELECT NoteID, NoteName, Note FROM Notes";
$getTemplateNotes = "SELECT TemplateNoteID, TemplateNoteName, TemplateNote FROM TemplateNotes";
$getReplaceVariables = "SELECT ReplaceVariableID, ReplaceVariableName, ReplaceVariableNote FROM ReplaceVariables";

$resultNotes = sqlsrv_query( $conn, $getNotes );
$resultTemplate = sqlsrv_query($conn, $getTemplateNotes);
$resultVariables = sqlsrv_query($conn, $getReplaceVariables);

if( $resultNotes === false) 
{
    die( print_r( sqlsrv_errors(), true) );
}
if( $resultTemplate === false) 
{
    die( print_r( sqlsrv_errors(), true) );
}

if( $resultVariables === false) 
{
    die( print_r( sqlsrv_errors(), true) );
}

?>

不确定它是否会影响任何东西,但我也包括这样的

<?php include 'connectionDetails.php'; ?>

所以我是正确的,因为我是新手,我现在如何使用我的ID,来完成&#39; Note&#39; 点击相应Div上的列?

示例:我点击了&#39;测试笔记&#39;如果 NoteID 为1,则会检查 Note#1 NoteID 1 并通过&#39;这是在我的右侧容器中显示在同一屏幕上的有用文本的测试文件&#39;

我希望我已经解释得这么好,如果您需要更多信息,请问问。

非常感谢提前!

1 个答案:

答案 0 :(得分:0)

我认为按照自己的方式进行ajax调用很简单 试试这个:

$(".output").click(function() {
    var noteid = $(this).data("noteid");

    $.get("connectionDetails.php?id="+noteid, function(data, status){
    $("#right-box").html(data);

});

});

在你的php代码中尝试$_GET['id'];来获取noteid值