将Javascript变量传递给PHP，然后无需刷新即可重新加载页面
将Javascript变量传递给PHP，然后无需刷新即可重新加载页面
提问于 2017-09-20 03:52:48
通过Ajax向PHP发送javascript变量后，如何在不刷新的情况下重新加载页面。
下面是我正在创建的一个分析资产表现的网页的图像。
我尝试做的事情如下所示。
当用户使用图形中的选择测试块时，选择框将使用该特定测试块中的所有子测试进行更新。但是，我不想刷新页面。我已经设法通过ajax将选定的测试块发送到PHP代码，但在不刷新的情况下无法让ajax重新加载页面。
目前，当测试块被选中时，标签被返回给PHP并存储在$_SESSION' label‘变量中。然后在面板标题#subtest-chart-select中使用它。但是，标签在没有页面刷新的情况下不会更新，这是我想要避免的。
Ajax：
$("#test_block_chart").click(
function(evt){
var activePoints = myNewChart.getElementsAtEvent(evt);
if (activePoints[0]) {
var chartData = activePoints[0]['_chart'].config.data;
var idx = activePoints[0]['_index'];
var label = chartData.labels[idx];
//alert(label);
$.ajax(
{
url:'test_performance.php',
type: 'POST',
datatype: 'json',
data: {'label':label}, // post to location.php
success: function(label) {
// success
},
error: function(label) {
alert("There may an error on uploading. Try again later");
}
});
}
});
});`PHP：
session_start();
if(isset($_POST['label']))
{
$_SESSION['label'] = $_POST['label'];
}PHP echo HTML
<?php
echo '<div class="row">
<div class="col-lg-12 subtest-select">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title" id="subtest-chart-select"><i class="fa fa-bar-chart-o fa-fw"></i>' . $_SESSION['label'] . ' Subtest Select </h3>
</div>
<select class="form-control">
<option>1</option>
</select>
</div>
</div>
</div>'
?>我仍然要编写PHP代码来更新所选测试块中的子测试的选项。
任何帮助都将非常感谢，因为我一直在努力让它永远工作。
回答 2
Stack Overflow用户
发布于 2017-09-20 04:10:57
dataType: 'text',在$.ajax()成功函数中，指定：
success: function(data) {
$('.inside_whereever_you_want_to_show_this').html(data);
}编辑：
要仅更新页面上的一个值，您可以执行以下操作：
a)在PHP中，只打印出这个值(这样整个页面就只有这个值)。
<?php echo $_SESSION['label']在HTML中，在你想要更新的位周围加一个跨度(避免在javascript中构造更长的字符串，所有常量部分都应该在HTML中)
<h3 class="panel-title" id="subtest-chart-select"><i class="fa fa-bar-chart-o fa-fw"></i><span class="subtest-updateable">' . $_SESSION['label'] . '</span> Subtest Select </h3>然后，您可以使用整个响应仅更新您需要的部分
success: function(data) {
$('.subtest-updateable').html(data);
}b)更好的(系统化的方法)是使用json response，你也可以返回更多的孤立变量：
Stack Overflow用户
发布于 2017-09-20 04:10:46
在您的成功函数中，您需要更新您想要更改的DOM部分。在PHP端，只需返回您的刀片、部分或您想要显示的任何HTML。
$(document).on('submit', 'form#form-grad', function (e) {
e.preventDefault();
var context = $(this);
var thisForm = context.closest('form');
$.ajax({
url: thisForm.attr('action'),
method: 'PUT',
data: thisForm.serialize(),
success: function (response) {
$('#updatearea').html(response.pt_html);
// Close grading form
}
});
return false;
}); 页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46308739
复制相关文章
相似问题
腾讯云开发者
