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

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

1 голос
/ 01 ноября 2011

У меня возникли проблемы с заполнением выпадающего списка некоторыми данными 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 Ответ

0 голосов
/ 01 ноября 2011

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

Возможно, проблема с этим кодом связана с тем, что вы пытаетесь использовать .append () с функцией (которая является допустимой jQuery), но эта функция не возвращает ничего, что jQuery может добавить к узлу 'stuff'; $. 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', а затем добавляет динамически созданные опции к новому select.

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

...