MVC jQuery在选择元素中找不到选项

Question

所以我有一个视图，其中我创建了一个(selectListItem的(，然后使用此列表在选择中填充选项，例如：

@ModelType MyModel
@Code
    ViewData("Title") = "Edit"
    Dim TypeList As IEnumerable(Of SelectListItem) = {
    New SelectListItem() With {.Value = "American", .Text = "American"},
    New SelectListItem() With {.Value = "Chinese", .Text = "Chinese"},
    New SelectListItem() With {.Value = "Mexican", .Text = "Mexican"},
    New SelectListItem() With {.Value = "Italian", .Text = "Italian"},
    New SelectListItem() With {.Value = "Japanese", .Text = "Japanese"},
    New SelectListItem() With {.Value = "Sandwich", .Text = "Sandwich"},
    New SelectListItem() With {.Value = "BBQ", .Text = "BBQ"},
    New SelectListItem() With {.Value = "Other", .Text = "Other"}
}
End Code
<h2>Edit MyModel</h2>
@Using (Html.BeginForm("Edit", "MyModel", FormMethod.Post, New With {.name = "frmEditMyModel", .id = "frmEditMyModel"}))
    @Html.AntiForgeryToken()
    @<div class="form-horizontal">
        <hr />
        <div class="text-danger">@(ViewData("mmError"))</div>
        @Html.HiddenFor(Function(model) model.ID)
......
        <div class="form-group" id="typecombo">
            @Html.LabelFor(Function(model) model.Type, htmlAttributes:=New With {.class = "control-label col-md-2"})
            <div class="col-md-10">
                <select class="form-control">
                    @For Each item In TypeList
                        @<option>@item.Text</option>
                    Next
                </select>
                @Html.HiddenFor(Function(model) model.Type, New With {.id = "type"})
                @Html.ValidationMessageFor(Function(model) model.Type, "", New With {.class = "text-danger"})
            </div>
        </div>
        <div class="form-group" id="typebox">
            <div class="col-md-2 col-xs-2" style="text-align:right"></div>
            <div class="col-md-10 col-xs-10">
                @Html.EditorFor(Function(model) model.Type, New With {.htmlAttributes = New With {.class = "form-control"}})
            </div>
        </div>
.......
    </div>  End Using

因此，这是对已经存在的事物的编辑页面，我希望选择元素可以选择等于mymodel.type的选项。最重要的是，如果类型为"其他"，请显示用户可以在其中输入它的文本框。所以这是我拥有的jQuery：

@Section Scripts 
    @Scripts.Render("~/bundles/jqueryval")
<script>
    $(function () {
        // First see if the current 'type' is in the dropdown options or not
        var exists = false;
        var curType = "@Model.Type";
        $('#typecombo option').each(function () {
            if (this.Text == curType) {
                exists = true;
                $("#typecombo select").val(curType).change();
            }
        });
        if (exists == false) {
            $("#typecombo select").val("Other").change();
        }
        // Toggle show / hide of Type textbox if selection in Type combo is 'Other'
        var selection = $('#typecombo :selected').text();
        selection.trim();
        if (selection === 'Other') {
            $('#typebox').show();
        }
        else {
            $('#typebox').hide();
        }
        $('#typecombo').change(function () {
            var selection = $('#typecombo :selected').text();
            selection.trim();
            if (selection === 'Other') {
                $('#typebox').show();
            }
            else {
                $('#typebox').hide();
            }
        })
</script>
End Section

无论出于何种原因，它都找不到已经存在的值。我尝试在页面打开时放置一个警报，该警报显示 @model.type - 正确显示。但这没关系 - 每次，它最终都会将所选值设置为"其他"并显示文本框，因为它在选择中没有找到它是一个选项。为什么??

Answer 1

看起来您需要更改此部分

        if (this.Text == curType) {
            exists = true;
            $("#typecombo select").val(curType).change();
        }

to

        if (this.text == curType) {
            exists = true;
            $("#typecombo select").val(curType).change();
        }

JavaScript是案例敏感性。注意这个。和DOM元素属性具有名称text