ajax 调用后,控件的可见性不起作用

After ajax call, control's visibility is not working

在我的 ajax 调用之后,如下所示,我试图刷新 div(div 中有几个文本框控件)并使国家/地区下拉列表不可见。 divPersonalDetails 正在成功刷新。但国家下拉列表仍然可见。请让我知道如何让它不可见。

<div class="span3">
   @Html.DropDownListFor(model => model.CountryId, Model.CountryList, "--Please Select Country--", new { id = "ddlCountryId" })
   @Html.HiddenFor(model => model.CountryId, new { id = "hdnCountryId" })
   <div style="margin-top:4px">@Html.ValidationMessageFor(model => model.CountryId)</div>
</div>

 $("#btnSearch").click(function (e) {
    var idnumber = $("#txtDocumentNo").val();
    var url = '@Url.Content("~/")' + "signature/GetDetails";
        $.ajax({
            url: url,
            type: 'Get',
            data: $('#frmRegistration').serialize(),
            success: function (data) {
                var url2 = '@Url.Content("~/")' + "signature/GetDetails";
                $('#divPersonalDetails').load(url2 + ' #divPersonalDetails');
                $("#ddlCountryId").hide();
            }
        });
        return false;
});

隐藏元素时可能未加载元素,load元素加载时有回调

$('#divPersonalDetails').load(url2 + ' #divPersonalDetails', function() {
     $("#ddlCountryId").hide();
});

请像下面这样更改您的 JS 点击功能,然后尝试。

注意:我只在你的 JS 中更改了第一行

$(document).on('click', '#btnSearch'(function (e) {
var idnumber = $("#txtDocumentNo").val();
var url = '@Url.Content("~/")' + "signature/GetDetails";
    $.ajax({
        url: url,
        type: 'Get',
        data: $('#frmRegistration').serialize(),
        success: function (data) {
            var url2 = '@Url.Content("~/")' + "signature/GetDetails";
            $('#divPersonalDetails').load(url2 + ' #divPersonalDetails');
            $("#ddlCountryId").hide();
        }
    });
    return false;
});