使用 PHP PDO 根据先前的选择动态更新下拉列表 [英] Dynamically update dropdown based on previous selection with PHP PDO

问题描述

之前已经回答过这个问题，但是我再次询问有两个原因:我找不到任何使用 PDO 的资源，无论如何，我找到的所有资源都包含没有任何注释的代码或解释，这使得很难解释它们并使它们适应我的用例.

我需要能够根据上一个选择的下拉列表动态更新自身，如果我更改该选择，它应该重新更新自身，而无需提交表单或重新加载页面.

我已经用迄今为止学到的和发现的内容更新了代码，但它仍然无法正常工作.一切正常，直到第二个下拉菜单开始加载值.

HTML:

<label class="col-sm-2 form-control-label" onchange="productorInfo(this.value);">Codigo Productor (*)</label><div class="col-sm-4"><选择名称="vendor_codigo"><?php foreach ($dd_productor_result as $dd_productor_display) : ?><option value="<?= $dd_productor_display['vendedor_codigo']; ?>"><?= $dd_productor_display['vendor_codigo'];?></选项><?php endforeach;?></选择>
<label class="col-sm-2 form-control-label">Nombre (*)</label><div class="col-sm-4"><select id="ajax-vendor" name="vendor_nombre"><?php foreach ($ajax_productor_result as $dd_productor_display) : ?><option placeholder="Seleccione codigo" value="<?= $dd_productor_display['vendedor_nombre']; ?>"><?= $dd_productor_display['vendor_nombre'];?></选项><?php endforeach;?></选择>

Ajax 脚本:

function productorInfo(id) {$.ajax({类型:获取"，url: "/controller/produccion/db_ajax_update.php",数据:mainid ="+ id，成功:功能(结果){$("#ajax-vendor").html(result);}});};

第一个下拉 PHP 代码:

$dd_productor = "SELECT vendedor_codigo FROM lista_productores";$productor_stmt = $pdo->prepare($dd_productor);$productor_stmt->execute();$dd_productor_result = $productor_stmt->fetchAll();

第二个下拉列表(ajax 调用):

if(isset($_GET['mainid'])){productorInfo($_GET['mainid']);$prod_value = productorInfo($_GET['mainid']);}$ajax_productor = "SELECT vendedor_nombre FROM lista_productores WHERE vendedor_codigo = {$prod_value}";$productor_stmt = $pdo->prepare($ajax_productor);$productor_stmt->execute();$ajax_productor_result = $productor_stmt->fetchAll();

解决方案

onchange 调用应该在 select 元素上而不是在标签上

 Codigo Productor (*)<select name="vendor_codigo onchange="productorInfo(this.value)">

但我也想到你可能不太了解这个过程.页面加载时不会触发您的 ajax 调用，因此这一点:

<?php foreach ($ajax_productor_result as $dd_productor_display) : ?><option placeholder="Seleccione codigo" value="<?= $dd_productor_display['vendedor_nombre']; ?>"><?= $dd_productor_display['vendor_nombre'];?></选项>
我认为是给您未定义的变量警告(除非您最初以某种方式设置 $ajax_productor_result)
来自ajax的响应通常通过success:function在.js中绘制
(结果){$("#ajax-vendor").html(result);}
尽管如此 - 除非有更多已发布的代码，否则您将 .html() 函数传递给数组或数据库行，因此它永远不会显示任何内容.
所以你需要1)在页面加载时绘制一个没有选项的选择(或默认选项，如果你有的话)2)返回成功函数可以使用的响应，例如jquery 可以解析的 json 字符串3)将jquery中的数据格式化为，然后使用.html()函数更新select4)如果您希望在页面最初加载时发生这种情况，请添加对 productorInfo(id) 函数的文档就绪调用 - 如果您以某种方式设置初始选择值，这将是相关的(所以它可能与您无关)
This has been answered before, however I'm asking again for two reasons: I can't find any resources that utilize PDO, and regardless of that, all of the ones I've found consist of code without any comments or explanations, which makes it hard to interpret and adapt them to my use case.

I need to be able to make a dropdown dynamically update itself based on the selection of the previous one, and if I change that selection, it should re-update itself without having to submit the form or reload the page.

I've updated the code with what I've learned and found so far, but it's still not working properly. Everything works up to the point where the second dropdown should begin loading values.

HTML:
<div class="form-group row">
    <label class="col-sm-2 form-control-label" onchange="productorInfo(this.value);">Codigo Productor (*)</label>
    <div class="col-sm-4">
        <select name="vendedor_codigo">
            <?php foreach ($dd_productor_result as $dd_productor_display) : ?>
            <option value="<?= $dd_productor_display['vendedor_codigo']; ?>">
                <?= $dd_productor_display['vendedor_codigo']; ?>
            </option>
            <?php endforeach; ?>
        </select>
    </div>
    <label class="col-sm-2 form-control-label">Nombre (*)</label>
    <div class="col-sm-4">
        <select id="ajax-vendedor" name="vendedor_nombre">
            <?php foreach ($ajax_productor_result as $dd_productor_display) : ?>
            <option placeholder="Seleccione codigo" value="<?= $dd_productor_display['vendedor_nombre']; ?>">
                <?= $dd_productor_display['vendedor_nombre']; ?>
            </option>
            <?php endforeach; ?>
        </select>
    </div>
</div>
Ajax script:
function productorInfo(id) {
    $.ajax({
        type: "GET",
        url: "/controller/produccion/db_ajax_update.php",
        data: "mainid =" + id,
        success: function (result) {
            $("#ajax-vendedor").html(result);
        }
    });
};
First dropdown PHP code:
$dd_productor = "SELECT vendedor_codigo FROM lista_productores";

$productor_stmt = $pdo->prepare($dd_productor);
$productor_stmt->execute();
$dd_productor_result = $productor_stmt->fetchAll();
Second dropdown (ajax call):
if(isset($_GET['mainid'])){
productorInfo($_GET['mainid']);
$prod_value = productorInfo($_GET['mainid']);
}
$ajax_productor = "SELECT vendedor_nombre FROM lista_productores WHERE vendedor_codigo = {$prod_value}";

$productor_stmt = $pdo->prepare($ajax_productor);
$productor_stmt->execute();
$ajax_productor_result = $productor_stmt->fetchAll();

解决方案
The onchange call should be on the select element not on the label
<label class="col-sm-2 form-control-label">Codigo Productor (*)</label>
<select name="vendedor_codigo onchange="productorInfo(this.value)">
But also it occurs to me you may not quite understand the process.  Your ajax call won't be fired when the page loads so this bit:
<select id="ajax-vendedor" name="vendedor_nombre">
            <?php foreach ($ajax_productor_result as $dd_productor_display) : ?>
            <option placeholder="Seleccione codigo" value="<?= $dd_productor_display['vendedor_nombre']; ?>">
                <?= $dd_productor_display['vendedor_nombre']; ?>
            </option>
i would think is giving you undefined variable warnings (unless you are setting $ajax_productor_result initially in some way)

Responses from ajax are usually  drawn in .js via success: function 
(result) {
            $("#ajax-vendedor").html(result);
        }
from the looks of this though - unless there is more code that what has been posted, you are passing the .html() function an array or database rows so it's never going to display anything.

so you need to 
1)draw a select with no options in it on pageload (or default options if you have them)
2)return a response that the success function can make use e.g. a json string which jquery can the parse
3)format the data in jquery into the <options> and then user the .html() function to update the select
4)if you want this to happen when the page initially loads then add in a document ready call to the productorInfo(id) function - this would be relevant if you are setting the initial select value in some way (so it may not be relevant to you)

                        
这篇关于使用 PHP PDO 根据先前的选择动态更新下拉列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
                        
                    
                    
                
				

                            
                        
                

            
        
        

            



        
        
        

            



        
    
    


    

    

        

            登录
            关闭
        
        

            

                扫码关注1秒登录
            
            

                
            
            

                
                
            

发送“验证码”获取 | 15天全站免登陆