使用 jquery 和 php 从 mysql 加载数据答案

【问题标题】：load data from mysql with jquery and php使用 jquery 和 php 从 mysql 加载数据
【发布时间】：2012-05-06 07:35:18
【问题描述】：

我有一个下拉列表（ddlAccount），我可以从中选择一个项目并在 test.php 中进行 db 查询以检索相应的数据，然后输出带有返回数据的输入元素。

这是我的 javascript 代码：

function load1(){
$('#divAccountNum').load('test.php?accountInfo=' + document.getElementById('ddlAccount').value , '' ,function() {
alert('Load was performed.')}); 
}

当我更改下拉列表项时调用 load1 函数，它获取所选选项的值并将其发送到名为“accountInfo”的参数中的 test.php。

我的html：

  <select name="ddlAccount" id="ddlAccount" onchange="load1();">
    <option value="1"> Account1</option>
    <option value="2"> Account2</option>
    <option value="3"> Account3</option>
  </select>

  <div id="divAccountNum" >
  </div>

和 test.php ：

if($_GET['accountInfo'])
{
    $account = $accountDAO->load($_GET['accountInfo']); //mysql query
        //print an input holding account number as its value
    echo "<input type='text' name='txtAccountNum' id='txtAccountNum' value='".$account->accountnumber."'/>"; 
}

问题是当我选择一个选项时没有发生任何事情（没有出现在 div (divAccountNum) 中）有什么建议么？提前致谢。

编辑： 我使用了@thecodeparadox 的代码，它可以工作，并且我找到了我在下面的 cmets 中提到的问题的解决方案，即当从下拉列表中选择一项时，它会显示输入元素中的值并再次加载表单.解决方案在： jQuery Ajax returns the whole page 所以我的 jquery 代码现在看起来像：

$(document).ready(function(){
  $('#ddlAccount').on('change', function() {  
$.get('testJquery.php?accountInfo=' + $(this).val(), function(accountNum) {
    //console.log(accountNum);
    $('input#txtAccountNum').val(accountNum);
   });
});

还有 testJquery.php ：

if($_GET['accountInfo'])
{
    $account = $accountDAO->load($_GET['accountInfo']);
    $accountNum = $account->accountnumber;
    echo $accountNum;
}

最后我在 id="txtAccountNum" 的 divAccountNum 中添加了输入元素

【问题讨论】：

嗨，欢迎来到 Stackoverflow。你需要告诉我们代码在做什么，你看到了什么错误，以及预期的行为是什么以及实际的行为是什么。告诉我们只是有一个问题并没有给我们很多事情要做。您可以使用问题下方的 edit 链接添加更多详细信息。祝你好运！
如果你使用 jQuery 为什么不在document.getElementById('ddlAccount').value 中使用选择器，比如$('#ddlAccount').val()

标签： php jquery mysql

【解决方案1】：

虽然您没有就您的问题提供足够的信息，但您可以试试这个：

function load1(){
  $('#ddlAccount').on('change', function() {  
    $.get('test.php?accountInfo=' + $(this).val(), function(response) {
       $('div#divAccountNum').html(response);
    }, 'html');
  });
}

注意：

$('#ddlAccount').on('change', 在下拉列表更改时触发
$.get('test.php?accountInfo=' + $(this).val().. 向 test.php 发送一个 get(ajax) 请求，并从下拉列表中选择值
参数response与$.get()第二个参数回调函数是来自服务器的响应
'html' 作为$.get() 的第三个参数，用于您返回的数据类型，因为您返回一个html，所以它是html。

更多信息请阅读：

change()

$.get()

【讨论】：

我试过了，但没有任何反应，输入元素仍然没有出现在页面中。
我正在使用 Smarty。这会是个问题吗？！
不要以为 Smarty 会引起问题。你的 php 脚本运行良好吗？在 $('div#divAccountNum').html(response) 之前使用 console.log(response) 调试响应
php 没有错误。我还用 php 中返回的帐号回显了一个警报，它出现了。
将 php echo "<input type='text' name='txtAccountNum' id='txtAccountNum' value='".$account->accountnumber."'/>"; 中的行替换为 echo '<input type="text" name="txtAccountNum" id="txtAccountNum" value="'. $account->accountnumber .''"/>'; 并从 $.get() 中删除 html

【解决方案2】：

要从选择输入中获取选定的选项值，请使用：

$('#ddlAccount option:selected').val()

【讨论】：