Следует ли заменить использование addJSONData из jqGrid на использование setGridParam () и триггер ('reloadGrid')?

Question

Недавно я написал ответ на вопрос « jqGrid отображает сообщение« загрузка »по умолчанию при обновлении таблицы / при пользовательском обновлении ». При написании ответа я подумал: почему он использует функцию addJSONData () для обновления данных в сетке вместо изменения URL-адреса относительно setGridParam () и обновления данных jqGrid с помощью уважение к триггеру ('reloadGrid') ? Вначале я хотел порекомендовать использовать 'reloadGrid' , но подумав об этом, я понял, что не совсем уверен, как лучше. По крайней мере, я не могу объяснить в двух предложениях, почему я предпочитаю второй путь. Поэтому я решил, что это может быть интересным предметом обсуждения.

Итак, чтобы быть точным: у нас типичная ситуация. У нас есть веб-страница с хотя бы одним jqGrid и некоторыми другими элементами управления, такими как комбинированные поля (флажки), флажки и т. Д., Которые дают пользователю возможность изменять область действия информации, отображаемой в jqGrid. Обычно мы определяем некоторый обработчик событий, например jQuery("#selector").change(myRefresh).keyup(myKeyRefresh) и нам нужно перезагрузить контейнер jqGrid в зависимости от выбора пользователя.

После прочтения и анализа информации, полученной от дополнительных данных пользователя, мы можем обновить контейнер jqGrid как минимум двумя способами:

1. Выполните вызов $.ajax() вручную, а затем внутри успешного или полного дескриптора $.ajax, вызовите jQuery.parseJSON() (или eval) и затем вызовите addJSONData функцию jqGrid. Я нашел много примеров на stackoverflow.com, которые используют addJSONData .
2. Обновите url jqGrid на основе введенных пользователем данных, сбросьте текущий номер page на 1 и при необходимости измените заголовок сетки. Все это может быть сделано в отношении setGridParam () и, необязательно, setCaption () jqGrid. В конце вызовите функцию сетки ('reloadGrid') . Чтобы создать url , кстати, я использую в основном функцию jQuery.param, чтобы быть уверенным, что все параметры URL правильно упакованы относительно encodeURIComponent .

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

Можно сказать: я вызываю существующую веб-службу, преобразую полученные данные в формат jqGrid и вызываю addJSONData . Вот почему я использую метод addJSONData !

ОК, я выберу другой путь. jqGrid может напрямую вызывать веб-сервис и заполнять результаты в сетке. Существует множество опций jqGrid, которые позволяют настроить этот процесс.

Прежде всего, можно удалить или переименовать любой стандартный параметр, отправленный на сервер в отношении опции prmNames jqGrid, или добавить дополнительные параметры в отношении postData опция (см. http://www.trirand.com/jqgridwiki/doku.php?id=wiki:options).. Можно изменить все созданные параметры непосредственно перед тем, как jqGrid сделает соответствующий запрос $.ajax, определив функцию serializeGridData () (еще одна опция jqGrid). Более того можно изменить каждый параметр $.ajax, установив параметр ajaxGridOptions в jqGrid. Я использую ajaxGridOptions: {contentType: "application/json"}, например, в качестве общего параметра $.jgrid.defaults. Опция ajaxGridOptions очень мощная. Что касается опции ajaxGridOptions , можно переопределить любой параметр $.ajax запроса, отправляемого jqGrid, например error , complete и beforeSend События. Я считаю потенциально интересным определить событие dataFilter , чтобы иметь возможность вносить любые изменения в данные строки, возвращаемые с сервера.

Еще один аргумент в пользу использования триггера ('reloadGrid') - это блокировка jqGrid во время обработки запроса AJAX. В основном я использую параметр loadui: 'block' для блокировки jqGrid при отправке JSON-запроса на сервер. Что касается плагина jQuery blockUI http://malsup.com/jquery/block/, можно блокировать больше частей веб-страницы только в виде сетки. Для этого можно позвонить:

jQuery('#main').block({ message: '<h1>Die Daten werden vom Server geladen...</h1>' });

перед вызовом триггера ('reloadGrid') и jQuery ('# main'). Unblock () внутри loadComplete и loadError функции. В этом случае для параметра loadui может быть установлено значение «отключить».

И мое последнее замечание: в основном я использовал для создания jqGrid с типом 1108 *, установленным в 'local' вместо 'json', и я бы назвал триггер ('change') Функция некоторых элементов управления (один из выпадающих списков), таких как: jQuery("#selector").change(myRefresh).keyup(myKeyRefresh).trigger('change'). Таким образом, я создаю параметр url в jqGrid только в одном месте внутри дескриптора изменения и меняю тип данных на 'json' внутри описанного выше setGridParam () .

Так что я не понимаю, почему функцию addJSONData () следует когда-либо использовать.

Может ли кто-нибудь, кто использует функцию addJSONData () , объяснить мне преимущества ее использования?

Чтобы быть справедливым, я могу добавить, что addJSONData () , который существует в более старых версиях jqGrid, как обладающий большинством функций, которые я здесь описываю. Следует ли заменить использование addJSONData в jqGrid на использование setGridParam () и trigger ('reloadGrid') ?

Answer 1

Я использовал addJSONData с jqgrid, но это было 1 год назад, с тех пор многое изменилось в jqGrid.

В любом случае, мне потребовались тяжелые и сложные манипуляции с графическим интерфейсом на стороне клиента (общие банковские ресурсы), мои данные Json были только локальными и отправлялись на сервер в виде некоторой точки jkey (задание завершено). У меня было несколько jqgrid (некоторые из них внутри других jqgrids :-)) и какое-то локальное хранилище данных в браузере, которое было достаточно маленьким, чтобы оставаться в браузере, сложным и достаточно подвижным, чтобы его можно было использовать в разумные сроки с помощью AJAX IO.

Первая версия использовала Ajax IO, когда меня охватили проблемы с блокировками и ожиданием, а также с появлением новых сложных GUI-компонентов, я был очень рад найти этот хук addJSONData и у меня есть собственная временная шкала ajax вне jQgrid.

Answer 2

Я использую addJSONData для улучшения производительности на странице. Вот мой вариант использования

У меня есть 4 jqGrids на странице. Метод извлечения данных одинаков для всех 4 сеток, но столбцы и строки различны в каждой сетке. Поэтому вместо того, чтобы делать 4 серверных вызова для заполнения данных в каждой сетке, я делаю один вызов, который возвращает дополнительные данные JSON для остальных 3 сеток. А в событии loadComplete первой сетки я разделяю данные для каждой из трех других сеток и загружаю их по отдельности. Вот урезанная версия события loadComplete первой сетки

 loadComplete:function (data) {

        //clear and reload area summary table
        var areaSummary = data.areaSummary;
        jQuery("#areaSummaryTable").jqGrid('clearGridData');
        jQuery("#areaSummaryTable")[0].addJSONData(areaSummary);

        //clear and reload area total table
        var areaTotal = data.areaTotal;
        jQuery("#areaTotalTable").jqGrid('clearGridData');
        jQuery("#areaTotalTable")[0].addJSONData(areaTotal);

        //clear and reload area detail table
        jQuery("#detailedAreaTable").jqGrid('clearGridData');
        var areaDetail = data.areaDetail;
        jQuery("#detailedAreaTable")[0].addJSONData(areaDetail);
    }

Это работало очень хорошо в течение последних 2 недель, пока сегодня я не заметил, что при загрузке страницы каждая из 3 сеток выполняет серверные вызовы на случайный URL. Причиной этого оказалось то, что тип данных для этих сеток был определен как «json». Если я изменю тип данных на «локальный», серверные вызовы из этой сетки не будут выполняться, но метод addJSONData в приведенном выше коде перестанет работать. Я попытался использовать setGridParam, чтобы изменить тип данных на json, прежде чем использовать addJSONData, как показано ниже, но это также не работает.

        jQuery("#areaSummaryTable").jqGrid('clearGridData');
        jQuery("#areaSummaryTable").jqGrid('setGridParam', {datatype:'json'});
        jQuery("#areaSummaryTable")[0].addJSONData(areaSummary);

Я надеюсь, что есть простой способ преобразовать данные в массив и использовать addRowData :) Дайте мне знать, если есть лучший способ справиться с таким вариантом использования

Answer 3

Простота построения сетки / данных с сервера. Одна из главных причин, по которой я использую JSON, заключается в том, что он меньше XML и хорошо работает как на стороне сервера (PHP), так и на стороне клиента (JS). И в результате я стандартизировал (и я знаю, что некоторые делают) передачу данных между JSON.

Следовательно, addJSONData предоставляет простой способ постоянно обновлять все данные в сетке и отображать их за один раз. Это быстро, быстро, грязно, и это работает.

Однако лично в конечном итоге это будет плохой идеей с постоянно обновляющейся большой сеткой данных. И именно там, обновления для конкретной ячейки / столбцов, после первоначального получения, гораздо лучше иметь 2 вызова. Отправьте изменения сетки на сервер и получите изменения от сервера.

Итак, одним из главных преимуществ этого является быстрый старт. А когда данные становятся слишком большими, опция добавления всех понижается, чтобы происходить только один раз в начале. В то время как отдельные обновления / получения могут быть добавлены, после получения начальных данных.

Хороший рабочий цикл: быстрый прототип -> Эффективная сетка данных клиент-сервер

Answer 4

Я использую метод addJSONData для целей подкачки, как описано ниже.

При загрузке страницы jqgrid загружается с данными JSON, возвращаемыми URL-адресом. Нам нужна функциональность следующей страницы, но без необходимости переключать страницы. Т.е. изначально страница 1 загружена, скажем, 10 записями. Когда я нажимаю кнопку «Далее» (NavButton), вместо загрузки следующих 10 записей на следующей странице, я хочу, чтобы все 20 записей отображались на самой странице 1.

Здесь, во втором и последующих запросах, я использую метод addJSONData. Я делаю ajax вызов по нажатию кнопки Next, а затем использую addJSONData, чтобы добавить данные json к существующим 10 записям. Я не могу использовать setGridParam, потому что когда я использую это, первые 10 записей исчезают, и он просто загружает следующие 10 записей на той же странице.

Если у вас есть какая-либо альтернатива для addJSONData для этой конкретной функции, я буду рад узнать. Поскольку у меня возникают проблемы с расширением Subgrid, панелью инструментов Filter и т. Д., Когда следующий набор записей загружается с использованием addJSONData.

Answer 5

Когда вам нужно полностью контролировать, как и когда отправляется ajax, вы предпочтете использовать addJSONData.

например. Форма поиска содержит два поля <select>, оба заполнены ajaxly, значение первого select повлияет на второе. Возможно, что пользователь установил значение по умолчанию для полей select. И вы хотите искать в сетке только после того, как два значения определены.

Тогда предпочтительнее использовать такие вещи, как $.Deferred, чтобы контролировать порядок выполнения вызовов ajax и заполнения. Конечно, вы можете установить данные jqgrid как local, затем json, а затем reloadGrid, чтобы управлять запуском. Но это не тот триал.

Answer 6

Вот почему я использую addJSONData () ...

В моем случае у меня есть одна страница, которая содержит сетку данных, и другая страница, которая используется для построения критериев поиска.

Страница поиска, которая ничего не знает о странице сетки, содержит семь полей.Пользователь может заполнить хотя бы одно или все семь полей.

После отправки страница поиска форматирует данные в виде пар ключ / значение в объекте JSON, который отправляется на сервер.

На сервере данные JSON анализируются в предложении SQL WHERE.

Результаты данных SQL отправляются обратно клиенту в виде объекта JSON в ответе HTTP, который также создает страницу сетки из кода, отправленного с сервера.

Насколько я знаю, единственный способ получить данные JSON из HTTP-ответа в сетку - это использовать addJSONData ().

Chris