我在一个表中有一列按钮,声明如下:(文件索引.php)echo";然后,这个脚本读取点击按钮行中的数据,并将其发布到另一个php文件:
<!-- scripts that gets the lecturer chosen to SHOW functionality-->
<script>
$(document).ready(function(){
$(".show-button").click(function() {
var $row = $(this).closest("tr"); // Find the row
var names = $row.find(".name").text(); // Find the name
var surname = $row.find(".surname").text(); // Find the surname
$.ajax({ type: "POST", url: "show_lecturer.php", data: { x: names, y: surname} })
});
});
</script>
该文件(show_litecturer.php)将读取的数据存储在数据库的表(keep_track)中:(文件show_litecturer.php)
<?php
ob_start(); //eliminates buffer collisions
require_once('connect_db.php');
$name = $_POST['x'];
$surname = $_POST['y'];
$result = pg_query(connect(), "INSERT INTO keep_track VALUES ('$name', '$surname')");
?>
然后,我用jquery创建了一个空对话框,用从数据库中获取的数据填充它:(文件索引.php)
<!-- The following script generates the empty dialog box -->
<script src="/js/jquery.min.js"></script>
<link rel="stylesheet" href="/css/jquery-ui.css">
<script src="/js/jquery-ui.min.js"></script>
<script>
$(function() {
//show lecturer dialog
$("#show_dialog").dialog({autoOpen: false});
$(".show-button").on("click", function() {$("#show_dialog").dialog("open");});
});
</script>
然后从表keep_track中获取这些数据,并在上述对话框中进行响应:(文件索引.php)
$name; $surname;
require_once('connect_db.php');
$firstname = pg_query(connect(), "SELECT name FROM keep_track");
while($row = pg_fetch_array($firstname)){ $name = $row['path']." ".$row['name']; }
$lastname = pg_query(connect(), "SELECT surname FROM keep_track");
while($row = pg_fetch_array($lastname)){ $surname = $row['path']." ".$row['name']; }
echo '<div id="show_dialog" class="ui-dialog-content ui-widget-content">';
echo $name."".$surname;
echo '</div>';
?>
因此,当我点击x行的按钮时,会打开一个对话框,其中包含x行的数据。
唯一不能正常工作的是:当我单击按钮x时,它会打开一个对话框,但会显示一个值,但不会显示行x的值。然而,当我看到数据库时,行x存储在那里。复选框中的值是页面上最近一次刷新前单击的按钮的值。就好像我的一连串电话中有什么错误之类的(我想不通,这就是我问的原因)。
为了说明我得到的数据:(最初表keep_track为空)
Press button 1 -> row 1 stored, dialogbox has no content
Press button 2 -> row 2 stored, dialogbox has no content
Press button 3 -> row 3 stored, dialogbox has no content
Refresh page manually
Press button 4 -> row 4 stored, dialogbox has content from row 3
Press button 5 -> row 5 stored, dialogbox has content from row 3
Refresh page manually
Press button 6 -> row 6 stored, dialogbox has content from row 6
Press button 7 -> row 7 stored, dialogbox has content from row 3
我建议您通过JSON从POST返回数据。请注意,AJAX调用是异步的。所以你不知道什么时候会收到回复。因此,您需要使用ajax成功回调函数来处理结果。
</script>
$(document).ready(function(){
$(".show-button").click(function() {
var $row = $(this).closest("tr"); // Find the row
var names = $row.find(".name").text(); // Find the name
var surname = $row.find(".surname").text(); // Find the surname
do_post_and_show_info(names, surname);
});
});
function do_post_and_show_info(names, surname){
request= $.ajax({
type: "post",
cache: false,
url: "show_lecturer.php",
data: { x: names, y: surname} ,
dataType: "json",
});
request.done(function(json){
if (json.status =="ok"){
// DO YOUR THING!
Alert(json.data.names + " " + json.data.surnames);
}
else {
alert("Error! " + json.error + " : " + json.remarks);
}
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus + ":" + jqXHR.responseJSON);
});
}//do_post_and_show_info
</script>
我通常在PHP中返回这样的数据结构(所以在您的show_loducter.PHP中)
<?
// get your data before this in the variable $data
// put your status "OK" or "ERROR" in $status
// put some error info in $extraInfo
// of course some processing is involved, but here's a simple example
require_once('connect_db.php');
$name = $_POST['x'];
$surname = $_POST['y'];
$result = pg_query(connect(), "INSERT INTO keep_track VALUES ('$name', '$surname')");
// obviously you need to do some error checking, but here's the happy flow
$status = "OK";
$error = "";
$data['names'] = $name;
$data['surnames'] = $surname;
echo json_encode(array(
"status" => $status,
"error" => $error,
"remark" => $extraInfo,
"data" => $data
));
?>
请注意,这是我在编辑器中创建的一个示例,而不是在真正的工作设置中创建的。所以请试着理解它,而不是复制粘贴并运行它。
我在另一个文件中编写了对话框(div)的内容,并使用
$("#div").load("content.php", {x:parameter_1, y:parameter_2, ......});
而不是
$.ajax({ type: "POST", url: "show_lecturer.php", data: { x: names, y: surname} })
这就成功了。
现在div最初是不可见的并且是空的,但是一旦单击按钮,它就会请求加载content.php页面。由于我在请求内容时传递搜索参数,所以我得到了我想要的数据。
以前的问题是,当加载页面时,div是用数据创建的(尽管我没有点击任何按钮)。因此,当我点击一个按钮时,它会显示带有上次页面加载(上次刷新)内容的div。
为了让它发挥作用,我还必须做其他一些小的改变,但这是主要的想法。