gpt4 book ai didi

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

转载 作者:太空宇宙 更新时间:2023-11-03 20:17:37 26 4
gpt4 key购买 nike

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

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

} ebay example

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、演示或教程将不胜感激。桥

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

最佳答案

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

  • 不要尝试一次将所有数据加载到客户端
  • 只加载客户端实际需要的数据
  • 在数据库中进行过滤、搜索和排序,例如通过存储过程。特别是对于分布在多个表中的数据。
  • 优化你的数据库查询,索引很好
  • 始终牢记您期望同时进行多少次查询
  • 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

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

关于c# - 在 asp.net MVC 中使用 jQuery 和 AJAX 自动填充选择框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15717573/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com