asp.net多个下拉列表框级联怎么实现无刷新！！下拉列表框的数据都是从数据库中读取的！

Posted 2023-05-08

asp.net多个下拉列表框级联怎么实现无刷新！！下拉列表框的数据都是从数据库中读取的！

参考技术A js+ajax追问

有例子吗？就我看看，谢谢了！！

参考技术B 用jquery追问

有例子吗？

参考技术C 这个好办，用Ajax无刷新技术。。。追问

有例子吗

追答

例子得现做。。。
页面上 实现的是省、市的联动。。。要首先配置web.config

我这里只有简单粗略的描述，给我邮箱，我给你发过去。。。

追问

[e-mail]，谢谢你了！！

参考技术D 一个属性就好了 AutoPostBack 设为FALSE追问

数据收拾从数据库总读出来的，那你在什么地方加载子下拉列表框的数据

追答

AJAX啊 使用JS判断 然后在用JS方法对别的下拉框进行更改
用一般处理程序

如何在不加载视图的情况下重新加载/刷新部分视图中的级联下拉列表

【中文标题】如何在不加载视图的情况下重新加载/刷新部分视图中的级联下拉列表

【英文标题】：how to reload/refresh a cascade dropdown within a partial view without loading the view

【发布时间】：2021-08-18 22:54:36

【问题描述】：

我在互联网上搜索过这个，但找不到任何合适的答案。 我有一个部分视图，其中有三个不同的下拉列表。我在其中使用了两种不同的功能..

在更改第一个下拉菜单时，其他两个会更新 在更改第二个下拉菜单时，第三个会更新

在更改第二个下拉列表之前一切正常，如果我想再次更改第一个下拉列表，则第三个下拉列表不会加载并且不返回任何值。

 $("#FoodItemID").change(function ()   //
            var id = $("select#FoodItemID").val();
            $.ajax(
                url: '/FoodRecipe/GetServingType',
                type: "POST",
                data:  FoodItemID: $("select#FoodItemID").val() ,
                success: function (result) 
     
                    $("#ServingTypeID").val(result[0]);
                    $("#ServingSubTypeID").val(result[1]);

                
            );

        );

        $("#ServingTypeID").change(function () 
            $.ajax(
                url: '/FoodRecipe/GetServing',
                type: "POST",
                data:  ServingTypeID: $("select#ServingTypeID").val() ,
                success: function (result) 

                    var len = result.length;

                    $("#ServingSubTypeID").empty();
                    for (var i = 0; i < len; i++) 
                        var id = result[i]['id'];
                        var name = result[i]['name'];

                        $("#ServingSubTypeID").append("<option value='" + id + "'>" + name + "</option>");
                        $('#ServingSubTypeID').trigger('select:updated'); //this is not working for me
                    
                

            );
        );

这是我的下拉菜单代码。 我无法上传整个部分视图，因为它会导致加载后丢失所有值，我知道我遇到的问题与我更改第二个下拉列表后下拉列表中的值没有更新有关（因为值来自控制器更改）

所以我认为一个不错的选择是以某种方式重新加载第三个下拉列表中的值。 但是我不知道该怎么做..!!

我知道这可能是最简单的事情，但我想不通。

【参考方案1】：

在这上面花了 17 个小时后，我必须知道如何去做。这是我为任何像我一样困惑的未来读者所做的。

我回到我的控制器并加载了所有项目以及与我想要传递的特定 id 相关的特定项目并获取/获取项目。数据绑定了所有项目加载器，是的，它有效。并且所有上述脚本都保持不变。

这是我在控制器中所做的更改。

以前的控制器代码

 [HttpPost]               //Getting Sub Type and Serving Type on Food Item ID
    public async Task<IActionResult> GetServingType(int? FoodItemID)
    
        vmControllerMessage.APIExecutionBaseURL = APIUrls.APIApplicationPath;
        vmControllerMessage.APIExecutionURL = "APIFoodRecipe/GetServingTypes";
        vmControllerMessage.VMControllerObject = FoodItemID;
        HttpResponseMessage httpResponseMessage = PutJsonModelAPIWithNoRedirect();
        if (httpResponseMessage.StatusCode == System.Net.HttpStatusCode.OK)
        
            int[] i = JsonConvert.DeserializeObject<int[]>(vmServiceMessage.VMObject.ToString());
            return Json(i);
        
        else
        
            return Json(vmServiceMessage);
        

    

新代码

 [HttpPost]               //Getting Sub Type and Serving Type on Food Item ID
    public async Task<IActionResult> GetServingType(int FoodItemID)
    
        VMFoodRecipeDetail model = new VMFoodRecipeDetail();
        model.FoodItemID = FoodItemID;
        vmControllerMessage.APIExecutionBaseURL = APIUrls.APIApplicationPath;
        vmControllerMessage.APIExecutionURL = "APIFoodRecipe/GetServingTypes";
        vmControllerMessage.VMControllerObject = model;
        HttpResponseMessage httpResponseMessage = PutJsonModelAPIWithNoRedirect();
        if (httpResponseMessage.StatusCode == System.Net.HttpStatusCode.OK)
        
            VMFoodRecipeDetail obj = JsonConvert.DeserializeObject<VMFoodRecipeDetail>(vmServiceMessage.VMObject.ToString());
            ViewBag.ServingTypeID = new SelectList(obj.ServingTypes, "ID", "Name",obj.ServingTypeID);
            ViewBag.ServingSubTypeID = new SelectList(obj.ServingSubTypes, "ID", "Name", obj.ServingSubTypeID);
            int[] ids =  obj.ServingTypeID, obj.ServingSubTypeID ;
            return Json(ids);
        
        else
        
            return Json(vmServiceMessage);