Question

我的特殊表格有两个选择框。在页面加载阶段，我使用PHP从MySQL数据库填充了第一个选项。

我接下来想要实现的目标如下：

通过从第一个预先填充的<select>框中选择一个值，第二个<select>框将根据在第一个{{1}中选择的选项从数据库表填充相关数据盒子。

因此，按照下图，如果我从第一个<select>框中选择一个位置，则第二个<select>框将填充该位置的所有套件。

enter image description here

我的数据库已经存在所有数据并建立了关系。我已经在数据库端测试了我的SQL查询并且它们正常工作。现在我需要将它全部放入一个PHP脚本中，该脚本将通过表单中的AJAX调用来调用。

到目前为止我所做的是尝试将此表单中的<select>请求发送到名为$.ajax的PHP脚本，然后该脚本应返回我jQueryHelper.php的套件一开始。

jQueryHelper.php：

alert()

HTML表单：

<?php
define("DB_HOST", "127.0.0.1");
define("DB_NAME", "mydb");
define("DB_USER", "root");
define("DB_PASS", "**********");

class jQueryHelper
{
    private static $initialized = false;
    private $db_connection = null;

    private static function initialize()
    {
        if (self::$initialized)
            return;
        $this->db_connection = new mysqli(DB_HOST, DB_USER, DB_PASS, DB_NAME);
        self::$initialized = true;
    }

    public static function giveData()
    {
        self::initialize();
        if (!$this->db_connection->set_charset("utf8")) {
            $this->errors[] = $this->db_connection->error;
        }
        if (!$this->db_connection->connect_errno) {
                if(isset($_POST['action']) && !empty($_POST['action'])){
                    $action = $_POST['action'];
                    $theSelectedLocationId = $_POST['id'];
                    switch($action){
                        case 'getAssignedSuites': 
                            $this->getAssignedSuites($theSelectedLocationId);
                            break;
                    }
                }
        }
    }

    public static function getAssignedSuites($theSelectedLocationId){
        $sql =<<<EOF
            SELECT * FROM suites
            WHERE location_id = $theSelectedLocationId
EOF;

        $query_get_assigned_suites = $this->db_connection->query($sql);
        $rows = array();
        while($r = mysqli_fetch_assoc($query_get_assigned_suites)){
            $rows[] = $r;
        }
        echo json_encode($rows);
    }
}

// Call it!
jQueryHelper::giveData();
?>

jQuery的<form method="post" action="user_todays_locations.php" name="updatetodayslocation" role="form"> <div class="form-group"> <label for="suite_location" class="sr-only">Assigned Locations</label> <select size="1" name="suite_location" class="form-control input-lg" required> <option value="" selected="selected" disabled>Assigned Locations</option> <?php $location->getAssignedLocations($login->getCurrentUserID()); ?> </select> </div>  </form>（位于$.ajax上方<body>）：

<form>

jQuery的<script> // grab ID of selected location $(function() { $("select[name=suite_location]").change(function() { var theSelectedLocationId = this.value; //alert(theSelectedLocationId); $.ajax({ url: '/classes/jQueryHelper.php', data: {action: 'getAssignedSuites', id: theSelectedLocationId}, type: 'post', success: function(output) { alert(output); }, error: function(jqXHR, textStatus, errorThrown) { if (jqXHR.status === 0) { alert('Not connect.\n Verify Network.'); } else if (jqXHR.status == 404) { alert('Requested page not found. [404]'); } else if (jqXHR.status == 500) { alert('Internal Server Error [500].'); } else if (exception === 'parsererror') { alert('Requested JSON parse failed.'); } else if (exception === 'timeout') { alert('Time out error.'); } else if (exception === 'abort') { alert('Ajax request aborted.'); } else { alert('Uncaught Error.\n' + jqXHR.responseText); } } }); }); </script> .change事件会毫无问题地触发，我会收到一个警告，其中包含所选选项的值（在我的情况下，它是数据库中位置的ID）。嵌套得更深的<select>部分不想工作。整个网站存储在LAMP服务器上。整个网站都在里面：$.ajax 表单位于/mywebsites/project/www/文件夹中，该文件夹包含在根级别的脚本中以及其他视图以显示完整页面。 views位于jQueryHelper.php文件夹内。

我不知道，也许有一种更简单的方法可以做到这一点。

Answer 1

在您的开关栏中

，您是否应该返回getAssignedSuites来电返回的结果？

switch($action){
  case 'getAssignedSuites': 
    return $this->getAssignedSuites($theSelectedLocationId);
    break;
}

然后正如@sean建议的那样。 echo jQueryHelper::giveData();

也。我认为在课堂活动中调用$_POST是不错的做法。我建议将它们作为参数传递给jQueryHelper::giveData($_POST['action'], $_POST['id'])，然后使用它。

Answer 2

AJAX调用找不到jQueryHelper.php。将url从/classes/jQueryHelper.php更改为classes/jQueryHelper.php可修复路径问题。

Chain使用AJAX，PHP和MySQL填充HTML选择框

2 个答案: