Spring boot + jquery отображение таблицы из базы данных

355

02 июня 2017, 10:34

Есть маленькое приложение на Spring boot. База данных MySQL. Нужно подгружать и показывать через JQuery при загрузке содержимое текстового столбца таблицы (из базы данных). Не очень хорошо знаю JQuery, поэтому не понимаю как это сделать. Вот контроллер:

@Controller
public class PersonController {
@Autowired
private PersonService service;
@RequestMapping("/")
public String welcome (Model model){
    List<Person> personList = service.getAll();
    model.addAttribute("PERSONS", personList);
    return "welcome";
}
@RequestMapping(value = "/addtext", method = RequestMethod.POST)
public String add(@RequestBody Person person) {
    service.addPerson(person);
    return "welcome";
}

вот часть jsp, где это реализовано было с помощью tablib :

 <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>Some text here</th>
                            </tr>
                        </thead>
                        <tbody>
                            <c:forEach var="person" items="${PERSONS}" varStatus="status">
                                    <td>${person.feedback}</td>
                                    </tr>
                            </c:forEach>
                        </tbody>
        </table>

Как тоже самое сделать на JQuery? Взять список из модели, пройтись for each и отобразить на странице (без tablib). Также есть текстовое поле формы, при нажатии кнопки данные это текстового поля должны сохраняться в базу данных (метод пост в контроллере)

<form class="form-inline" method="POST" action="addtext">
          <div class="form-group">
            <input type="text" class="form-control" id="exampleInputEmail3" placeholder="text" name="text" value="${person.feedback}" required>
          </div>
          <button type="submit" class="btn btn-default">Add some text</button>
        </form>

Как с помощью JQuerry записать эти данные в request, чтобы метод пост мог их взять оттуда?

заранее спасибо

Answer 1

Например так:

$.getJSON("ваш_url", function(data) {
  var tbody = $('.table tbody'); 
  tbody.empty();
  $.each(data, function(key, person) {
    tbody.append("<tr><td>" + person.feedback + "</td></tr>");
  });
});