Заполнение раскрывающегося списка данными JSON с использованием 2 представлений / документов

У меня возникли проблемы с заполнением выпадающего списка некоторыми данными JSON, я подозреваю, что ошибка возникает из-за способа добавления $.post в div #stuff, но я пробовал это несколькими способами и просто не получаю Суть этого.

Тег select id="" & div находится в другом представлении (это не является частью этого конкретного документа), это проблема для заполнения раскрывающегося списка таким образом?

Я пытался предупредить "listItems", и у меня есть значения параметров и т. Д... не понимаю, почему он не заполняется.

Любая помощь будет оценена.

Json-ответ от $.post =

{"childrendata":[{"id":"42","parent":"1","fName":"hej","lName":"nisse","birthdate":"2011-10-21"}]}

JQuery/ JS:

 $("#stuff").append(function(){


                $.post("show_relations", {},
                            function(data)
                            {
                            $("#stuff").empty();

                            json = eval('('+data+')');

                                if(data == '{"childrendata":[]}')
                                {
                                    $("#stuff").append("No relations registered.");
                                }
                                else
                                {
                                  var listItems= "";

                                      for (var i = 0; i < json.childrendata.length; i++)
                                      {
                                        listItems+= "<option value='" + json.childrendata[i].fName + "'>" + json.childrendata[i].lName + "</option>";
                                      }

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

1 ответ

Решение

Изменить: На основании вашего комментария, я буду считать, что ваша проблема является чисто одностраничной.

Проблема с этим кодом может заключаться в том, что вы пытаетесь использовать .append() с функцией (которая является допустимой jQuery), но эта функция не возвращает ничего, что jQuery может добавить к "вещи" узел; $.post выполняет Ajax-вызов, который немедленно возвращается.

Вместо этого попробуйте что-то вроде следующего (изменив URL-адрес для вызова Ajax по мере необходимости):

$.post("url/to/post/to", {},
    function(data) {
        $("#stuff").empty(); //Clear your stuff div

        var children = data.childrendata; //jQuery automatically unserializes json

        if(children.length == 0) {
            $("#stuff").append("No relations registered.");
        }
        else {
            $('#stuff').append('<select id="child_list"></select>');
            $.each(children, 
                function(index, value) {
                    //Append each option to the selectbox
                    $("#child_list").append("<option value='" + value.fName + "'>" + value.lName + "</option>");
                }
            );
        }
    },
    'json'
);

$.each () - это общий итератор jQuery, который помогает избавиться от кода.

Это делает запись Ajax на предоставленный URL, который отвечает сериализованным объектом json. Обратный вызов принимает этот ответ (который jQuery уже сам не сериализовал), добавляет новый выбор в div '#stuff', а затем добавляет динамически созданные опции в новый выбор.

Примечание: Мои извинения за то, что я не публикую ссылку на документацию $.each, Stackru позволяет мне публиковать только 2 гиперссылки в одном посте.

Другие вопросы по тегам