Ajaxポップアップを描画するのに最適な方法

Question

私は衣料品店のコンテンツ管理システムを開発しています。 CMSを介して追加/編集/削除することができます。私はZendフレームワークとjqueryも使用しています。私のアプリケーションは正常に動作します。しかし、サーバーは突然応答に時間がかかり始めました。それから、私がシステムを開発した方法に疑問があります。特に編集用のものです。

私はajaxポップアップを表示するには2つの方法があります。商品を編集するとします。

方法1：

、ユーザが編集ボタンをクリックすると、それがサーバから関連ページを要求します。私はポップアップごとに別々のビューを使用し、CSSを使用してデザインしました。 Zendフォームを使用してデータが入力されました。

方法2：

ページがロードされると、私は、編集画面の基本的なレイアウトを有するビューに別の要求を送信しました。最終的に、ページが読み込まれると、編集画面のソースが表示されます。データはありません。ユーザーが編集ボタンをクリックした場合。サーバーとサーバーに要求を送信し、JSONに応答します。次に、jsonを処理し、javascriptで編集画面に移入します。

これは複数のテキストです。しかし、私はあなたに私の問題を理解するためにすべてを書いた。どのような方法がこの種の作業に最も適しているかを正当化してください。

ありがとうございます。

Answer 1

あなたが、その後<div id="editPage" style="display:none;"></div>と、ページのどこかに隠された<div>を持っているのdivやショーを移入するためにHTMLとビューへのAJAX呼び出しを作ることができます。そうすれば、あなたはalltogtherのポップアップを避けることができます。だから、編集のために

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

のjQuery

使用して送信ボタンを、あなたは、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(); 
    }); 
}); 

アヤックスはjQueryを使って楽しさと簡単ですが、私見。

Answer 2

ポップアップやAJAXリクエストがあってもサーバーに大きな差はないようですが、うまく動作しないjavascriptがある可能性があります。

• 現在、すべてのサーバー要求が遅くなっていますか？
• 開発環境と運用環境で同等のパフォーマンスが得られますか？
• ブラウザデベロッパーツールを使用してネットワーク要求を監視すると、ページのレンダリングの最長部分がサーバーの待ち時間となりますか？