Question

Hi could someone help me out with this jQuery? I have:

$(document).ready(function () {

    window.refresh = function () { setorganisationddl; }

    var setorganisationddl = function () {
        if ($("#Invoice_AreaId option:selected").val() == "") {
            $("#Invoice_OrganisationId > option").remove();
            $("#Invoice_OrganisationId").append($("<option value=''>-- Select --</option>"));
            $("#Invoice_OrganisationId").attr("disabled", "disabled");
        }
        else {
            $.get('/Invoice/GetOrganisationSelectList/' + $("#Invoice_AreaId option:selected").val(), function (response) {
                $("#Invoice_OrganisationId").removeAttr("disabled");

                var organisations = $.parseJSON(response);

                var ddlOrganisations = $("#Invoice_OrganisationId");

                $("#Invoice_OrganisationId > option").remove();

                for (i = 0; i < organisations.length; i++) {

                    if (organisations[i].Value == $("#Invoice_OrganisationId option:selected").val()) {
                        ddlOrganisations.append($("<option selected='selected' />").val(organisations[i].Value).text(organisations[i].Text));
                    }
                    else {
                        ddlOrganisations.append($("<option />").val(organisations[i].Value).text(organisations[i].Text));
                    }
                }
            });
        }
    }

    $("#Invoice_AreaId").change(setorganisationddl);
});

So I have setorganisationddl being called when ddl with id Invoice_AreaId is changed. Great. However I also want it called when the page loaded.

As you can see I tried:

window.refresh = function () { setorganisationddl; }

which doesn’t work.

Answer 1

you just need to re-arrange your code a bit.

put a call to setorganisationddl in your document ready, and in the .change handler.

$(document).ready(function () {

    setorganisationddl();



    $("#Invoice_AreaId").change(function(){
         setorganisationddl();
    });
});

function setorganisationddl() {
    if ($("#Invoice_AreaId option:selected").val() == "") {
        $("#Invoice_OrganisationId > option").remove();
        $("#Invoice_OrganisationId").append($("<option value=''>-- Select --</option>"));
        $("#Invoice_OrganisationId").attr("disabled", "disabled");
    }
    else {
        $.get('/Invoice/GetOrganisationSelectList/' + $("#Invoice_AreaId option:selected").val(), function (response) {
            $("#Invoice_OrganisationId").removeAttr("disabled");

            var organisations = $.parseJSON(response);

            var ddlOrganisations = $("#Invoice_OrganisationId");

            $("#Invoice_OrganisationId > option").remove();

            for (i = 0; i < organisations.length; i++) {

                if (organisations[i].Value == $("#Invoice_OrganisationId option:selected").val()) {
                    ddlOrganisations.append($("<option selected='selected' />").val(organisations[i].Value).text(organisations[i].Text));
                }
                else {
                    ddlOrganisations.append($("<option />").val(organisations[i].Value).text(organisations[i].Text));
                }
            }
        });
    }
}