c# - 在 asp.net MVC 中使用 jQuery 和 AJAX 自动填充选择框

Question

1-问题:我需要让用户能够从大量信息中选择一个或多个事物，这些信息被分组为层次结构以供选择、数据输入，数据可以有 4、5 个父类别的深度。

我正在寻找的 2 个功能: 类似于 eBay，在选择项目类别时会显示级联列表。当页面显示时，您只会得到第一个列表框。在第一个中选择一个后，将显示第二个。该过程一直持续到所选类别没有子类别为止。

}

3-实表及查询: 表:

-int Id

-字符串名称

-int ParentId

查询:

public IList<CategoryTable> listcategories(int parentId)

            {
            var query = from c in categorytable
                        where c.ParentId == parentId
                        select c;

                var result= query.ToList();
                return result;
}

4-我不知道如何开始，任何指南、现场示例 jsfiddle、演示或教程将不胜感激。 桥

更新:我相信这个功能在网络教程和问题中不是很发达。因此，我开始悬赏一个很好的答案。我将为之前评论过的功能的实例分配赏金。谢谢!

Answer 1

我通过处理大量数据学到的是:

• 不要尝试一次将所有数据加载到客户端
• 只加载客户端实际需要的数据
• 在数据库中进行过滤、搜索和排序，例如通过存储过程。特别是对于分布在多个表中的数据。
• 优化你的数据库查询，索引很好
• 始终牢记您期望同时进行多少次查询
• linq 很好，但在处理大数据时并不适用于所有情况
• 花时间思考和计划真正需要哪些数据

要在您的网页上显示数据，有许多 jQuery 插件可以列出您可以将函数绑定(bind)到“选定”事件的数据。例如 MVC4 自带的 knockOut.js。您可能不需要完全加载的 jQuery“hierachical-data-list-display”-plugin。也许您可以通过使用“选定”事件、ajax 加载和显示/隐藏功能来实现它。

根据您的评论，我会想到 jQuery 和 MVC 的组合:

• 在 MVC 中，我会创建一个像这样的局部 View

  @model MvcApplication.Models.DataModel
  
  <ol id="@Model.DataCategorieLevel">
  
  @for (var i = 0; Model.Data.Count > i; i++)
  {
      <li value="@Model.Data[i].ItemId" onclick="itemSelected(@Model.Data[i].ItemId, @Model.DataCategoryLevel);" >@Model.Data[i].ItemName</li>
  }
  
  </ol>
  

• javascript 可能是这样的:

    function itemSelected(selectedItemId, itemCategoryLevel) {
        // ajax call to an action which loads the next categorie items into the partial view and returns them
        // on success remove all lists with an category - level lower than itemCategoryLevel
        // append the returned List to the HTML-container which holds the lists
    }

• 在调用的 MVC-Action 中，我将确定它是否是最后一个类别级别。如果是最后一级，我会返回一个与其他 onclick 事件绑定(bind)不同的局部 View

在我开始寻找一些插件之前，这是我要尝试实现的