Question

我需要根据下拉选项更改TextBox。这该怎么做？如在视图中，如果用户选择Fulll Name并输入用户名，则应该输入fullname，然后将其传递给控制器。目前我正在显示两个文本框。

视图

@model IEnumerable<AdminUpdate.Models.Employee>
@{
ViewBag.Title = "Web API";
}

<h2>Search for the User by Organization(Account) or Full Name(Contact)</h2>
<br />
<br />
<fieldset>

@using (Html.BeginForm("index","Home"))
{
    @Html.ValidationSummary(true)
    <div id="divUpdateDetails"></div>

        <text>Do you want to search by </text>
           @Html.DropDownList("FooBarDropDown", new List<SelectListItem>
                {
                    new SelectListItem{ Text="Full Name", Value = "1" },
                    new SelectListItem{ Text="Organization", Value = "2" },

                }) 

            @Html.TextBox("FullName")
            @Html.TextBox("Organization")

    <input type="submit" id="submitId" value="Search" />

}

`

View

Answer 1

包括

<script>

$(document).ready(function () {
   $("#Organization").hide();

}

$("#FooBarDropDown").change(function () {

        var selectVal = $("#FooBarDropDown").find(":selected").val();
        if(selectVal==1){
           $("#FullName").show();
           $("#Organization").hide();
        }
        else{
           $("#Organization").show();
           $("#FullName").hide();
        }

    });
</script>

Answer 2

你可以使用jQuery。我用我在实际项目中工作的脚本编辑了我的答案。最好隐藏文件加载时不是默认选项，例如Sumit raj在他的帖子中。

<script>
    $('#FooBarDropDown').change(function () {
        var selection = $(this).children(':selected').text();
        if (selection == 'Full Name') {
            $("#FullName").show();
            $("#Organization").hide();
        }
        else {
            $("#FullName").hide();
            $("#Organization").show();
        }
   });
</script>

Answer 3

感谢您的回答。这两个答案都帮助我使用了我没想过的jQuery。我在考虑使用c＃。下面的代码工作。

 <script>
    $(document).ready(function () {

        $("#DropDown").change(function () {
            if ($("#DropDown option:selected").val() == 1) {
                $("#FullName").show();
                $("#Organization").hide();
            } else {
                $("#FullName").hide();
                $("#Organization").show();
            }
        });

    });


</script>

静态DropdownList在视图中被选中

3 个答案: