Идеальный способ визуализации всплывающего окна Ajax

Question

Я занимаюсь разработкой системы управления контентом для магазина одежды. Они могут добавлять / редактировать / удалять через CMS. Я использую Zend Framework и JQuery тоже. Мое приложение работает нормально. Однако сервер неожиданно начал требовать гораздо больше времени для ответа. Затем у меня возникло сомнение относительно того, как я разработал систему. Специально для редактирования вещей.

У меня есть два способа отображения всплывающего окна ajax. Допустим, для редактирования продукта.

Метод 1:

После того, как пользователь нажмет кнопку редактирования, он запросит соответствующую страницу с сервера. Я использовал отдельное представление для каждого всплывающего окна и разработал его с помощью CSS. Данные были заполнены с использованием формы Zend.

Метод 2:

Как только страница загружается, я отправил еще один запрос к представлению, которое имеет базовую структуру экрана редактирования. Так что в конечном итоге у меня есть источник экрана редактирования после загрузки страницы. но без данных. Если пользователь нажимает кнопку редактирования. Он отправит запрос на сервер, а сервер ответит JSON. Затем я обрабатываю json и заполняю экран редактирования JavaScript.

Это больше текста. Но я написал все, чтобы понять вас, моя проблема. Пожалуйста, объясните, какой метод является наиболее подходящим для этого вида работы.

Спасибо.

Answer 1

У вас может быть скрытый <div> где-то на вашей странице с <div id="editPage" style="display:none;"></div>. Затем сделайте ajax-вызов для представления с HTML, чтобы заполнить этот div и показать его.Таким образом вы избежите всплывающих окон все вместе.Таким образом, используя Jquery

$('#editPage').load('/myEditAction/', function(){
  $('#editPage').show(); // you could even animate it in with a slider, etc.
});

для кнопки «Изменить», вы можете передать его обратно через ajax таким же образом:

//you'll have to use live here not bind, because it will come in via ajax...
$('#editSubmit').live('click', function(){
  $.post('/editSubmitAction',$('#edit-form').serialize(), function(data){
    //you can use the data from the post for thank you message, etc.
    $('#editPage').hide();
  });
});

Ajax - это весело и легко с Jquery, imho.

Answer 2

Маловероятно, что наличие всплывающего или AJAX-запроса имеет какое-либо существенное значение на вашем сервере, но возможно, что у вас есть некоторый JavaScript, который не работает должным образом.

• Теперь все запросы к серверу медленнее?
• Сравнима ли производительность в вашей среде разработки и производственной среде?
• Если вы используете инструменты разработчика браузеров для мониторинга сетевых запросов, показывает ли это, что самая длинная часть рендеринга страницы - это задержка с сервером?