javascript 提交表单后如何保持下拉菜单的选定值？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26139270/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to keep the dropdown menu selected value after form is submitted?
提问by Riffaz Starr
I am creating a very simple form with a dropdown menu and a text filed. It shows the errors if the form has empty field during the submission.
我正在创建一个非常简单的表单，其中包含一个下拉菜单和一个文本文件。如果表单在提交期间有空字段，它会显示错误。
I want to show the filled values after the form submission if there is any error.
It works on text field as I expected.
Ex: If fill the nameand submit the form without filling the titledropdown menu, it showing the name I typed on the filed during the the error is appeared.
如果有任何错误，我想在表单提交后显示填充的值。它按我的预期在文本字段上工作。例如：如果填写name并提交表单而不填写title下拉菜单，它会显示我在出现错误期间在提交时输入的名称。
But how can I do that for dropdown menu also?
Ex: If I select the titledrop down menu and submit the form without filling namefield, it should show the selected titledropdown value during the the error is appeared.
但是我该如何为下拉菜单做到这一点呢？例如：如果我选择title下拉菜单并提交没有填写name字段的表单，它应该title在出现错误期间显示所选的下拉值。
how can I do that? here is my code and it's a wordpress site:
我怎样才能做到这一点？这是我的代码，它是一个 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
}
?>
采纳答案by Jason W
although the answer by @CKocer can also work but I like to use variables instead and using $_POST in HTML and also more readable
虽然@CKocer 的答案也可以工作，但我喜欢改用变量并在 HTML 中使用 $_POST 并且更具可读性
In declare $name_titleout side of if($_POST)and can do it like this <?php $name_title = ''; ?>
在声明$name_title外面if($_POST)，可以这样做<?php $name_title = ''; ?>
For Drop Down code change like this
对于这样的下拉代码更改
<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>
回答by cKNet
Try this.
试试这个。
<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>
回答by halfer
I'll borrow @ThinkingWeb's code and tidy it up a bit. One of the great features of HTML tags is that you can line-break them, which makes for much more readable code. Each ifstatement here gets its own line:
我会借用@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>
I've dropped the selected="selected"in the first option - this will select automatically if there is no explicit selection, and you don't want more than one! I've switched all the selections to use the attribute="value"format, though I don't think it's mandatory for HTML.
我已经selected="selected"在第一个选项中删除了- 如果没有明确选择，这将自动选择，并且您不想要多个！我已将所有选项切换为使用该attribute="value"格式，但我认为这对 HTML 不是必需的。
I've used the colon form of the ifstatement too - for HTML I find it preferable to the brace approach.
我也使用了if语句的冒号形式- 对于 HTML，我发现它比大括号方法更可取。
