当 Ajax 调用中的下拉列表更改时 ListboxFor 不绑定

Posted 2023-05-08

【中文标题】当 Ajax 调用中的下拉列表更改时 ListboxFor 不绑定

【英文标题】：ListboxFor not Binding when dropdown change in Ajax call

【发布时间】：2018-10-18 06:06:13

【问题描述】：

当用户更改特定下拉列表时，我正在尝试加载 ListboxFor 控件。下面是我试图实现它的代码，但它不起作用。 任何人都可以指导我吗？提前致谢。

@html.ListBoxFor(c => c.ClientDemographicHospitalId, new MultiSelectList(Model.Hospitals, "Value", "Text"), new  ng_model = "hospitalDropdownList", @class = "HospitalListbox", style = "width:65%" )

$.ajax(
    url: '/Controller/ActionMethod',
    type: "POST",
    dataType: "JSON",
    data:  clientId: clientId ,
    success: function (data) 
        $("#ClientDemographicHospitalId").empty();
        $("#ClientDemographicHospitalId").append($('<option></option>').val(0).html("Select Hospital"));
        $.each(data, function (i, hospitals) 
            $("#ClientDemographicHospitalId").append($('<option></option>').val(hospitals.ClientDemographicHospitalId).html(hospitals.Name));
        );
    
);

public ActionResult GetHospitalsByClient(int clientId)

    JsonResult result = new JsonResult();
    var hospitals = GetHospital(clientId);
    if (hospitals != null)
    
        result.Data = hospitals.ToList();
        result.JsonRequestBehavior = JsonRequestBehavior.AllowGet;
    
    return result;

【问题讨论】：

什么不起作用？如果您在浏览器控制台中遇到任何错误怎么办？

我认为你需要在每个循环中使用 data.Data 而不是 data

或许也可以在这里粘贴您渲染的 HTML？

【参考方案1】：

也许您可以通过检查 DOM 元素来查看浏览器中呈现的 HTML？我认为问题可能就在那里，也是因为您从我假设的表中获取了 ID，并且您可能在 ListBox 中获取了一个 ID 为“20932”的 ID，并且您正在尝试调用 ID 为 #ClientDemographicHospitalId 的元素，这可能与您所指的不同，在这种情况下，您应该使用 HospitalListbox 类并调用 Jquery 元素，例如：

$(".HospitalListbox").empty();
$(".HospitalListbox").empty();
$(".HospitalListbox").append($('<option></option>').val(0).html("Select Hospital"));
$.each(data, function (i, hospitals) 
    $(".HospitalListbox").append($('<option></option>').val(hospitals.ClientDemographicHospitalId).html(hospitals.Name));
);

同样在AJAX调用成功里面，放一个console.log(data);以准确查看您正在接收哪些数据并希望将其放入这些元素中。

【讨论】：

JSON 代码返回：Array(4) 0：地址：null ClientDemographicHospitalId:1342 ClientDemographicMaster:null HospitalType:null NPI:null Name:"Butler Memorial Hospital 1447317896" Phone:null ReportName:null TaxId:null TaxonomyCode:null proto:Object 1: Address:null ClientDemographicHospitalId:1343 ClientDemographicMaster:null HospitalType:null NPI:null Name:"Butler Memorial Hospital - Clinic 1558428573" Phone:null ReportName:null TaxId:null TaxonomyCode :null

您能粘贴浏览器中呈现的 HTML 吗？