Php onclick->；mysql查询->；javascript；同一页

我需要一个按钮来开始mysql查询，然后将结果插入JavaScript代码块，该代码块将显示在按钮所在的页面上。mysql查询来自下拉菜单的值

Homepage.php包含

two drop down menus

div id='one' to hold the results javscript code block

a button to stimulate the mysql query to be displayed in div id ='one' through Javascript

flow of the process is as such
1. user chooses an option from each drop down
2. when ready, the user clicks a button
3. the onclick runs a mysql query with selections from the drop down menu.
4. send the results as array from the mysql query into the javascript code block
5. display the results in div id ='one'

所有这些都需要在同一页上发生

我遇到的问题是，页面一加载，javascipt就是静态的。我无法将mysql结果推送到我需要它出现的页面上的javascript中。将所有内容放在同一页上会带来麻烦

我不是在寻找为我制定的确切代码，而是应该用来实现这一点的正确流程。提前谢谢你

我试过了

使用两个下拉菜单调用使用httprequest的同一javascript函数。该函数指向执行mysql处理的php页面。然后通过httprequest将结果返回到主页

---

我尝试将整个Javascript代码块保存为一个php变量，其中已经包含mysql结果，然后通过HTTPRequest将该变量返回到主页，我认为可以通过这种方式创建动态Javascript代码。没有任何效果

您需要使用一种称为AJAX的技术。我建议使用

.ajax（）

方法。尝试做原始XHR充其量是痛苦的

以下是您希望如何构造代码：

加载页面

用户选择一个选项

onChange侦听器触发AJAX请求

服务器接收并处理请求

服务器为依赖的select返回一个JSON选项数组

客户端AJAX发送方返回响应

客户端更新select以获得JSON数组中的值

---

基本上，HTTP是无状态的，所以一旦加载了页面，就完成了。您必须连续向服务器请求动态数据。

您需要使用一种称为AJAX的技术。我建议使用

.ajax（）

方法。尝试做原始XHR充其量是痛苦的

以下是您希望如何构造代码：

加载页面

用户选择一个选项

onChange侦听器触发AJAX请求

服务器接收并处理请求

服务器为依赖的select返回一个JSON选项数组

客户端AJAX发送方返回响应

客户端更新select以获得JSON数组中的值

基本上，HTTP是无状态的，所以一旦加载了页面，就完成了。您必须连续向服务器请求动态数据。

使用AJAX

范例

$.ajax({
    type: "POST",
    url: "yourpage.php",
    data: "{}",
    success: function(result) {
        if(result == "true") {
            // do stuff you need like populate your div
            $("#one").html(result);               
        } else {
            alert("error");
        }
    }
});

使用AJAX

范例

$.ajax({
    type: "POST",
    url: "yourpage.php",
    data: "{}",
    success: function(result) {
        if(result == "true") {
            // do stuff you need like populate your div
            $("#one").html(result);               
        } else {
            alert("error");
        }
    }
});

---

为此，您需要学习ajax。它用于在不重新加载页面的情况下发出请求。这样您就可以对mysql进行后台调用

你的代码应该是这样的

$("#submitbutton").live("click",function(){

$.ajax({url:"yourfile"},data:{$(this).data}).done(function(data){
//this data will in json form so decode this and use this in div 2
var x =$.parseJSON(data);
$("#div2").html(x.val());
})
})

---

而

“yourfile”

是连接到服务器并发出数据库请求的主文件

为此，您需要学习ajax。它用于在不重新加载页面的情况下发出请求。这样您就可以对mysql进行后台调用

你的代码应该是这样的

$("#submitbutton").live("click",function(){

$.ajax({url:"yourfile"},data:{$(this).data}).done(function(data){
//this data will in json form so decode this and use this in div 2
var x =$.parseJSON(data);
$("#div2").html(x.val());
})
})

---

而

“yourfile”

是连接到服务器并发出数据库请求的主文件

以下是我如何使用onchange方法来激发MYSQL查询并让Highchart显示结果。主要的问题是返回的JSON数组是一个需要转换为INT的字符串。resultArray变量随后用于highChart的data:部分

$(function(){
  $("#awayTeam").change(function(){ 
    $.ajax({
    type: "POST",    
    data: "away=" + $("#awayRunner").val(),
    dataType: "json",
    url: "/getCharts.php",
    success: function(response){
          var arrayLength = response.length;
          var resultArray = [];
          var i = 0;
          while(i<arrayLength){
              resultArray[i] = parseInt(response[i]);
              i++;
          }            

$（函数（）{
$（“#awayTeam”）.change（function（）{
$.ajax({
类型：“POST”，
数据：“away=“+$（“#awayRunner”）.val（），
数据类型：“json”，
url:“/getCharts.php”，
成功：功能（响应）{
var arrayLength=响应长度；
var resultArray=[]；
var i=0；
而（i以下是我如何使用onchange方法来激发MYSQL查询并让Highchart显示结果。主要问题是返回的JSON数组是一个需要转换为INT的字符串。resultArray变量随后用于Highchart的data:部分

$(function(){
  $("#awayTeam").change(function(){ 
    $.ajax({
    type: "POST",    
    data: "away=" + $("#awayRunner").val(),
    dataType: "json",
    url: "/getCharts.php",
    success: function(response){
          var arrayLength = response.length;
          var resultArray = [];
          var i = 0;
          while(i<arrayLength){
              resultArray[i] = parseInt(response[i]);
              i++;
          }            

$（函数（）{
$（“#awayTeam”）.change（function（）{
$.ajax({
类型：“POST”，
数据：“away=“+$（“#awayRunner”）.val（），
数据类型：“json”，
url:“/getCharts.php”，
成功：功能（响应）{
var arrayLength=响应长度；
var resultArray=[]；
var i=0；
虽然（我试过什么？如果我理解正确，标准Ajax应该可以做你想做的事情，包括在页面上添加一块JavaScript代码。在页面更新后，你可能需要做更多的工作才能让DOM正常工作，但问题是你是否已经达到了这个阶段。更新了b你尝试过什么？如果我正确理解了这个问题，标准Ajax应该可以做你想做的事情，包括在页面上添加JavaScript代码块。在页面更新后，你可能需要做更多的工作来让DOM正常工作，但问题是你是否已经达到了这个阶段。用wha更新了这个问题它已经被试过了