Question

曾几何时，我有一个使用此代码构建选项的DropDownList：

<%= Html.DropDownList("SomeName", someSelectList)%>

生成这样的HTML：

<select id="SomeName" name="SomeName">
<option>ABC</option>
<option>DEF</option>
<option>GHI</option>
<option>JKL</option>
</select>

表单提交将始终通过ModelBinding将上述选项之一返回给我的班级的公共成员“SomeName”。然后，我的内部验证代码将从内部字典中选择正确的数值。生活很美好。

然后我被要求显示在单独的文本框中通过Javascript / JQuery选择的数值。所以现在我有以下选择：

<select id="SomeName" name="SomeName">
<option value="50">ABC</option>
<option value="10">DEF</option>
<option value="25">GHI</option>
<option value="10">JKL</option>
</select>

以及以下JQuery代码：

$(document).ready(function() {
    $('#SomeName').change(function() {
        $("input#someNumber").val($('#SomeName').val());
    });
});

用户选择字符串并在框中显示数值。大。

现在的问题是，当Form被提交时，Model Binding获取数值（例如50）而不是String（例如ABC）

如何覆盖此行为并再次获取所选字符串？

Answer 1

发布表单时，始终会回发所选option的值。要获取option的文本，您需要一个服务器端查找表来将数值与名称相匹配。或者，您可以将select更改回原来的状态，并在JavaScript中显示查找表以显示数值，而不是在您的选项上放置value属性。

Answer 2

椒盐脆饼 - 尝试：

$("#SomeName option:selected").text();

事实上，上面的组合和$("#SomeName").val();应该为您提供所需的一切。

...欢呼声

Answer 3

椒盐卷饼，

正如我在评论中简要提到的，如果他们没有打开j，你应该“优雅”0.1％的非js用户和一些'消息'。这是我在模板中<body>标记之后立即执行的操作：

<noscript>
  <div id="noscript" class="readme">
    <p>Yoursite name requires that you have javascript turned on - 
    Follow <a target="_blank" href="http://www.google.com/support/bin/answer.py?answer=23852">
    this walkthrough</a> to enable javascript</p>
  </div>
</noscript>

这可以通过使用css nostyle stuff来另外设置样式：

noscript{
    background-color: red;
    color: white;
    border: 2px solid white;
    font-size: 1.2em;
}

或使用更好的方法为它使用定义的类：

.readme {
    background-color:#702444;
    color:#FFFFFF;
    display:block;
    margin:10px 5px;
    padding:10px;
    text-align:center;
    font-weight: bold;
    border: 6px solid #fff;
}

.readme a 
{
    color: #FFAC50;
}

等等...

再次欢呼

ASP.NET MVC DropDownList：获取所选文本（而不是值）

3 个答案: