使用对象选择选项通过Ajax请求加载数据时选择选项的问题

时间:2019-08-07 03:38:04

标签: javascript c# ajax

我已经在组合框中执行了使用C#和ajax请求执行的休息服务,此对象显示了我的休息服务的数据,此组合框必须填充来自许多城市的数据,这显示了我在服务,但不便之处在于对象组合框或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']));

未定义

1 个答案:

答案 0 :(得分:0)

我的朋友。因为您没有从响应中获取真实数据。

尝试遵循此步骤。希望对您有帮助,我的朋友:))

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;
            }
        });




}