Question

我的下拉列表由下面的代码填充。我希望能够将 type = x 从用户输入按钮更改为预定选项。我不知道这是否可行，特别是没有页面刷新，因为下拉列表已经从初始查询中填充。

我需要基于用户选择的动态查询而不刷新页面。也许我需要看另一种语言，比如Angular。

<?php
echo "<b>Start:<b/>";
echo "<select id='start' class=''>";

$list_query = mysqli_query($server, "SELECT `id`, `street`, `description`, `lat`, `lng`, `note`, `type` FROM `markers` WHERE `type` = 'red' ORDER BY `street`");
while($run_list = mysqli_fetch_array($list_query)){
    $u_id = $run_list['id'];
    $u_street = $run_list['street']; 
    $u_desc = $run_list['description'];  
    $u_note = $run_list['note'];  
    $u_type = $run_list['type'];  
    $u_lat = $run_list['lat'];   
    $u_lng = $run_list['lng'];  

    echo "<option value='$u_lat,$u_lng'>$u_street</option>";
}

echo "</select>";
?>

更新

以下返回＆＃34;红色＆＃34;在ID为＆＃34;回调＆＃34;的Div中。而不是这个如何让它来更新查询字符串？

示例按钮：

<button id="b1" value="red" onclick="submit_1()">button 1</button>

的Ajax：

function submit_1() {
var b1 = document.getElementById("b1").value;
console.log(b1);

var dataString = 'b1=' + b1;

$.ajax({
    type: "POST",
    url: "php/getdata.php",
    data: dataString,
    cache: false,
    success: function(data) {
        $("#callback").html(data);
    }
});
}

简单的getdat.php：

<?php
$b1 = $_POST['b1'];

if ($b1 == "red") {
    echo $b1;
} else {
    echo 'Not '. $b1;
}
?>

Answer 1

使用AJAX。完全可以使用PHP和javascript。基本上，你可以用AJAX（onChange）发送选择，使用＆＃34; GET＆＃34;方法，并在成功时返回要替换的HTML（或相应的数据，然后根据该更改HTML）。

编辑以下是一个例子：

基本上你做了一些动作然后调用这样的代码：

$.ajax({
        url: <?php echo $your_action_url/user_choice;?>,
        type: 'GET',
        success: function(data) {
          $("#dropdown").replaceWith(data);
        }
      });

其中＆＃34;数据＆＃34;是存储在视图页面中的下拉信息（我在此特定示例中使用MVC）。基本上我用一个包含正确信息的下拉列表替换现有的下拉列表。你可以让php函数返回你要替换下拉列表的html。

Answer 2

使用Ajax在服务器的查询字符串中添加类型。

$list_query = mysqli_query($server, "SELECT `id`, `street`,`description`, `lat`, `lng`, `note`, `type` FROM `markers` WHERE `type` =  $_GET['type'] ORDER BY `street`");

Answer 3

尝试学习ajax angular.js这个库非常简单的使用

http://phpenthusiast.com/blog/ajax-with-angular-and-php

通过按钮单击或下拉菜单更改MySQL查询

3 个答案: