下拉搜索列表无法使变量等于所选选项答案

【问题标题】：Dropdown search list can't get variable to equal selected option下拉搜索列表无法使变量等于所选选项
【发布时间】：2019-10-08 09:17:04
【问题描述】：

我有一个显示不同会议名称的下拉列表。我可以选择某个会议，但是当我选择会议时，我想添加一个提交按钮，以便我可以获取所选会议的变量。

我是数据库新手，但我尝试添加一个表单，但我似乎无法让它在 php 代码中工作。数据库连接并显示所有会议都很好，我只是不知道如何获得一个等于所选选项的变量。

<!DOCTYPE HTML>  
<html>
<head>
<style>
.error {color: #FF0000;}
</style>
</head>
<body>  

<?php
//Declare variables
$db_host = "";
$db_username = "";
$db_pass = "";
$db_name = "";
$db_table = "";
//Connect to phpMyAdmin
$con=mysqli_connect("$db_host","$db_username","$db_pass","$db_name");

// Check connection
if (mysqli_connect_errno())
  {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }

mysqli_select_db($con,"$db_name") or die ("No database");

$result=mysqli_query($con,"select * From conferenceList");

echo "<select id='searchddl'>";
echo "<option> -- Search Conference Name -- </option>";
while($row=mysqli_fetch_array($result))
{
    echo "<option>$row[name]</option>";
}
echo "</select>";


//Close phpMyAdmin
mysqli_close($con);
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.min.css" />

<script>
    $("#searchddl").chosen();
</script>

</body>
</html>

我希望一个变量与选择的相同。所以我希望我的变量等于echo "<option>$row[name]</option>"; enter image description here

【问题讨论】：

表单要么需要提交，要么你需要添加一些 javascript/ajax 来将数据发送到 PHP。这里有一个很好的 ajax 解决方案：stackoverflow.com/questions/16616250/…
@tshimkus 是的，这就是我想要的，但我该怎么做呢？
你能澄清一下吗？您是否尝试从选择下拉列表中获取值并将其发送到新查询？这是我最初的假设，但我想确定一下。
@tshimkus 是的，那是我的目标

标签： php jquery html mysql database

【解决方案1】：

<script>
    $( "#searchddl" ).chosen().change(function() {  // execute query every time select option changes
    var val = $( "#searchddl" ).chosen().val();  // get value from selected option
    $.ajax({
        url: "myphpfile.php", // call external PHP file for query execution
        type: "get", 
        data: { 
            myselectvalue: val // passes value as GET parameter (?=myselectvalue=val) 
        },
        success: function(response) {
            tmp = response // store variable from PHP output
            // do Something

        },
        error: function(xhr) {
             // do Something else
        }
    });
</script>

在您的单独 PHP 文件中，您可以从 get 变量中获取值：

if (isset($_GET['myselectvalue']) && strlen($_GET['myselectvalue']) { // make sure it's populated

    $valueFromForm = $_GET['myselectvalue'];

    // Execute queries, echo results, etc.

}

我在这个解决方案中使用了 GET，但 POST 也可以。您只需在 ajax 调用中将 type: "get" 更改为 type: "post"，在 PHP 中将 $_GET[] 更改为 $_POST[]。

【讨论】：

我使用了你的代码，但是搜索功能消失了，现在看起来像这样 imgur.com/Rxhw1UV 并且我还添加了 echo $valueFromForm; // 在第二个文件中执行查询、回显结果等，但没有得到任何结果。有没有办法在同一个文件中获取变量而不必使用另一个文件？
是的，如果您创建一个带有打开和关闭表单标签的完整表单，并使用提交输入或使用 jquery 提交表单。表单的默认操作是同一页面，默认方法是 get。当您提交表单时，它将重新加载页面并通过 get 发送数据（如果您更改表单方法，则发送数据）。
我没有意识到.change() 方法会影响搜索框。我想它也可能产生对添加到搜索框的每个字符执行 ajax 的意外后果。
我也错过了 jQuery Chosen 插件。我对代码做了一个小的更新，将.chosen() 方法包含在选择器中，看看是否有什么不同。我以前没有使用过那个插件，所以我不知道它的细微差别。