如何在表单提交后保持下拉菜单的选定值


How to keep the dropdown menu selected value after form is submitted?

我正在创建一个非常简单的表单,其中包含下拉菜单和文本字段。如果表单在提交过程中有空字段,则会显示错误。

如果有任何错误,我想在表单提交后显示填写的值。正如我所期望的,它在文本字段上工作。例如:如果填写name并在不填写title下拉菜单的情况下提交表格,则会出现错误期间我在文件上键入的名称。

但我怎么能为下拉菜单做到这一点呢?例如:如果我选择title下拉菜单并在不填写name字段的情况下提交表单,则在出现错误时,它应该显示所选的title下拉值。

我该怎么做?这是我的代码,它是一个wordpress网站:

<?PHP
$errors = array();
    if($_POST["submit"]) {
        $name_title = $_POST["name_title"];
        $sender = $_POST["sendername"];
        //Check the name title that it is selected or none.
                if($name_title === none){
                    //if selected is none, add error to $errors array.        
                    $errors['name_title'] = "Please select the title of your name!";
                }
        if(empty($sender)){
            //Blank string, add error to $errors array.        
            $errors['sendername'] = "Please enter your name!";
        }
        // sending form
        if(empty($errors)){
            $mail_sent = wp_mail( $to, $subject, $mailBody, $headers ); 
        }       
    }
    if ($mail_sent) {
?>
<h1 style="color: #007f00;">Request sent.</h1>
<?php 
} else {
?>
<form id="" name="" action="<?php echo get_permalink(); ?>" method="post">
    <div class="label-input-wrapper">
        <div class="form-label">Title</div>
        <div class="form-input">
            <select name="name_title" class="name-title-input">                 
                <option value="none" selected="selected">Select Title</option>
                <option value="Mr">Mr</option>
                <option value="Mrs">Mrs</option>
                <option value="Miss">Miss</option>
                <option value="4">Ms</option>                   
            </select>
            <div class="error-msg">
                <?php if(isset($errors['name_title'])) { echo '<span style="color: red">'.$errors['name_title'].'</span>'; } ?>
            </div>  
        </div>
    </div>  
    <div class="label-input-wrapper">
        <div class="form-label">Name</div>
        <div class="form-input">
            <input type="text" name="sendername" value="<?PHP if(!empty($errors)) { echo $sender;} ?>" />
            <div class="error-msg">
                <?php if(isset($errors['sendername'])) { echo '<span style="color: red">'.$errors['sendername'].'</span>'; } ?>
            </div>
        </div>
    </div>
    <input type="submit" value="Submit" name="submit">
</form>
<?php
}  
?>

虽然@CKocer的答案也可以,但我喜欢使用变量,并在HTML中使用$_POST,以及更可读的

if($_POST)的外侧声明$name_title,可以像这样做<?php $name_title = ''; ?>

对于像这样的下拉代码更改

 <select name="name_title" class="name-title-input">                 
                <option value="none" selected="selected">Select Title</option>
                <option value="Mr" <?php if($name_title == 'Mr') { ?> selected <?php } ?>>Mr</option>
                <option value="Mrs" <?php if($name_title == 'Mrs') { ?> selected <?php } ?>>Mrs</option>
                <option value="Miss" <?php if($name_title == 'Miss') { ?> selected <?php } 
?>>Miss</option>
              <option value="4" <?php if($name_title == 'Ms') { ?>selected <?php  } ?>>Ms</option>                   
            </select>

试试这个。

 <select name="name_title" class="name-title-input">                 
                <option value="none" selected="selected">Select Title</option>
                <option value="Mr" <? if(@$_POST['name_title'] == 'Mr') { echo 'selected = '"selected'"'; } ?>>Mr</option>
                <option value="Mrs" <? if(@$_POST['name_title'] == 'Mrs') { echo 'selected = '"selected'"'; } ?>>Mrs</option>
                <option value="Miss" <? if(@$_POST['name_title'] == 'Miss') { echo 'selected = '"selected'"'; } ?>>Miss</option>
                <option value="4" <? if(@$_POST['name_title'] == 'Ms') { echo 'selected = '"selected'"'; } ?>>Ms</option>                   
            </select>

我将借用@ThinkingWeb的代码并对其进行一些整理。HTML标记的一个伟大特性是可以换行,这使得代码可读性更强。这里的每个if语句都有自己的行:

<select name="name_title" class="name-title-input">                 
    <option value="none"
        >Select Title</option>
    <option value="Mr"
        <?php if($name_title == 'Mr'): ?> selected="selected" <?php endif ?>
        >Mr</option>
    <option value="Mrs"
        <?php if($name_title == 'Mrs'): ?> selected="selected" <?php endif ?>
        >Mrs</option>
    <option value="Miss"
        <?php if($name_title == 'Miss'): ?> selected="selected" <?php endif ?>
        >Miss</option>
    <option value="4"
        <?php if($name_title == 'Ms'): ?> selected="selected" <?php endif ?>
        >Ms</option>                   
</select>

我已经在第一个选项中删除了selected="selected"——如果没有明确的选择,并且您不想要多个,这将自动选择!我已经将所有的选择都切换为使用attribute="value"格式,尽管我认为这对HTML来说不是强制性的。

我也使用了if语句的冒号形式——对于HTML,我发现它比大括号方法更可取。