Question

我有一个MySQL数据库，其中包含2个表。一个是events表，包含事件名称和其他详细信息。另一个是instance表。此表将events表链接到venue表并添加日期，因此每行都是链接事件的实例。

我正在为这些活动制作一个内部使用的活动预订表格。我想允许通过下拉列表选择要预订的活动。所以，我已经用事件名称填充了一个下拉列表：

$qEvent = "SELECT event_name, event_id FROM events";
$rEvent = mysqli_query($dbc,$qEvent);

echo '<select>';
while ($row = mysqli_fetch_assoc($rEvent)) {
        echo '<option value="'.$row['event_id'].'">'.$row['event_name'].'</option>';
}
echo '</select>';

我现在要做的是，对于所选事件，获取与该事件关联的所有实例，并使用日期填充另一个下拉列表。

我可以用PHP做到这一点，还是需要深入了解Javascript？我想我只需要一些方法来获取下拉选择的event_id值，然后根据它进行查询，但我不知道如何没有Javascript。

Answer 1

你应该看Javascript或jQuery来实现你的目标。我之前已经根据我的问题使用了jQuery。它也更简单，代码更少。

您的PHP：

在您的选择菜单中添加ID属性event_menu

echo '<select id="event_menu">';
while ($row = mysqli_fetch_assoc($rEvent)) {
        echo '<option value="'.$row['event_id'].'">'.$row['event_name'].'</option>';
}
echo '</select>';

<div id="container_for_new_menu"></div>

使用jQuery：

$('#event_menu').on('change', function() {
    // get selected value and build data string for AJAX
    var event_selected = "event_selected="+$(this).val();

    // send the selected data to a PHP page to build the populated menu
    $.ajax({
        url : 'populate-menu.php',
        type: 'POST',
        data : event_selected,
        dataType : 'html',
        success : function(data) {
            $('#container_for_new_menu').html(data);
        }, error : function() {
            alert("Something went wrong!");
        }
    });
});

在 populate-menu.php 上，有类似的内容：

$event_selected = isset($_POST['event_selected']) ? $_POST['event_selected'] : null;

// do SQL query here based on user's selection
// making sure you validate the data in the POST request for malicious BS
// or use parameterized queries

// then build a new menu to send back
echo '<select>';
    // loop through results and build options
echo '</select>';

然后，此新菜单将发回原始页面的container_for_new_menu元素。

Answer 2

根据它的外观，您希望根据用户在“事件”下拉列表中所做的选择来填充“实例”下拉列表。如果没有Javascript，你就无法做到这一点。

我建议的方法是使用AJAX拉取实例数据，并在更改“事件”下拉列表时填充“实例”下拉列表。简单的AJAX下面有用的资源来自jQuery：

http://api.jquery.com/jQuery.get/

http://remysharp.com/2007/01/20/auto-populating-select-boxes-using-jquery-ajax/

Answer 3

你需要某种Javascript来实现这一目标。或者：基本 - 在select上提交表单，让php填充实例下拉列表。更优雅 - 使用Javascript在select上进行Ajax调用，它将动态替换实例下拉列表的div。

Answer 4

您需要使用JavaScript填充第二个下拉框。我建议您在页面上将所有值加载到JSON中，然后您可以在更改事件上使用jQuery来填充第二个选择框。

使用MySQL条目填充下拉列表

4 个答案: