使用 EditorFor 渲染的 MVC Kendo Dropdownlist 存在大量 javascript 相关问题

Question

这是相当复杂的，所以请多多包涵。

首先让我说我对 MVC 很陌生。即使是基础知识，我的经验也很少，但我使用 .NET/C# 的整体开发经验却很丰富。重点是，解决方案可能很简单，我只是不知道哈哈。

现在.. 我们有一个大型应用程序，它通过@Html.EditorFor() 渲染使用“EditorTemplates”（部分视图），以便根据需要根据数据库内容渲染自定义 UI 元素。

现在...我的任务是创建其中一个元素，由于我们系统的复杂性以及加载它只是为了测试需要多长时间，我决定首先以自己的独立开发我的 UI/Logic视图/控制器。

视图由 3 个级联的 Kendo 下拉列表组成，它们从控制器中的方法中提取数据（返回类对象列表）。

我在独立的视图/控制器中完美地完成了这项工作。

现在...我将控制器中的 HTML 和逻辑移植到“EditorTemplates”文件夹中的局部视图文件中，并首次运行我们的应用程序。

我立即收到一个 javascript 错误

“filterRabu2”未定义。

下面是相关代码：

<label for="rabu2">Rabu2:</label>
    @(Html.Kendo().DropDownList()
          .Name("rabu2")
          .HtmlAttributes(new { style = "width:300px" })
          .OptionLabel("Select ...")
          .DataTextField("Name")
          .DataValueField("ID")
                  .DataSource(source =>
                  {
                      source.Read(read =>
                      {
                          read.Action("GetRabu2", "Datasets")
                             .Data("filterRabu2");
                      })

                      .ServerFiltering(true);
                  })
            //.Enable(false)
          .AutoBind(false)
          .CascadeFrom("rabu1")
    )

<script>
    function filterRabu2() {
        return {
            rabu1: $("#rabu1").val()
        };
    }
</script>

现在...我通过将该函数移至页面中已包含的 .js 文件来消除该错误。

但是...当下拉列表呈现时，第一个（应该启用并存在数据）似乎被禁用并且不可点击。我确认我们的数据访问例程正在被命中并返回一个有效且填充的数据列表，就像它在独立视图中所做的（工作）一样。

这就是我所处的位置...我无法让 DDL 运行，并且该 JS 错误的存在导致我推测 JS 没有被呈现或允许正确执行？我不知道。

这是通过 @Html.EditorFor() 方法从循环内的另一个部分视图呈现的，该循环根据该数据呈现数据模板......这非常复杂......但我真的可以用手来弄清楚发生了什么开。

Answer 1

可能是 dom 在 javascript 执行之前渲染。尝试在

中向上调用调用方法

$(document).ready(
    function(){
        //initial method call here
}); 

这将确保 javascript 在 dom 加载后执行。