ASP.Net MVC 视图，带有单选按钮列表和其他自由格式选择

Question

我正在整理问题以注册活动。

事件者注册问题之一是：

What is your main job function?
    Director/MD/Owner
    Manager
    Team Leader
    Other: Please state

我希望它显示为下拉框或我视图中的单选按钮列表，但也在"其他"单选按钮下方或旁边显示一个文本框，以便可以输入自由形式的"其他"工作职能。 在我看来，我将如何绑定它？

我怀疑我的模型将包含：

    [Display(Name = "What is your main job function?")]
    public string JobFunction { get; set; }

。其中，JobFunction 由上面的选定项填充。 但是，在我的控制器中，如果它是"其他"并将其替换为视图上的文本框，我将如何覆盖所选项目？

我相信这之前已经做过很多次了 - 所以谢谢你的任何帮助，

马克

Answer 1

许多方法中的一种方法是这样的：

视图：

  <div id="sample-dropdown">
    <select name="JobFunction " id="JobFunction" class="dropdown">
        <option value="Director/MD/Owner">Director/MD/Owner</option>
        <option value="Manager">Manager</option>
        <option value="Team Leader" selected="selected">Team Leader</option>
        <option value="Other">Other: Please state</option>   
    </select>
    <input name="JobFunctionOther" id="JobFunctionOther" />
</div>
<script type="text/javascript">
    $('input[name="JobFunctionOther"]').hide();
        $(function() {
                $("#JobFunction").change(
                    function() {
                        var val = $(this).val();
                        if (val =='Other') {
                            $('input[name="JobFunctionOther"]').show();
                        } else {
                            $('input[name="JobFunctionOther"]').hide();
                        }
                    }).change();
            });
</script> 

控制器：

public ActionResult DropDown(string jobFunction, string jobFunctionOther)
{
    if (!string.IsNullOrEmpty(jobFunctionOther)) jobFunction = jobFunctionOther;
    //do what you do
    return View(jobFunction);
}