Функция JQuery не возвращает список JSON - Play Framework, JPA

Я новичок в Play и пытаюсь выполнить упражнение из вводного видео на Youtube (https://www.youtube.com/watch?v=bLrmnjPQsZc).

Я делаю несколько вещей по-другому. 1) Я использую более свежую версию Play (2.5 что-то). Я также использую JPA вместо eBean для своего уровня сохраняемости и локальную базу данных Postgres, а не базу данных h2 в памяти. Однако это не должно повлиять на мою проблему.

По сути, я добавил конечную точку GET "/persons", которая возвращает людей в моей таблице Person в формате JSON. Я подтвердил, что это работает и возвращает действительный JSON.

Однако My JQuery, похоже, не достигает этого. Основываясь на руководстве, я написал свой запрос в Coffeescript и теперь проверяю Javascript, в который он скомпилирован.

Вот кофескрипт:

$ ->
  $.get "/persons", (persons) ->
    $.each persons, (index, person) ->
      $('#persons').append $("<li>").text person.name

Вот переведенный javascript (находится по адресу http://localhost:8080/assets/js/index.js как и ожидалось):

(function() {
  $(function() {
    return $.get("/persons", function(persons) {
      return $.each(persons, function(index, person) {
        return $('#persons').append($("<li>").text(person.name);
      });
    });
  });

}).call(this);

//# sourceMappingURL=index.js.map

Это мой шаблон:

@(message: String)

@main("Welcome to Play") {

    <script type='type/javascript' src='@routes.Assets.versioned("js/index.js")'></script>

    <ul id="persons"></ul>

    <form action="@routes.HomeController.addPerson()" method="post">
    <input type="text" name="name" />
    <button>Add Person</button>
    </form>

}

"Добавить человека" работает. Я могу сохранять людей и видеть их, когда я вручную делаю http://localhost:8080/persons в мой браузер.

Очевидно, что мои навыки работы с javascript не так сильны, поэтому любая помощь в том, что может пойти не так, или как я могу устранить неполадки, почему li не заполняются, будет очень признательна.


java javascript jquery coffeescript playframework-2.5
person daniel9x    schedule 25.05.2016    source источник
comment
Я также только что заметил, что в return $('#persons').append($(‹li›).text(person.name); отсутствует одна дополнительная закрывающая скобка.   -  person bhietpas    schedule 26.05.2016

Ответы (2)


arrow_upward
1
arrow_downward

Похоже, в конце пропущена закрытая скобка.

(function() {
  $(function() {
    return $.get("/persons", function(persons) {
      return $.each(persons, function(index, person) {
        return $('#persons').append($("<li>").text(person.name)); //here
      });
    });
  });
}).call(this);

https://jsfiddle.net/8va4k4wu/2/

person bhietpas    schedule 25.05.2016
comment
Спасибо. Я попытался отказаться от кофескрипта (просто javascript) и изменить его, как вы сказали, к сожалению, такое же поведение. Не ли добавляют к ul - person daniel9x; 26.05.2016
comment
Я запустил jsfiddle и попытался сделать что-то подобное. Все эти функции и возвраты дают вам что-то? Я попытался немного упростить это, но мне любопытно знать. Дайте мне знать, если этот пример работает для вас. jsfiddle.net/8va4k4wu/1 - person bhietpas; 26.05.2016
comment
Я также заставил его работать, добавив дополнительную закрывающую скобку. Смотрите мои комментарии к вопросу. jsfiddle.net/8va4k4wu/2 Я смоделировал вызов $.get, используя лишь предполагаемый json. - person bhietpas; 26.05.2016

arrow_upward
0
arrow_downward

Я наконец-то понял. После вставки некоторых строк console.log в мой javascript и осознания того, что функция на самом деле не срабатывает, я понял, что в моем теге скрипта шаблона была опечатка:

<script type='type/javascript' src='@routes.Assets.versioned("js/index.js")'></script>

тип сценария должен быть «текст/javascript» вместо «тип/javascript».

Изменение этого привело к выводу консоли «ReferenceError: $ не определено», что быстро привело меня к этой проблеме, и предложенное решение сработало для меня:

Uncaught ReferenceError: $ не определен (с использованием игровой платформы)

person daniel9x    schedule 26.05.2016