HTML下拉列表 - 整理？

Question

我已经实现了一个html下拉列表，似乎一切都很好，只想整理一下：

1）当订单屏幕加载时，“选择”在下拉列表中显示为初始选项。 当用户点击下拉菜单时，仍会显示“选择”。 我想在选择下拉菜单时隐藏'select'，在视图中的一些选项我不见了？

2）明智的验证，我不能下订单，直到从下拉列表中选择一个选项。 这很好但是在我使用文本框并得到一个漂亮的大红色错误消息之前，现在我什么也得不到，我怎样才能通知用户必须选择一个选项？

<div class="editor-field">
@Html.DropDownListFor(x => x.Selected_BicycleModelId, Model.BicycleModels, "Select")
@Html.ValidationMessageFor(model => model.Order.BicycleModel)
</div>

更新

@Html.ValidationMessageFor(model => x.Selected_BicycleModelId)

已经解决了验证消息问题（感谢Roman Ko）。 关于'选择'消失的任何想法--JQuery？

Answer 1

尝试这个：

@Html.ValidationMessageFor(model => x.Selected_BicycleModelId)

当谈到'select'标题时，您可以尝试使用 - 例如 - jQuery删除它：

$(document).on('change', '#Selected_BicycleModelId', function () {
   $("#Selected_BicycleModelId option[value='']").each(function () {
       $(this).remove();
   });
});

有关详细信息，请参阅select中的jQuery删除选项 。

Answer 2

1. 这是不可能的。 <select>元素无法提供占位符值。 因此，Razor采用的常见解决方法是添加另一个具有空value属性的选项。 这出现在下拉列表中，因为它非常像该列表中的任何其他选项。 这是您的表单验证，无论是客户端还是服务器端，都使其不是“有效”选项。

2. 您需要提供更多信息以确定验证不再有效的原因。 特别是，属性和模型中的任何相关属性都会有所帮助。 请参阅@ RomanKo的回答。 我不想在这里张贴同样的东西来窃取他的雷声。 就我而言，我完全错过了它。