Javascript 选择下拉列表时，Jquery/AJAX填充的HTML表单

我正在尝试在我的页面上填充表单。填充表单所需的信息是使用下拉选项的ID作为SQL语句中的ID从MySQL数据库中提取的。我想我可以将信息存储在$_SESSION['formBookings']中，在刷新时，这将填充表单（这已经发生了，因为我正在使用SESSION变量在提交后填充表单）

我无法将“提交”按钮附加到表单，因为我已经有了一个按钮，而老板不想要另一个。我希望表单最终在选择选项时自动刷新页面。如果SQL语句中的数据已存储在会话数组中，则将填充表单

以下是我到目前为止的情况：

JQuery：

<script>
$(document).ready(function(){
    $('select[name=recall]').on('change', function() {var recall = $(this).val() 
    //$(function () 
      //{
        //-----------------------------------------------------------------------
        // 2) Send a http request with AJAX http://api.jquery.com/jQuery.ajax/
        //-----------------------------------------------------------------------
        $.ajax({                                      
          url: 'recall.php',                  //the script to call to get data          
          data: "recall: recall",             //you can insert url argumnets here to pass to api.php
                                           //for example "id=5&parent=6"
          dataType: 'json',                //data format      
          success: function(data)          //on recieve of reply
          {
            var id = data[0];              //get id
            var vname = data[1];           //get name
            //--------------------------------------------------------------------
            // 3) Update html content
            //--------------------------------------------------------------------
            $('div#box1').load('DFBristol.html');//html("<b>id: </b>"+id+"<b> name: </b>"+vname); //Set output element html
            //recommend reading up on jquery selectors they are awesome 
            // http://api.jquery.com/category/selectors/
          //} 
          });
        });
      });
    });
</script>

$（文档）.ready（函数（）{
$（'select[name=recall]'）。在（'change'，function（）{var recall=$（this）.val（）上
//$（函数（）
//{
//-----------------------------------------------------------------------
//2）使用AJAX发送http请求http://api.jquery.com/jQuery.ajax/
//-----------------------------------------------------------------------
$.ajax（{
url:'recall.php'，//调用以获取数据的脚本
数据：“recall:recall”//您可以在此处插入url argumnets以传递给api.php
//例如“id=5，父项=6”
数据类型：“json”，//数据格式
成功：函数（数据）//收到回复时
{
var id=data[0]；//获取id
var vname=data[1]；//获取名称
//--------------------------------------------------------------------
//3）更新html内容
//--------------------------------------------------------------------
$（'div#box1'）.load（'DFBristol.html'）；//html（“id:+id+”name:+vname）；//设置输出元素html
//推荐阅读jquery选择器，它们非常棒
// http://api.jquery.com/category/selectors/
//} 
});
});
});
});

HTML：

<select name='recall' id='recall'>
                    <option selected></option>
                        <?php
                            session_start();
                            $user = 'root';
                            $pass = '';

                            $DBH = new PDO('mysql:host=localhost;dbname=nightlineDB;', $user, $pass);
                            $DBH->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
                            $DBH->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);

                            $recall = $DBH->prepare('SELECT * FROM bookings WHERE dateInputted >= now() - INTERVAL 2 DAY');
                            $recall->execute();
                            $recallResult = $recall->fetchALL(PDO::FETCH_ASSOC);

                            foreach ($recallResult as $key) {
                                echo '<option id='.$key["ID"].'>'.$key['ID'].' - '.$key['branch'].' - '.$key['title'].' '.$key['firstName'].' '.$key['lastName'].'</option>';
                            }
                        ?>
                    </select><br />

SQL文件（recall.php）：

---

快速浏览一下，您发布的代码似乎有两个问题：

AJAX请求
尽管
$.ajax（）
，但最好指定它。您的请求中还存在语法错误-您已使用
}关闭
成功
回调仅应为
}
的位置：

$.ajax({                                      
    url: "recall.php",
    data: {
        recall: recall
    },
    type: "GET",               // Declare type of request (we use GET, the default)
    dataType: "json",
    success: function(data)
    {
        var id = data[0];
        var vname = data[1];
        $('div#box1').load('DFBristol.html');
    }                         // The problematic closure
});

更好的方法是：不要使用不推荐的
jqXHR.success（）
函数，而是使用
.done（）
promise对象，即：

$.ajax({                                      
    url: "recall.php",
    data: {
        recall: recall
    },
    type: "GET",               // Declare type of request (we use GET, the default)
    dataType: "json"
}).done(function() {
    // Success
    var id = data[0],
        vname = data[1];
    $('div#box1').load('DFBristol.html');
});

修复文件
recall.php
当您向
recall.php
发出AJAX GET请求时，该文件需要知道您想要传递哪些变量，这些变量尚未定义。您可以使用
$\u GET[]
（）来完成此操作，即：

你好，特里，谢谢你的快速回复。我无法让您的代码执行任何操作。如果没有提交按钮，GET如何接收任何内容？但是，目前我已经做了您建议的更改，#box1 div没有被填充。我意识到您的
数据
应该是
“recall:”+recall“
因为您正在传递一个变量。AJAX不需要处理表单提交。检查浏览器控制台。您看到了哪些错误消息？也检查您的HTTP头，看看是否正确引用/调用了
recall.php
文件。我已经对其进行了调整，但没有发现任何错误，控制台中没有错误，地址栏也没有对recall.php的任何引用。#box1的内容不变。这是更改的行-数据：'recall:'+recall'，好的，我可能发现了一个问题，我发现了一个通知，说明'recall'是'recall.php'中的一个未识别索引不，您不需要将变量
recall
用引号括起来。只需
数据：“recall=“+recall
”。也许您可以将
数据
声明为对象，即：
数据：{recall:recall}
$.ajax({                                      
    url: "recall.php",
    data: {
        recall: recall
    },
    type: "GET",               // Declare type of request (we use GET, the default)
    dataType: "json"
}).done(function() {
    // Success
    var id = data[0],
        vname = data[1];
    $('div#box1').load('DFBristol.html');
});

<?php
// Assign the variable $recall with the value of the recall query string from AJAX get request
// I recommend doing a check to see if $_GET['recall'] is defined, e.g.
// if($_GET['recall']) { $recall = $_GET['recall']; }
$recall = $_GET['recall'];

// The rest of your script, unmodified
$user = 'root';
$pass = '';

$DBH = new PDO('mysql:host=localhost;dbname=nightlineDB;', $user, $pass);
$DBH->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$DBH->setAttribute(PDO::ATTR_EMULATE_PREPARES, false);

$recall = $DBH->prepare("SELECT * FROM bookings WHERE ID = '%$recall%'");
$recall->execute();
$recallFormResult = $recall->fetchALL(PDO::FETCH_ASSOC);

echo json_encode($recallFormResult);
?>