2012-01-13 6 views
0

問題の解決方法についてご意見をお聞かせください。ページ上の要素(表の行)の削除操作を処理することについてお答えします。我々はJSPと単純なサーブレットを使ってバックエンドと通信します。 また、この質問はanswers to question 1750822に関するものです。我々の場合にはベストプラクティス:要素を削除してページを再読み込み

、ページからそれらの要素の除去を達成するための多数の方法がある:

  1. のみ影響を受けた要素(複数可削除、AJAXを使用してページ、無AJAX
  2. を削除し、再ロード)をページから削除します。これは、呼び出しが成功した場合、ページ上に表示される

要素が保存されている「)location.reloadを(」javascriptのコードはもう少し手の込んだなります(下記参照。)

  • AJAXを使用して呼び出しますユーザーセッションに関連付けられたBean。パフォーマンス上の理由から、要素はページングされます。つまり、ユーザーが現在のページで参照する要素のみがデータベースからロードされ、Beanで参照されます。さらに、ユーザは、ページ上に表示すべき要素の数(例えば、10,20,50)を選択することができる。

    解決策1:
    この解決策の問題は、要素が削除された後、ページが自然に上にスクロールすることです。したがって、ユーザーは、50個の要素を表示し、数49を削除した場合、彼はスクロールダウンしている彼は、50

    要素に興味のあるべき解決策2:ここでの主な欠点は、ということは、Ajaxたら何が起こるかつまり、JavaScriptコード
    です削除された要素を置き換えなければならないため、呼び出しの戻り値は少し複雑になります。また、バルク操作も実行されています(たとえば、ページの要素2,5、および9を削除)。私はJSに堪能ではないので、これは懸念事項です。

    溶液3:
    選択した溶液。ここでの利点は、ブラウザ(少なくとも私がテストしたもの)がスクロール位置を '覚えている'ということです。もちろん、大きな欠点は追加のGET要求です。サーブレットは、この2番目のリクエストが要素の既に最新のリストを返すように実装されています。それでも、追加のリクエストです。


    これを行う別の方法がありますか?これについてあなたの意見は何ですか?すべてのオプションを考慮しましたか?

    乾杯、 クリス

  • +0

    私はあなたがオプションno.2と一緒に行くと思う。 – Apurv

    +0

    @Apurv:このオプションを選んだ理由をちょっと説明できますか? – Christof

    +0

    以下を確認してください – Apurv

    答えて

    2

    次のように2番目のオプションを実装することができる。

    1. (行を選択する)すべての行のチェックボックスを表示するには、の下部に削除ボタンを表示しますテーブル
    2. 削除ボタンをクリックすると、チェックボックスが選択されていることを確認してください。
    3. 少なくとも1つの行が選択されている場合は、サーバーへのAJAX呼び出しeleteサーブレット)、成功した削除操作のための受信インデックス
    4. を使用してデータベースから対応する値を削除し、サーバ側で
    5. (jqueryのを使用して、AJAXリクエストを作る方法を知っているために、このhttp://api.jquery.com/jQuery.ajaxをチェック)選択された行の行インデックスを渡しクライアントにいくつかの成功メッセージを送る(いくつかのJS)
    6. jQueryのは、上記のインデックスを持つ行を削除使用する(jqueryの、使用$(「#のtableRowId」)を使用して行を削除する)(削除;)
    +0

    ありがとうございます。私の質問は、「方法」についての「なぜ」の方向にもっとありました。私は私の最初の質問に基づいて解決策3を選択しました。 – Christof

    +0

    最初のオプションでは、ユーザーエクスペリエンスはあまり良くありません。場合によっては問題ないかもしれません。 2番目と3番目のオプションでは、ユーザーエクスペリエンスは非常に良いでしょう。 – Apurv

    関連する問題