JS / PHP - 根据以前的选择自动填充选择字段

时间：2016-10-23 06:42:55

标签： php jquery ajax

所以我有3个选择字段，我想根据＃1中的选定值填充＃2和＃3。

JS正在接受＃1中的字段更改，将其成功提交到我的PHP脚本，但是当我将$ _POST ['problem']变量插入到我的查询中时，我收到了“数组到字符串转换”错误得到相关结果。

我确实尝试过json_encode，并确保第一个选择字段中的原始选定值（select id =“problem”）是一个数组，因此无法理解转换错误的来源。

ERROR：

<b>Notice</b>:  Array to string conversion in <b>Z:\xampp\htdocs\qcisource\ihg\ajax.php</b> on line <b>17</b><br />
{"current_field":null,"field_count":null,"lengths":null,"num_rows":null,"type":null}

有什么建议吗？

HTML 

        <p>Problem Experienced</p>
        <!-- Problem -->
        <div class="input-group">
            <span class="input-group-addon"><i class="fa fa-warning"></i></span>
            <select id="problem" name="problem" class="form-control select2" multiple="multiple" data-placeholder="Select a Problem">
                <option value=""> </option>
                <?php

                // define query
                $sql = "SELECT Issue, Description FROM qci_problems_index_new ORDER BY Issue";

                // query
                $result = $mysqli->query($sql) or die('<p>Query to get Issue from qci_problems_index_new table failed: ' . mysql_error() . '</p>');

                while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
                    $problem = $row['Issue'];
                    $desc = $row['Description'];
                    echo "<option value=\"$problem\" data-desc=\"$desc\">" . $problem . "</option>\n";
                }

                $result->free();
                ?>

            </select>
        </div>

        <p>Problem Category</p>
        <!-- Problem Category -->
        <div class="input-group">
            <span class="input-group-addon"><i class="fa fa-warning"></i></span>
            <select id="problem_category" name="problem_category" class="form-control select2" multiple="multiple" data-placeholder="Select a Problem Category">
                <option value=""> </option>
                <?php

                // define basic query
                $sql = "SELECT DISTINCT Category FROM qci_problems_index_new ORDER BY Category";

                // query
                $result = $mysqli->query($sql) or die('<p>Query to get Category data from qci_problems_index_new table failed: ' . mysql_error() . '</p>');

                while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
                    $category = $row["Category"];
                    echo "<option value=\"$category\">" . $category . "</option>\n";
                }

                $result->free();
                ?>
            </select>
        </div>

        <p>Department Responsible</p>
        <!-- Department Responsible -->
        <div class="input-group">
            <span class="input-group-addon"><i class="fa fa-bars"></i></span>
            <select id="department" name="department" class="form-control select2" multiple="multiple" data-placeholder="Select a Department">
                <option value=""> </option>
                <?php

                // define basic query
                $sql = "SELECT DISTINCT Department_Responsible FROM qci_problems_index_new ORDER BY Department_Responsible";

                // query
                $result = $mysqli->query($sql) or die('<p>Query to get department_responsible from qci_problems_index_new table failed: ' . mysql_error() . '</p>');

                while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
                    $dept = $row["Department_Responsible"];
                    echo "<option value=\"$dept\">" . $dept . "</option>\n";
                }

                $result->free();
                ?>
            </select>
        </div>

JS 

<script type="text/javascript" language="javascript"> 
$(function () {
    $('#problem').change(function () {
        $.ajax({
            type: 'POST',
            url: 'ajax.php',
            data: {
                problem: $(this).val()
            },
            dataType: 'json',
            success: function (data)
            {
                var Category = data[0]; 
                var Department_Responsible = data[1];
                $('#problem_category').val(Category);
                $('#department').val(Department_Responsible);
            }
        });
    });  
});  
</script>

ajax.php 

<?php

if(isset($_POST['problem'])) {

    // Start MySQLi connection
    include './plugins/MySQL/connect_db.php';
    $db = new mysqli($dbhost,$dbuser,$dbpass,$dbname);

    // display error if connection cannot be established
    if($db->connect_errno > 0){
    die('Unable to connect to database [' . $mysqli->connect_error . ']'); }

    // sanitize variables
    $problem = $_POST['problem'];  //mysqli_real_escape throws error, ignore for now

    // run query
    $result = $db->query("SELECT Category, Department_Responsible FROM qci_problems_index_new WHERE Issue= '".$problem."'");

    // return data as array
    $array = mysqli_fetch_array($result);
    echo json_encode($result);

}
?>

1 个答案:

答案 0 :(得分：0)

自己修正了......
除了JavaScript的一些小错误之外，主要的问题是我使用的是Jquery Select2插件，它不像常规<select>字段那样处理AJAX。我必须在所有字段上手动trigger('change')才能显示AJAX值。

的Javascript 

<script type="text/javascript" language="javascript"> 
$(function () {
    $('#problem').change(function () {
        $.ajax({
            type: 'POST',
            url: 'ajax.php',
            data: 'problem=' + $(this).val(),
            dataType: 'json',
            success: function (data)
            {
            var data0 = data[0]; 
            var data1 = data[1];
            $('#problem_category').val(data0);
            $('#department').val(data1);

            $('#problem_category').trigger('change');
            $('#department').trigger('change'); 
            }
        });
    });  

});  
</script>

Ajax.php 

<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);

if(isset($_POST['problem'])) {

    // Start MySQLi connection
    include '../../plugins/MySQL/connect_db.php';
    $db = new mysqli($dbhost,$dbuser,$dbpass,$dbname);

    // display error if connection cannot be established
    if($db->connect_errno > 0){
    die('Unable to connect to database [' . $db->connect_error . ']'); }

    // run query
    $sql = "SELECT Category, Department_Responsible FROM qci_problems_index_new WHERE Issue= '".$_POST['problem']."'";
    $result = $db->query($sql) or die(mysqli_error());

    // return data as array
    $array = mysqli_fetch_array($result);
    echo json_encode($array);
}
?>

HTML：

    <p>Problem Experienced</p>
<!-- Problem -->
<div class="input-group">
    <span class="input-group-addon"><i class="fa fa-warning"></i></span>
    <select id="problem" name="problem" class="form-control select2" data-placeholder="Select a Problem" style="width: 100%;">
        <option value=""> </option>
        <?php

        // define query
        $sql = "SELECT Issue, Description FROM qci_problems_index_new ORDER BY Issue";

        // query
        $result = $mysqli->query($sql) or die('<p>Query to get Issue from qci_problems_index_new table failed: ' . mysql_error() . '</p>');

        while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
            $problem = $row['Issue'];
            $desc = $row['Description'];
            echo "<option value=\"$problem\" data-desc=\"$desc\">" . $problem . "</option>\n";
        }

        $result->free();
        ?>

    </select>
</div>
<p class="help-block" width="100%"><div id="output01" name="output01"></div></p>

<hr />

<p>Problem Category</p>
<!-- Problem Category -->
<select id="problem_category" name="problem_category" class="form-control select2" data-placeholder="Select a Problem Category" style="width: 100%;">
    <option value=""> </option>
    <?php

    // define basic query
    $sql = "SELECT DISTINCT Category FROM qci_problems_index_new ORDER BY Category";

    // query
    $result = $mysqli->query($sql) or die('<p>Query to get Category data from qci_problems_index_new table failed: ' . mysql_error() . '</p>');

    while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
        $category = $row["Category"];
        echo "<option value=\"$category\">" . $category . "</option>\n";
    }

    $result->free();
    ?>
</select>

<hr />

<p>Department Responsible</p>
<!-- Department Responsible -->
<div class="input-group">
    <span class="input-group-addon"><i class="fa fa-bars"></i></span>
    <select id="department" name="department" class="form-control select2" data-placeholder="Select a Department" style="width: 100%;">
        <option value=""> </option>
        <?php

        // define basic query
        $sql = "SELECT DISTINCT Department_Responsible FROM qci_problems_index_new ORDER BY Department_Responsible";

        // query
        $result = $mysqli->query($sql) or die('<p>Query to get department_responsible from qci_problems_index_new table failed: ' . mysql_error() . '</p>');

        while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
            $dept = $row["Department_Responsible"];
            echo "<option value=\"$dept\">" . $dept . "</option>\n";
        }

        $result->free();
        ?>
    </select>
</div>
相关问题
最新问题