使用對象選擇選項通過Ajax請求加載數據時選擇選項的問題

Question

我已經在組合框中執行了使用C＃和ajax請求執行的REST服務，此對象顯示了我的REST服務的數據，此組合框必須填充來自許多城市的數據，這顯示了我在服務中執行的城市，但是不便之處在於對象組合框或html5中的select選項，每當我輸入對象時，它都會加載數據，而我無法選擇想要的城市，然后重新加載它，這是我想要選擇數據時的無限循環。碼

https://es.stackoverflow.com/questions/279794/problemas-en-mostrar-datos-en-combo-box-en-pantalla-con-petici%c3%b3n-ajax

<div class="form-group has-feedback">
    <label>Ciudad</label>
    <select class="form-control" data-rel="chosen"  id="Ciudad" name="Ciudad" onclick="ValidarExisteCiudad()">
        <option/>
        <option/>
    </select>
</div>

function ValidarExisteCiudad() {
    //$("[data-rel='chosen']").chosen();
    //var ddlCiudad = $("[data-rel='chosen']");
    var ddlCiudad = $("#Ciudad");
    ddlCiudad.empty().append('<option selected="selected" value="0" disabled = "disabled">Loading.....</option>');
        $.ajax({
            type: 'GET',
            url: "CargaCiudad",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {


                ddlCiudad.empty().append('<option selected="selected" value="0">Seleccione ...</option>');
                $.each(data, function () {
                   ddlCiudad.append($("<option></option>").val(this['Value']).html(this['Text']));

                });
                // After updated data from database you need to trigger chosen:updated.
                //$("[data-rel='chosen']").trigger("chosen:updated");
            },  
            failure: function (data) {
                alert(data.responseText);
            },
            error: function (data) {
                alert(data.responseText);
                existeUsuario = false;
            }
        });




}

[HttpGet]
        [AllowAnonymous]
        public async Task<IActionResult> CargaCiudad()
        {
            List<Cuidad> Items = await drHelpPrueba.Cuidad.ToListAsync();
            List<SelectListItem> ciudad = new List<SelectListItem>();

            for (int i = 0; i < Items.Count; i++)
            {
                ciudad.Add(new SelectListItem
                {
                    Value = Convert.ToString(Items.ToList()[i].IdCiudad),
                    Text = Items.ToList()[i].Nombre
                });
            }

            return Json(ciudad);

        }

ddlCiudad.append（$（“”）。val（this ['Value']）。html（this ['Text']）））;

未定義

Answer 1

我的朋友。 因為您沒有從響應中獲取真實數據。

嘗試遵循此。 希望對您有幫助，我的朋友:)）

function ValidarExisteCiudad() {

    var ddlCiudad = $("#Ciudad");
    ddlCiudad.empty().append('<option selected="selected" value="0" disabled = "disabled">Loading.....</option>');
        $.ajax({
            type: 'GET',
            url: "CargaCiudad",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {


                ddlCiudad.empty().append('<option selected="selected" value="0">Seleccione ...</option>');
                $.each(data, function () {
                    ddlCiudad.append($("<option>  </option>").val(this.value).html(this.text)); //Modified this line

                });
                // After updated data from database you need to trigger chosen:updated.
                //$("[data-rel='chosen']").trigger("chosen:updated");
            },  
            failure: function (data) {
                alert(data.responseText);
            },
            error: function (data) {
                alert(data.responseText);
                existeUsuario = false;
            }
        });




}