通过Ajax传递一个PHP变量来更新一个帧

Question

我有一个服务器端PHP页面，它从SQL数据库中绘制数据来填充一个PHP变量数组。我使用每个变量的最后一个数组值来初始填充数据到表单的第三帧（即value =）。这个表单有一个“上一个”和“下一个”的链接，我想用它来动态填充表单的第3帧，使用“前一个”或“下一个”变量值集（即value =）动态加载整个页面。虽然我非常熟悉javascript，php和sql，但这将是我第一次尝试使用AJAX。我想要做的是将数组或计数器，这是一个PHP变量，传递给AJAX函数，该函数增加或减少数组计数器（即$计数器），以便下一组变量的值出现在框架3的形式。我的问题是，我确信我可以将当​​前的$ counter值传递给AJAX函数，该函数将把它作为一个JavaScript变量处理，但是我怎样才能将结果传回来更新表单的第3帧中的php变量？任何帮助将非常感激。

Blacksquare：

我的php的网页做的第一部分。它从底层SQL数据库收集数据并将其放入一个php数组中。当网页最初加载时，最近或最后一条记录用于使用类似这样的内容（value = $ dataField [$ counter]）填充全部在单个框架中的表单域。这适用于页面最初加载时使用来自SQL数据库中最后一条记录的数据填充所有框架字段。我想要做的是创建一个AJAX函数，通过点击“下一个”或“前一个”链接（即一个onclick事件）来激活，该链接采用$ counter计数器值并将其增加或减少1（1），然后刷新同一帧中“下一个”或“前一个”php数组记录中的帧显示字段，而无需重新加载页面。

Answer 1

您需要创建一个php文件，它将处理ajax请求（将变量作为post参数传递）并在php文件中回显您的响应。

然后在ajax文件中，您将获得成功的响应，更新使用jQuery的响应到表单中。

注意：不要忘记在php文件中的响应之后放置'exit'。

例如：

$.post("test.php", { counter: <?php echo $counter; ?>}).done(function(data) { alert("Data Loaded: " + data); }); 

Answer 2

关于使用JavaScript你Ajax调用的结果后改变相应的HTML元素是什么？无需设置php变量，然后使用该字段在HTML中设置值，然后您可以直接使用JavaScript更改该HTML值。

Answer 3

您无法将变量传递回由php生成的静态页面。可能最好的方法是只加载页面加载时的表单。然后使用ajax调用服务器端的另一个php脚本获取动态数据（我使用jQuery作为ajax）。

$.ajax({ 
    type: "GET", 
    url: someURL, //A link to your php script that will load the data 
    dataType: "json" //Ask for json data from the server 
}).done(function(data) { 
    nextRecords = data; 
    getNextRecord(); 
}).fail(function(resp) { 
    console.log("Something Went Wrong"); 
}); 

移动你的SQL逻辑，在someURL进入一个单独的PHP脚本，有PHP传回JSON数据数组这样

$query = ...Your select query returning an array of results 
echo json_encode($query); 
exit; 

现在，当用户点击一个/上一个按钮，你可以轻松获取最新的记录而无需发布到服务器。

function getNextRecord() { 
    if (nextRecords.length > 0) { 
     var record = nextRecords.pop(); 
     var node = document.getElementById(node_name); 
     node.innerHTML = record; 
     if (currentRecord){    
      prevRecords.push(currentRecord); 
     } 
     currentRecord = record; 
    } 
} 

function getPreviousRecord() { 
    if (prevRecords.length > 0) { 
     var record = prevRecords.pop(); 
     var node = document.getElementById(node_name); 
     node.innerHTML = record; 
     if (currentRecord) {    
      nextRecords.push(currentRecord); 
     } 
     currentRecord = record; 
    } 
}