Php 动态组合框不更新_Php_Html_Ajax_Combobox

Php 动态组合框不更新

php html ajax combobox

Php 动态组合框不更新,php,html,ajax,combobox,Php,Html,Ajax,Combobox,我试图创建一个组合框，当另一个组合框被更改时，它将使用数据库中的信息动态更新。我找到了很多解决方案，但这些解决方案似乎与我现有的解决方案不符，我对下一步该做什么茫然不知所措我已经尝试过简化代码，以找出哪部分不起作用，我尝试过的代码有很多不同的版本，我只知道我现在有的版本可以工作，而有的则不行编辑：我希望代码更好数据库连接根/config/config.php <?php define("DB_HOST", "10.172.16.4"); define("DB_USER

我试图创建一个组合框，当另一个组合框被更改时，它将使用数据库中的信息动态更新。我找到了很多解决方案，但这些解决方案似乎与我现有的解决方案不符，我对下一步该做什么茫然不知所措

我已经尝试过简化代码，以找出哪部分不起作用，我尝试过的代码有很多不同的版本，我只知道我现在有的版本可以工作，而有的则不行

编辑：我希望代码更好

数据库连接根/config/config.php

<?php
    define("DB_HOST", "10.172.16.4");
    define("DB_USER", "test2_user");
    define("DB_PASS", "password");
    define("DB_NAME", "test2");

    $dsn = "mysql:host=".DB_HOST.";dbname=".DB_NAME;
    $options = [PDO::ATTR_PERSISTENT => true, PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION];
    try { 
        $pdo = new PDO($dsn, DB_USER, DB_PASS, $options);
    } catch (PDOException $error) {
        echo "Connection error: " . $error->getMessage();
        die();
    }
?>

Header root/online/templates/Header.php

<!DOCTYPE  HTML>
<HTML>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script type="text/javascript" src="js/javascript.js"></script>
</head>
<body>

表单root/online/create.php

<?php
    require_once "templates/header.php";
    require_once "../config/config.php";
 ?>
<form method="post" action="">
    <label for="choose_type">Type</label>
    <select name="choose_type_modele" id="choose_type" onchange="selectMarque()" required>
        <option value="">Select Type</option>
        <?php
            $sql = "SELECT id, name FROM typeMateriel";
            if($stmt = $pdo->prepare($sql)) {
                if($stmt->execute()){
                    $typeMateriel = $stmt->fetchAll();
                }
            }
            foreach($typeMateriel as $foundType){
                $typeMateriel_id = $foundType['id'];
                $typeMateriel_name = $foundType['name'];
        ?>
        <option value="<?= $typeMateriel_id; ?>"><?= $typeMateriel_name; ?></option>
        <?php } ?>
    </select>
    <label for="choose_marque">Marque</label>
    <select name="choose_marque_modele" id="choose_marque" required>
        <option value="">Select type first</option>
    </select>
</form>
<p id="test"></p>
<?php require_once "templates/footer.php"; ?>

函数root/online/js/javascript.php

function selectMarque() {
    var typeID = $('#choose_type').val();
    var post_id = 'id='+ typeID;
    document.getElementById("test").innerHTML = "You Selected " + typeID;
        if(typeID){
            $.ajax({
                type:'POST',
                url:'../ajax_marque.php',
                data:post_id,
                success:function(marque){
                    $('#choose_marque').html(marque);
                }
            });
        }else{
            document.getElementById("choose_marque").innerHTML = '<option value="">Select type first</option>';
        }
};

动态stuff root/online/ajax_marque.php的代码

<?php
include('../config/config.php');
if($_POST['id']){
    $id=$_POST['id'];
    if($id===0){
        echo "<option>N/A</option>";
    } else {
        $sql = "SELECT marqueMateriel.id,marqueMateriel.name FROM type_marque, marqueMateriel WHERE marqueMateriel.id=type_marque.marqueMateriel_id AND type_marque.typeMateriel_id= :typeMateriel_id";
        if($stmt = $pdo->prepare($sql)) {
            $stmt->bindParam(':typeMateriel_id', $id, PDO::PARAM_INT);
            if($stmt->execute()){
                $marqueMateriel = $stmt->fetchAll();
            }
        }
        echo "<option>Select Marque</option>";
        foreach($marqueMateriel as $foundMarque) {
            $marqueMateriel_id = $foundMarque['id'];
            $marqueMateriel_name = $foundMarque['name'];
            echo "<option value='<?php $marqueMateriel_id; ?>'><?php $marqueMateriel_name; ?></option>";
        }
    }
}
?>

关闭root/online/template/Footer.php

</body>
</html>

第一个组合框可以工作，差不多就是这样。没有什么变化，我肯定我在什么地方遗漏了什么。我可以使用函数来alerttypeID，它可以这样做，但不能更改数据：/

编辑：想让它更有意义吗

组合框choose_type_modele起作用，它包含从表typematerials开始的所有内容。当我选择某个对象时，它不会改变第二个框，即选择_marque _modele。调用onchange函数，因为在选择时使用适当的ID修改测试。如果我在create.php中复制它并手动告诉它$ID是什么，那么ajax_marque.php中的代码可以工作，但它不会自动执行。我觉得问题在于javascript.js中代码的$.ajax部分，但我似乎无法找出哪部分是错误的

任何帮助都将不胜感激。

我不认为您是否可以向select with html方法添加选项。必须创建选项对象才能添加选择对象。要对此进行归档，您需要将ajax方法的响应更改为JSON对象

我的代码中有两个错误使其无法工作，即ajax代码的url和success部分

工作代码：

            $.ajax({
                type:'POST',
                url:'ajax_marque.php',
                data:post_id,
                success:function(data){
                    $('#choose_marque').html(data);
                }
            });

出于某种原因，我使用了marque而不是数据，我可能会改变它，认为它是其他东西？url是../ajax\u marque.php。我想我必须从javascript.php文件所在的位置添加url，而不是从名为create.php的位置添加url。

这里的$stmt是什么？您还需要阅读带有参数的准备语句，并且在将其插入HTML之前需要转义输出。好的，我们得到的结果不会改变数据。但是它有什么作用呢？本文共分三个部分。第一：复选框更改时发送请求。第二：通过php接收请求，准备并发送响应。第三：接收php的响应并创建选项。代码在哪个部分失败？唯一不起作用的部分是更改第二个组合框数据的部分。第一个有效，如果我让它做其他事情，onchange也有效。如果我在create.php中使用了ajax_marque.php的php，那么它可以工作，唯一不工作的时候就是我用ajax调用它@MehmetThank谢谢你的帮助，我不是在问如何使这一切安全，我删除了大部分代码以减少混乱，很抱歉这不是一个好工作@miken32