Question

所以，我对MVC的这些东西还是比较陌生的，但是我在ASP.Net上已经有10年了，而且我在asp.net网页上的表现如此简单或干净，简单的JavaScript让我花了很多时间来解决。

问题是，我正在为几种类型的项目创建一些基本模板，因此，我的控制器和视图上有CRUD操作。到目前为止，一切正常。

现在，我的控制器的CRUD操作，我正在将它们加载到模态窗口上，并且出于UI目的，我正在使用BootStrap。创建，编辑，删除或查看详细信息视图加载在索引视图上调用的模态窗口上没有问题，为此我使用$("#modalContent").load(url)然后$("#modal").modal("show")，小菜一碟，并且已经工作到目前为止正确。我只是遇到了一个我遇到问题的情况。

在一个视图中，我有这个下拉列表，其中一个值必须显示另一个下拉列表，其中将分配模型属性的最终值。这是前面提到的视图代码

@model Sysbat.Models.Property

@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_DetailsLayout.cshtml";
}


@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Create</h4>
    </div>
    <div class="modal-body" onload="setDDLEvents">
        <div class="editor-field form-group input-group">
            @Html.LabelFor(model => model.Name, new { @class = "input-group-addon" })
            @Html.EditorFor(model => model.Name, new { @class = "form-control" })
        </div>
        @Html.ValidationMessageFor(model => model.Name)
        <div class="editor-field form-group input-group">
            @Html.LabelFor(model => model.Type, new { @class = "input-group-addon" })
            @Html.DropDownList("ddlSimpleType", (SelectList) ViewBag.ListTypes, new { @class = "form-control", id = "ddlSimpleTypes" })
        </div>
        <div id="complexType" class="editor-field form-group input-group" style="display:none">
            @Html.Label("Complex Type", new { @class = "input-group-addon" })
            @Html.DropDownList("ddlComplexType", (SelectList) ViewBag.ListComplexTypes, new { @class = "form-control", id = "ddlComplexTypes" })
        </div>
        @Html.HiddenFor(model => model.Type, new { id = "hdnTypeValue" })
        @Html.ValidationMessageFor(model => model.Type)
    </div>
    <div class="modal-footer">
        <input type="submit" value="Create" class="btn btn-success" />
    </div>
}
@section scripts {
    @Scripts.Render("~/bundles/jqueryval")
    <script type="text/javascript">
        $(function() {
            $("#ddlSimpleTypes").on("change", function () {
                var val = $(this).val();
                if (val === "Complex") {
                    $("#hdnTypeVal").val('');
                    $("#ddlTiposObjetos").show();
                }
                else {
                    $("#hdnTypeVal").val(val);
                    $("#ddlTiposObjetos").hide();
                }
            });
            $("#ddlComplexTypes").on("change", function){
                    $("#hdnTypeVal").val($("#ddlComplexTypes").val());
            });
        };
    </script>
}

因此，如果代码不清楚，ddlSimpleType所拥有的任何值将通过隐藏字段存储在model.Type属性中绑定到，但是，如果ddlSimpleType下拉列表是设为'复杂'。然后将显示复杂类型的下拉列表及其值设置，这也将将所选值存储到前面提到的隐藏字段。

我面临的问题是，没有触发设置字段事件的功能。

我已经读过部分视图不可能做这种事情，但这是完整的视图，而且，我不想为每个使用特殊javascript逻辑的视图创建单个js，我rahter把它内联。

有什么建议吗？

如果有任何帮助，这是布局代码

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    <div id="wrapper">
        @RenderBody();    
    </div>
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)
</body>
</html>

Answer 1

好吧，最后我得到了一个回答就在我面前的答案。

我使用$(document).load()进行了测试，这是我最喜欢的方法，一旦页面加载就执行代码，但是，我记得还有一个ready语句，所以我用$(document).ready()进行了测试，它运行完美无瑕

在模态窗口MVC4上显示下拉列表

1 个答案: