当前位置: 首页 > 面试题库 >

选择值更改时,用ajax调用从数据库查询中填充表单字段

赵明亮
2023-03-14
问题内容

我一直在看这里的问题,找不到我想要的确切答案:(但是我设法得到了一些东西。

我有一个从数据库查询中填充的表单选择字段

<select style="width:100%;" class="quform-tooltip chosen-select" id="company_select" name="company_select" title="Company Select" onChange="showUser(this.value)">
<option value="">Please select</option>
<?php
$userID = $user->getUserID();
$query = $user->database->query("SELECT * FROM tbl_businesses as business LEFT JOIN tbl_user_businesses as biz_user ON business.businessID = biz_user.businessID WHERE biz_user.userID ='$userID'");

while($row=$user->database->fetchArray($query))
{
    $bizID = $row['businessID'];
    $bizName = $row['businessName'];
    echo "<option value='$bizID'>$bizName</option>";
}?>
</select>

然后当前有2个其他文本框(最终可能会增加),当上面的选择框值被更改/选择时,我想填充该文本框

<input id="company_name" type="text" name="company_name" value="" />
<input id="company_email" type="text" name="company_email" value="" />

所以我的选择框上有一个onchange函数,这是

<script>
function showUser(str)
{
if (str=="")
{
    document.getElementById("company_name").innerHTML="";
    return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        var data = JSON.parse(xmlhttp.responseText);
        for(var i=0;i<data.length;i++) 
        {
          document.getElementById("company_name").innerHTML += data[i].id + ' - ' + data[i].name + ' - ' + data[i].web;
        }
    }
}
xmlhttp.open("GET","formdata.php?q="+str,true);
xmlhttp.send();
}
</script>

和我的formdata.php文件是这样的

    <?php
include("include/user.php");

$q = intval($_GET['q']);

$sql="SELECT * FROM tbl_businesses WHERE businessID = '".$q."'";

$result = $user->database->query($sql);
$info = array();
while($row=$user->database->fetchArray($result))
{
    $cID = $row['bussinessID'];
    $cName = $row['businessName'];
    $cWeb = $row['businessWebsite'];
    $info[] = array( 'id' => $cID, 'name' => $cName, 'web' => $cWeb );
}
echo json_encode($info);?>

哪个使ajax调用正确并返回预期的数据,但是我现在需要帮助来填充文本框值?

谁能帮我解决这个问题,花了很多年的时间试图弄清楚,我对javascript / json不熟悉,所以不确定从哪里开始

我想将company_name文本框值设置为$ cName; 并将company_email文本框值设置为$ cWeb;

感谢任何帮助

路加


问题答案:

确定我使用的解决方案,对于任何想知道我如何解决的人

我的index.php,其中包含javascript和表单代码

JavaScript代码

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script>

<script>
function showUser(str)
{
if (str=="")
{
    document.getElementById("company_name").value="";
    return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        var data = JSON.parse(xmlhttp.responseText);
        for(var i=0;i<data.length;i++) 
        {
          document.getElementById("company_name").value = data[i].name;
          document.getElementById("company_email").value = data[i].web;
        }
    }
}
xmlhttp.open("GET","formdata.php?q="+str,true);
xmlhttp.send();
}
</script>

和表单代码

    <select style="width:100%;" class="quform-tooltip chosen-select" id="company_select" name="company_select" title="Company Select" onChange="showUser(this.value)">
<option value="">Please select</option>
<?php
$userID = $user->getUserID();
$query = $user->database->query("SELECT * FROM tbl_businesses as business LEFT JOIN tbl_user_businesses as biz_user ON business.businessID = biz_user.businessID WHERE biz_user.userID ='$userID'");

while($row=$user->database->fetchArray($query))
{
    $bizID = $row['businessID'];
    $bizName = $row['businessName'];
    echo "<option value='$bizID'>$bizName</option>";
}?>
</select>

<input id="company_name" type="text" name="company_name" value="" />
<input id="company_email" type="text" name="company_name" value="" />

然后我的formdata.php

    $q = intval($_GET['q']);

$sql="SELECT * FROM tbl_businesses WHERE businessID = '".$q."'";

$result = $user->database->query($sql);
$info = array();
while($row=$user->database->fetchArray($result))
{
    $cID = $row['businessID'];
    $cName = $row['businessName'];
    $cWeb = $row['businessWebsite'];
    $info[] = array( 'id' => $cID, 'name' => $cName, 'web' => $cWeb );
}
echo json_encode($info);?>

就是这样,感谢charlietfl的帮助!

希望这可以帮助某人:)



 类似资料:
  • 问题内容: 我有一个表格(“场地”),其中存储了志愿者可以工作的所有可能场所,每个志愿者被分配为每个场所工作一个。 我想从场所表中创建一个选择下拉列表。 现在,我可以显示分配给每个志愿者的地点,但是我希望它显示下拉框,并且已经在列表中选择了地点。 例如,将ID为7的志愿者分配给了场地编号4 我知道它将采用for或while循环的形式从场地表中拉出场地列表 我的查询是: 如何填充选择下拉框与场馆(

  • 我看到了许多类似问题的答案,人们说为了获得组合框中加载的项目的值,需要使用 但这种东西不起作用…… 这是我所拥有的…… 我从表中选择了Code1和Code2,我希望能够显示Code1,当被选中时,我希望能有Code2的值,但对于displayMember和ValueMember,我看不到任何结果。 编辑:这是我的所有代码: 暗淡的行=dt. Load(com. Ex 错误提示:表达式不产生值 编辑

  • 问题内容: 好的,这是我对Ajax的第一次尝试,它使我发疯,因为我实在无法绕开它。我想做的是在第一个框中用数据库中的客户填充,然后使用customerID通过select.php脚本从数据库中选择所有车辆ID。发生的情况是“客户”框被选中,但是选择客户时什么也没有发生。 这是我的Test.php文件: 这是我的select.php文件: 我正在尝试修改本教程以使用数据库,但到目前为止我没有成功。

  • 问题内容: 对此不熟悉,尝试按照著名的Flask教程使用Flask-bootstrap,Flask-wtforms,Jinja等构建一个应用程序 我有一个带有2个选择字段和一个按钮的表单。 我只希望第一个字段预先填充,而另一个字段根据前一个字段的选定值填充(在客户端?)。 在模板中,我尝试类似 可以正常工作(只要我返回元组列表以使用正确的javascript和路由填充下一个字段),但我想要以下内容

  • 我有一个基于类的视图(IndexView at views.py),它显示了一个包含数据库中存储的所有数据的表。此视图在索引中呈现。html使用获取所有数据。还没有问题。 对我来说,困难的部分是尝试使用表单来完成它,以便能够修改和保存金额列。我对POST部分没有问题,我使用AJAX来保存新值。我遇到的问题是从数据库中获取初始值以填充Django表单(forms.py) 我尝试在表单字段的定义中使用

  • 问题内容: 我正在建立一个网站来学习编码,并且正在尝试建立一个工具,用户单击一个选择/下拉列表,其中包含从数据库 cat 提取的某些类别名称,然后另一个选择与从数据库 subcat 提取的子类别名称一起出现。这几乎与Yelp的(向下分类)完全一样,就像Yelp的(向下分类)一样。 我还做了一个图: 我已经有一个从 cat 数据库中提取的类别下拉列表: 我有一个从subcat数据库中提取的subca