Ajax не активировать, добавив выпадающий список для редактирования?

Question

У меня есть dropdownlistfor, и мне нужно сделать доступным для редактирования. проблема в том, что при вводе кода автозаполнения код работает нормально, но мой другой код ajax не работает и не вызывает точку останова. но когда я стираю код автозаполнения, мой другой код ajax работает, см. ссылку ниже. Спасибо заранее.

это мой код просмотра

 <div class="col-md-4">
            <div class="form-group">
                @Html.LabelFor(x => x.ClientId, new { @class = "form-label label-color" })
                @Html.DropDownListFor(x => x.ClientId, Model.Clients, "", new { @class = "form-control", @id = "s-clients" })
            </div>
        </div>

Это мой код редактируемого выпадающего списка для

 $(function () {
    $.widget("custom.combobox", {
        _create: function () {
            this.wrapper = $("<span>")
                .addClass("custom-combobox")
                .insertAfter(this.element);

            this.element.hide();
            this._createAutocomplete();
            this._createShowAllButton();
        },

        _createAutocomplete: function () {
            var selected = this.element.children(":selected"),
                value = selected.val() ? selected.text() : "";

            this.input = $("<input>")
                .appendTo(this.wrapper)
                .val(value)
                .attr("title", "")
                .addClass("custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left")
                .autocomplete({
                    delay: 0,
                    minLength: 0,
                    source: $.proxy(this, "_source")
                })
                .tooltip({
                    classes: {
                        "ui-tooltip": "ui-state-highlight"
                    }
                });

            this._on(this.input, {
                autocompleteselect: function (event, ui) {
                    ui.item.option.selected = true;
                    this._trigger("select", event, {
                        item: ui.item.option
                    });
                },

                autocompletechange: "_removeIfInvalid"
            });
        },

        _createShowAllButton: function () {
            var input = this.input,
                wasOpen = false;

            $("<a>")
                .attr("tabIndex", -1)
                .attr("title", "Show All Items")
                .tooltip()
                .appendTo(this.wrapper)
                .button({
                    icons: {
                        primary: "ui-icon-triangle-1-s"
                    },
                    text: false
                })
                .removeClass("ui-corner-all")
                .addClass("custom-combobox-toggle ui-corner-right")
                .on("mousedown", function () {
                    wasOpen = input.autocomplete("widget").is(":visible");
                })
                .on("click", function () {
                    input.trigger("focus");

                    if (wasOpen) {
                        return;
                    }

                    input.autocomplete("search", "");
                });
        },

        _source: function (request, response) {
            var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
            response(this.element.children("option").map(function () {
                var text = $(this).text();
                if (this.value && (!request.term || matcher.test(text)))
                    return {
                        label: text,
                        value: text,
                        option: this
                    };
            }));
        },

        _removeIfInvalid: function (event, ui) {

            if (ui.item) {
                return;
            }

            var value = this.input.val(),
                valueLowerCase = value.toLowerCase(),
                valid = false;
            this.element.children("option").each(function () {
                if ($(this).text().toLowerCase() === valueLowerCase) {
                    this.selected = valid = true;
                    return false;
                }
            });

            if (valid) {
                return;
            }

            this.input
                .val("")
                .attr("title", value + " didn't match any item")
                .tooltip("open");
            this.element.val("");
            this._delay(function () {
                this.input.tooltip("close").attr("title", "");
            }, 2500);
            this.input.autocomplete("instance").term = "";
        },

        _destroy: function () {
            this.wrapper.remove();
            this.element.show();
        }
    });
    $("#s-clients").combobox();
 });

, и этот мой другой код не работает, потому что затронут по автозаполнению кода выше.

$('#s-clients').on('change', function () {
    var client = $(this).val();
    $.ajax({
        type: 'POST',
        url: '@Url.Action("getclient", "order")',
        data: { client: client },
        dataType: "json",
        success: function (data) {
            debugger;
            $('#s-clients').val(data.ClientId);
            $('#s-states').val(data.StateId);

            getCitiesByStateId(data.StateId, client);
            //$('#s-cities').val(data.CityId);
            $('#txt-postcode').val(data.Postcode);
            $('#txt-address').val(data.Address);
        }
    });
 });

$(function () {
    $('.datetimepicker').datetimepicker();
});

$("#s-clients").on('change', function () {
    getStatesByCountryId($(this).val());
});

$("#s-states").on('change', function () {
    getCitiesByStateId($(this).val());
});

function getStatesByCountryId(id) {
    $.get("@Url.Action("getstatesbyclientcountryid", "location")", { clientId: id }, function (data) {
        $('#s-states').html(data);
    });
}

function getCitiesByStateId(id, clientId) {
    $.get("@Url.Action("getcitiesbystateid", "location")", { stateId: id, clientId: clientId }, function (data) {
        $('#s-cities').html(data);
    });
}