我在更新数据库中显示的数据时遇到问题。最初，当页面打开时，我显示与当前日期对应的日期，但用户可以通过在文本框中输入日期来更改日期，当他点击更新时，应删除所有显示的数据，并删除与新日期对应的数据应该显示。现在我有一个javascript函数，它在单击按钮时删除了div中的所有数据。 div保存我想要更改的数据。但我不知道如何将新数据添加到div中。我试图添加php代码来查找数据库中的javascript函数中的数据，但我不知道如何将它添加到文本框中。
function changedate()
{
document.getElementById("label1").innerText=document.getElementById("datepicker").valu e;
document.getElementById("selecteddate").innerText=document.getElementById("datepicker" ).value;
document.getElementById("teammembers").innerHTML = "";//empties the div(teammembers)
<?php
$con=mysqli_connect("localhost","*****","*****","*****");
$result = mysqli_query($con,"SELECT * FROM users");
while($row = mysqli_fetch_array($result))
{
if(trim($user_data['email'])!=trim($row['email']))
{
$email_users = $row['email'];
//I want to first show this email but I don't know how to add it to the div.
}
}
?>
}
答案 0 :(得分：0)
您可以使用jQuery和AJAX的组合来执行此操作。比听起来简单得多。要确定这是您的正确答案，just view this example。
在下面的示例中，有两个.PHP文件：test86a.php和test86b.php。
第一个文件86A有一个简单的选择（下拉列表）框和一些监视该选择框要更改的jQuery代码。要触发jQuery代码，您可以使用jQuery .blur()函数来监视用户保留日期字段，或者您可以使用jQueryUI API：
$('#date_start').datepicker({
onSelect: function(dateText, instance) {
// Split date_finish into 3 input fields
var arrSplit = dateText.split("-");
$('#date_start-y').val(arrSplit[0]);
$('#date_start-m').val(arrSplit[1]);
$('#date_start-d').val(arrSplit[2]);
// Populate date_start field (adds 14 days and plunks result in date_finish field)
var nextDayDate = $('#date_start').datepicker('getDate', '+14d');
nextDayDate.setDate(nextDayDate.getDate() + 14);
$('#date_finish').datepicker('setDate', nextDayDate);
splitDateStart($("#date_finish").val());
},
onClose: function() {
//$("#date_finish").datepicker("show");
}
});
无论如何，当触发jQuery时，AJAX请求被发送到第二个文件86B。此文件自动查找数据库中的内容，获取答案，创建一些格式化的HTML内容，并echo将其返回到第一个文件。这一切都是通过Javascript实现的，在浏览器上启动 - 就像你想要的那样。
这两个文件是一个独立的，完全有效的例子。只需用您自己的字段名等替换MYSQL登录和内容，并观察魔术的发生。
TEST86A.PHP
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
//alert('Document is ready');
$('#stSelect').change(function() {
var sel_stud = $(this).val();
//alert('You picked: ' + sel_stud);
$.ajax({
type: "POST",
url: "test86b.php", // "another_php_file.php",
data: 'theOption=' + sel_stud,
success: function(whatigot) {
//alert('Server-side response: ' + whatigot);
$('#LaDIV').html(whatigot);
$('#theButton').click(function() {
alert('You clicked the button');
});
} //END success fn
}); //END $.ajax
}); //END dropdown change event
}); //END document.ready
</script>
</head>
<body>
<select name="students" id="stSelect">
<option value="">Please Select</option>
<option value="John">John Doe</option>
<option value="Mike">Mike Williams</option>
<option value="Chris">Chris Edwards</option>
</select>
<div id="LaDIV"></div>
</body>
</html>
TEST86B.PHP
<?php
//Login to database (usually this is stored in a separate php file and included in each file where required)
$server = 'localhost'; //localhost is the usual name of the server if apache/Linux.
$login = 'abcd1234';
$pword = 'verySecret';
$dbname = 'abcd1234_mydb';
mysql_connect($server,$login,$pword) or die($connect_error); //or die(mysql_error());
mysql_select_db($dbname) or die($connect_error);
//Get value posted in by ajax
$selStudent = $_POST['theOption'];
//die('You sent: ' . $selStudent);
//Run DB query
$query = "SELECT `user_id`, `first_name`, `last_name` FROM `users` WHERE `first_name` = '$selStudent' AND `user_type` = 'staff'";
$result = mysql_query($query) or die('Fn test86.php ERROR: ' . mysql_error());
$num_rows_returned = mysql_num_rows($result);
//die('Query returned ' . $num_rows_returned . ' rows.');
//Prepare response html markup
$r = '
<h1>Found in Database:</h1>
<ul style="list-style-type:disc;">
';
//Parse mysql results and create response string. Response can be an html table, a full page, or just a few characters
if ($num_rows_returned > 0) {
while ($row = mysql_fetch_assoc($result)) {
$r = $r . '<li> ' . $row['first_name'] . ' ' . $row['last_name'] . ' -- UserID [' .$row['user_id']. ']</li>';
}
} else {
$r = '<p>No student by that name on staff</p>';
}
//Add this extra button for fun
$r = $r . '</ul><button id="theButton">Click Me</button>';
//The response echoed below will be inserted into the
echo $r;
以下是a more simple AJAX example，但another example可供您查看。
在所有示例中，请注意用户如何提供HTML内容（无论是通过键入内容还是选择新的日期值或选择下拉选项）。用户提供的数据是：
1）通过jQuery GRABBED：var sel_stud = $('#stSelect').val();
2）然后通过AJAX发送到第二个脚本。 （$.ajax({})东西）
第二个脚本使用它收到的值来查找答案，然后回答第一个脚本的ECHOES：echo $r;
第一个脚本在AJAX成功函数中接收答案，然后（仍然在成功函数内）将答案输入页面：$('#LaDIV').html(whatigot);
请尝试使用这些简单的示例 - 第一个（更简单的）链接示例不需要数据库查找，因此它应该无需更改即可运行。
答案 1 :(得分：0)
你想输出一个文字JS语句，包括你从php得到的任何东西，基本上：
document.getElementById("teammembers").innerHTML = // notice no erasing, we just
// overwrite it directly with the result
"<?php
$con=mysqli_connect("localhost","*****","*****","*****");
$result = mysqli_query($con,"SELECT * FROM users");
while($row = mysqli_fetch_array($result))
{
if(trim($user_data['email'])!=trim($row['email']))
{
$email_users = $row['email'];
//I want to first show this email but I don't know how to add it to the div.
// so just show it!
echo $email_users; // think about this for a second though
// what are you trying to achieve?
}
}
?>"
答案 2 :(得分：-1)
这是一个很大的问题，不是很具体。查看有关AJAX请求的更多信息 - 基本上从javascript中，您将调用检索数据的服务器。 这是javascript库jQuery的一个片段：
$.ajax({
type: "POST",
url: "emails.php",
data: { user: "John" }
}).done(function( msg ) {
$('teammembers').html(msg);
});
希望这会给你一个起点