刷新后保留动态下拉列表中的选定值

10

我有一个包含11个元素(inputselect标签)的表单。表单具有表单验证功能,如果用户输入不正确的数据,则在字段旁边提示错误消息。我希望在页面刷新后保留正确输入到字段中的数据。

比如说,假设有10个字段被正确填写,而1个字段填写错误。当用户按下提交按钮时,会在该字段附近显示一个错误消息。我想做的是保持10个正确填写的值被选中,这样用户就不必重新开始填写。

对于input元素,这个功能运行良好,但对于select元素来说则不行。 重要的是,我是使用PHP动态填充下拉列表的。

这是否可能在PHP中实现,因为我无法想出如何做到这一点?

下面是一个示例,展示了我如何生成select元素的下拉列表。

    select name="location">
  <?php
     include("../includes/db_connect.php"); 
     $sql_loc = "SELECT description FROM location ORDER BY description ASC";
     $result_loc = mysqli_query($connection, $sql_loc);

     if(mysqli_num_rows($result_loc) > 0){
       while($row = mysqli_fetch_assoc($result_loc)){
       echo '<option value="' . htmlspecialchars($row['description']) . '">' 
       . htmlspecialchars($row['description']) 
       . '</option>';
     }
    }                                             

      ?> 
    </select>

至于输入元素,我是使用以下内容实现的:

<input type="text" name="serial" value="<?php echo $serial;?>">

可能是重复的问题:https://dev59.com/bXA75IYBdhLWcg3wAUJ9 - Blackbam
@Blackbam 仅供参考,您发布的链接包含一个非常不同的问题。 - Asish
@asish 是的,但是重复不是关于问题而是答案。我链接的线程包含了一个答案,你需要放置所选 HTML 属性,这样就能解决问题了。 - Blackbam
4个回答

3

试试这个:

<select name="location">
    <?php
        include("../includes/db_connect.php"); 
        $sql_loc = "SELECT description FROM location ORDER BY description ASC";
        $result_loc = mysqli_query($connection, $sql_loc);

        if(mysqli_num_rows($result_loc) > 0){
            while($row = mysqli_fetch_assoc($result_loc)){
                $selected = "";
                if ($row['description'] == $location) {
                    $selected = " selected";
                }
                echo '<option value="' . htmlspecialchars($row['description']) . '"' . $selected . '>' 
                . htmlspecialchars($row['description']) 
                . '</option>';
            }
        }                                             
    ?> 
</select>

2
这在 PHP 中是否可能实现?因为我无法想出如何做到?
是的,可以使用选项元素上的selected属性来保留所选的值。
例如,以下 <option> 标签包含该属性:
<option value="value2" selected>Value 2</option>

如果您关心XHTML验证,请使用selected="selected" - 有关更多信息,请参见此答案
<option value="value2" selected="selected">Value 2</option>

从 MDN 的 示例部分,关于 <select> 的文档中列出了以下 HTML:

<!-- The second value will be selected initially -->
<select name="select"> <!--Supplement an id here instead of using 'name'-->
  <option value="value1">Value 1</option> 
  <option value="value2" selected>Value 2</option>
  <option value="value3">Value 3</option>
</select>

使用PHP渲染选择列表

要使用PHP代码实现这一点,需要根据条件向选项中添加selected属性。

首先,在while循环之前,将所选位置存储在一个变量中:

$selectedLocation = ''; 
if (isset($_POST['location'])) {
    //Get selected value from values submitted with form
    //use $_GET if form is submitted via GET
    $selectedLocation = $_POST['location']; 
}

然后在 while 循环中,当找到匹配的选项时(即当 $selectedLocation == $row['description'] 时),设置 selected 属性。
while($row = mysqli_fetch_assoc()){
    $selected = ''; //default to empty string - not selected
    if ($selectedLocation == $row['description']) {
        $selected = 'selected';   
    }
    echo '<option value="' . htmlspecialchars($row['description']) . '" '.$selected.'>' 
   . htmlspecialchars($row['description']) 
   . '</option>';
 }  

this phpfiddle中查看演示。

2
此重复链接问题中所述,selected属性用于标记已提交的选项。 selected属性解决了使选定值可见的问题。
此外,您的代码可以通过以模块化方式将选择元素与(SQL)数据进行数据绑定而受益。
让我们暂时不考虑数据的检索,并假设它们来自生成器
/**
 * @param string $name of the select field
 * @param string $value of the select field
 * @param Generator $data to use as select field option values
 * @return string HTML of the select element
 */
function select($name, $value, Generator $data) {
    $buffer = sprintf('<select name="%s">', htmlspecialchars($name));
    foreach ($data as $option) {
        $buffer .= sprintf(
            '<option%s>%s</option>',
            $value === $option ? ' selected' : '',
            htmlspecialchars($option)
        );
    }
    $buffer .= "</select>\n";
    return $buffer;
}

您IP地址为146.190.162.183,由于运营成本限制,当前对于免费用户的使用频率限制为每个IP每72小时10次对话,如需解除限制,请点击左下角设置图标按钮(手机用户先点击左上角菜单按钮)。
<form method="post">

<?= select('location', $_POST['location'] ?? 'default value',
    datasource($connection, "SELECT description FROM location ORDER BY description ASC", "description")
) ?>

</form>

如果你有10个选择器,这个技术可以轻松采用。因为数据库连接是通过datasource函数传递的,所以看一下该函数实际上是如何工作的会很有趣。这个函数甚至更加简单:

/**
 * @param mysqli $mysqli
 * @param string $query
 * @param string $field from query result to use as option values
 * @return Generator
 */
function datasource(mysqli $mysqli, $query, $field) {
    $result = $mysqli->query($query);

    if ($result) foreach ($result as $row) {
        yield $row[$field];
    }
}

它在数据库连接上查询查询(这是一种与您的代码不同的写法,但它与您的示例中的$connection相同),然后遍历结果(如果有结果)。然后yield每个选项值。那个yield是从创建Generator函数返回的一种特殊形式,Generatorselect函数中用于输出,通过在那里的foreach循环中使用Generator。每次yield都成为Generator的一个迭代。
我希望这说明了如何将代码分解为函数的好处。更改的值应放入变量中。这可以通过创建函数并为这些值使用参数轻松完成。您可以将语言扩展到自己的特殊需求,例如创建选择元素。

0

编辑并尝试:

<select name="location">
<?php
    include("../includes/db_connect.php"); 
    $sql_loc = "SELECT description FROM location ORDER BY description ASC";
    $result_loc = mysqli_query($connection, $sql_loc);

    if(mysqli_num_rows($result_loc) > 0){
        while($row = mysqli_fetch_assoc($result_loc)){
            $selected = "";
            if ($row['description'] == $location) {
                $selected = " selected";
            }
            echo '<option value="' . htmlspecialchars($row['description']) . '"' . $selected . '>' 
            . htmlspecialchars($row['description']) 
            . '</option>';
        }
    }                                             
?> 


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接