Блог

Главная - Вопросы по программированию - Выпадающие данные json с помощью jQuery отображают «неопределенный» результат

Выпадающие данные json с помощью jQuery отображают «неопределенный» результат

#jquery #json #model-view-controller

#jquery #json #модель-представление-контроллер

Вопрос:

У меня есть выбор, я хочу заполнить результат данными json, но данные отображаются как «неопределенные». Согласно сценарию, при нажатии кнопки данные в соответствии с выбранным идентификатором будут отсортированы по выпадающему списку.

 <select id="myDropDown" name="myDropDown"></select>
 
 function bindItems(MarkaID) {

        var MarkaID = 136; //entering data manually
        $.ajax({
            type: 'POST',
            dataType: "json",
            data: JSON.stringify({ MarkaID: MarkaID }),
            contentType: "application/json; charset=utf-8",
            url: '/Home/GetUrunCinsleriForMarka'
        }).done(function (jsonObj) {

            var listItems = "";
            for (i in jsonObj) {

                listItems  = "<option value='"   jsonObj[i].Key   "'>"   jsonObj[i].Value   "</option>";

            }
            $("#myDropDown").html(listItems);

        });
    }
 
 [HttpPost]
        public JsonResult GetUrunCinsleriForMarka(int MarkaID)
        {
            List<SqlParameter> sqlparameters = new List<SqlParameter>();
            sqlparameters.Add(new SqlParameter("@MarkaID", MarkaID));
            var urunCinsList = db.Database.SqlQuery<UrunCinsleriForMarka>("SP_GetUrunCinsleriForMarka @MarkaID", sqlparameters.ToArray());

            return Json(urunCinsList, JsonRequestBehavior.AllowGet);
        }

Пример идентификатора данных и значения, подобные этому

 96  | Power Supply
71  | Cameras
6   | Alarm Devices
118 | Mouse
11  | Fever-measuring devices
58  | Kettle
59  | ..............
137 | ..............
139 | ..............

Комментарии:

1. проверьте, получаете ли вы ответ JSON от вызова ajax или нет..

2. я проверил, что результат приближается

3. 0: {UrunCinsID: 96, URUNCINSID: «Источник питания» } 1: {UrunCinsID: 71, URUNCINSID: «Камеры»} 2: {UrunCinsID: 6, URUNCINSID: «Устройства сигнализации»} 3: {UrunCinsID: 118, uruncinsid: «Мышь»} 4: {UrunCinsID: 11, UrunCinsi: «Устройства для измерения температуры» } 5: {UrunCinsID: 58, UrunCinsi: «Чайник»} . . . .

4. Я добавил код JFiddle. Дайте ему попробовать jsfiddle.net/u5vek2jc

5. Спасибо за вашу помощь, это сработало.

Ответ №1:

Я создал пример кода для вашей проблемы. Пожалуйста, выполните следующий код:

HTML-КОД:

 <select id="questionNumber" class="form-control">
   <option>Select Number</option>
</select>

Код jQuery:

 var result = {data:[
    {
    id:"5",
    number: "5"
  },
  {
    id: "89",
    number: "89"
  }
]}
$.each(result.data, function (key, value) {
    $("#questionNumber").append($('<option>', {
        value: value.id,
        text: value.number,
        'data-mark': value.id
    }));
});

Ссылка на JSFIddle здесь:

https://jsfiddle.net/u5vek2jc/

Метки: