2017-04-23 5 views
2

項目のリストで初めて呼び出されるJSPページがあります。 ドロップダウン(選択)を選択すると、選択したオプションに固有の製品を取得するAJAXコードがトリガーされ、より関連性の高い製品で製品リストを上書きしたいと思います。AJAXによって返されたリストと、ページのリスト参照にELを使用して設定する方法

「$ {products}」に設定する方法はありますか、divタグを隠して別の方法を表示するなどの別の方法を使用する必要がありますか。

私のJSPページ

<div> 
    <c:forEach var="p" items="${products}"> 
    <table> 
     <td>p.name</td> 
     <td>p.description</td> 
    </table> 
    </c:forEach> 
<div> 

マイスクリプト

// Ajax... 
success: function(result) { 
    if (result.length > 0) { 
    // want to set the products list with the list returned 
    } 
} 

マイコントローラー

public List<Product> MyController() { 
    // ... 
    List<Product> products = prodcat.getList() 
    return products 
} 

答えて

0

お返事をありがとう、私はあなたに私のアプローチを教えてみましょう。私はAJAX Jacksonを使用してビューの製品リストを渡そうとしました。私の製品(One)と評価(Many)間の双方向マッピングが暗黙のうちにオブジェクト変換にあったのは、製品の評価および評価の製品。 別のModelクラスを作成し、製品リストを送信する代わりに、必要な属性のみを製品クラスから設定しました。 最後に、私が受け取った新しい要素でdivタグを上書きしました。

0

あり、あなたの問題を解決するには、2つの方法がありますが、最初のあなたは、両方のJSPことに注意する必要がありますelはサーバー側のテクノロジなので、 eをサーバー側に設定して、ブラウザにレンダリングするクライアント側に送信されるHTML応答を生成します。そのため、初めて商品テーブルがクライアント側でレンダリングされると、JavaScriptを使用する必要がありますだから、最初の方法が別々JSPファイル(例えば、代わりにproductsオブジェクトを返すproducts_view.jspと でそのテーブルを置くことである代わりに/そのテーブルの内容

を削除するには、クライアント側で実行されるコード、あなたがModelAndViewを返しますあなたのコントローラメソッドのオブジェクト:

コントローラ

@RequestMapping(method=RequestMethod.GET, value="/products_view") 
public ModelAndView MyController() { 
    // ... 
    List<Product> products = prodcat.getList(); 
    model.addAttribute("products", products); 
    return new ModelAndView("products_view"); 
} 

products_view.jsp

<div id="products_table"> 
    <table> 
    <c:forEach var="p" items="${products}"> 
     <tr> 
     <td>p.name</td> 
     <td>p.description</td> 
     </tr> 
    </c:forEach> 
    </table> 
<div> 

AJAX

// Ajax... 
success: function(result) { 
    if (result.length > 0) { 
    $("#products_table").html(response); 
    } 
} 

他の方法は、あなたのコントローラからその製品リストのJSONまたはXML応答を返し、その後、あなたが移入されクライアントサイドのテーブルにJSONレスポンスがある場合は、依存関係リストにJackson個のjarがあることを確認してください

コントローラ

@RequestMapping(method=RequestMethod.GET, value="/products_view", produces="application/json") 
public @ResponseBody List<Product> MyController() 
    // ... 
    List<Product> products = prodcat.getList(); 
    return products ; 
} 

AJAX

// Ajax... 
dataType: "json", 
success: function(result) { 
    if (result.length > 0) { 
    var productTableHTML = '<table>'; 
    $.each(response, function (key,value) { 
     productTableHTML += 
     '<tr><td>' + key + '</td><td>' + value + '</td></tr>';  
    }); 
    productTableHTML += '</table>'; 
    $("#products_table").html(productTableHTML); 
    } 
} 
関連する問題