首页 > 解决方案 > Dropdown's onchange is not triggered when selected value is set server side

问题描述

我有一个带有客户端 onchange 的下拉列表,用于填充 jQuery 数据表。如果另一个下拉列表的值发生更改并且在服务器端我重新填充第一个下拉列表并设置其选定值,则不会触发其 onchange 并且不会使用新数据更新数据表。

$(document).on('change', '#ddlFacility', function () {debugger
    var facilityID = this.value;

    if (facilityID > -1) {
        var facCertUrl = "services/easg.asmx/GetSomethingByFacilityID";
        var facCertParams = "{ 'FacilityID': '" + facilityID + "', 'Date': '" + $("#hfStartDate").val() + "' }";
        populteTable(facCertUrl, facCertParams, tblFacCert);
    }
});

function populteTable(ws_url, parameters, table) {
    $.ajax({
        type: "POST",
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        url: ws_url,
        cache: false,
        data: parameters,
    }).done(function (result) {debugger
        table.clear().draw();
        if (!result || result.d === "") {
            $('#divGrid').hide();
        }
        else {
            jResult = JSON.parse(result.d);
            table.rows.add(jResult).draw();
            table.columns([4, 5, 6, 7, 8, 9, 10, 11]).visible(false);
            $('#divGrid').show();
        }
    }).fail(function (jqXHR, textStatus, errorThrown) {debugger
        $('#divGrid').hide();
        alert(textStatus + ' - ' + errorThrown + '\n' + jqXHR.responseText);
    });
}

var tblFacCert = $("#fcTable").DataTable({
    ....
});

服务器端,当第二个下拉列表的值改变时:

protected void ddlDistrict_SelectedIndexChanged(object sender, EventArgs e)
{
    string sFacID = somehow_get_FacID();
    ListItem li = ddlFacility.Items.FindByValue(sFacID);

    if (null != li)
    {
        li.Selected = true; // This does not trigger onchange

        // This changes the selection and runs the onChange() event; but data table is now empty!
        ScriptManager.RegisterStartupScript(Page, Page.GetType(), "ddlFacility", "$(\"#ddlFacility\").val(\"" + li.Value + "\").change();", true);
    }
}

标签: javascriptc#jqueryasp.net

解决方案


推荐阅读