Загрузка альтернативного контента через вкладки и jQuery и JSP

Question

У меня есть таблица данных для типа политики (варианты «Одиночка», «Пара», «Семья» и «Семья с одним родителем»). Я хочу иметь интерфейс с вкладками, где каждый тип политики занимает одну вкладку. В то же время под соответствующей вкладкой отображается таблица данных, относящихся к соответствующему типу политики. Когда пользователь нажимает на другую вкладку, отображается другая таблица данных.

Я думал об экспорте данных из базы данных, а затем преобразовании их в XML и, следовательно, разборе их в HTML через XSLT и / или jQuery. Я думаю, что это излишне, поскольку это просто таблица.

Что я хотел бы сделать, это выполнить всю обработку на странице внешнего сервера, в данном случае JSP, и просто поменять фрагменты HTML. Таким образом, пользователь нажимает на вкладку, которая вызывает внешнюю JSP. Внешний JSP затем извлекает данные для соответствующей вкладки, строит таблицу, и затем это отображается на экране. Или может внешний JSP запросить базу данных, построить все четыре таблицы с уникальным идентификатором каждый, а затем jQuery загружает только таблицу, которая была вызвана. Наконец, было бы проще просто создать четыре отдельных HTML-кода через JSP, а затем вызывать их по отдельности? Если честно, я бы предпочел только один HTML.

Я не знаю, побеждает ли он объект AHAH, если таблицы создаются по запросу JSP и затем передаются клиенту. Я также был обеспокоен тем, что если мы запросим базу данных и создадим таблицы, то как она сможет обновлять содержимое таблиц, если данные базы данных изменятся?

Я также подумал, что все это можно сделать на странице, то есть построить 4 таблицы и скрыть те, которые не относятся к активной вкладке с отображением CSS: ни одной, но я не был уверен в доступности - подхватят ли программы чтения с экрана эти данные?

Извините, если это не имеет смысла, и я чувствую, что, возможно, пытаюсь усложнить это, но я просто пытаюсь найти лучший подход. И уже поздно: (

Answer 1

Рассматривали ли вы формат JSON ? Существуют Java API для плавного преобразования (сбора или сопоставления) объектов Javabean в формат JSON, например Google Gson . В JavaScript / jQuery вы можете прекрасно обрабатывать JSON, как если бы это был достойный объект JavaScript. Это сравнимо с Javabean в Java. Никаких накладных расходов, как при форматировании и разборе XML.

Вы можете создать Servlet, который записывает в ответ строку JSON, чтобы ее можно было вызывать с помощью jQuery $.getJSON(). Вот пример запуска, где Item - это вымышленный Javabean с тремя свойствами id, name и value:

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    List<Item> items = itemDAO.list();
    String json = new Gson().toJson(items);
    response.setContentType("application/json");
    response.setCharacterEncoding("UTF-8");
    response.getWriter().write(json);
}

Чтобы отобразить эти элементы в таблице, просто сделайте примерно так в jQuery:

<script>
    $(document).ready(function() {
        $.getJSON('json/items', function(items) {
            $(items).each(function(i, item) {
                var row = $('#table').append('<tr>');
                row.append('<td>').text(item.id);
                row.append('<td>').text(item.name);
                row.append('<td>').text(item.value);
            });
        });
    });
</script>

...

<table id="table"></table>

Вот и все! Надеюсь, что это дает новое понимание. Вы можете использовать это в событии click любой вкладки. Вы можете даже использовать одну и ту же таблицу для отображения, если она не сильно отличается. Просто сделайте $('#table').empty() заранее, чтобы избавиться от всех рядов.

Редактировать : я упустил одно важное соображение:

но я не был уверен насчет доступности - получат ли скрин-ридеры эти данные?

Программы чтения с экрана не будут выполнять JavaScript / CSS. Если это на самом деле showtopper, то вам нужно отбросить идею JS / jQuery и перейти к «простым ванильным» синхронным запросам с обычными <a> ссылками на каждой вкладке и воспользоваться преимуществами возможностей Servlet и JSP JSTL / EL для отображения содержание условно на основе параметров запроса.