2

jqueryショッピングカートを使用していますhttp://plugins.jquery.com/project/smartcart2 サーバー側でセッションを維持するためにAjax呼び出しを行うために、onAdded、onRemoved、onUpdatedメソッドを実装するのを手伝ってくれる人はいますか。オブジェクトが追加/削除/更新されるたびにサーバーで Ajax リクエストを行い、データを JSON 形式で取得します。サーバーからの更新と同じように数量をobj.attr("qty", eval(msg)[1]);更新します。ただし、更新を押すか、テーブルのデータが再入力されると、カートのアイテムはなくなります。したがって、実際の問題は、セッションからデータを入力して、更新などの際に製品がショッピング カートに残るようにする方法です。

$('#SmartCart').smartCart({ 
onAdded: function(pObj,quantity){ cartAdded(pObj,quantity);}, 
onRemoved: function(pObj){ cartRemoved(pObj);},
onUpdated: function(pObj,quantity){ cartUpdated(pObj,quantity); },
});

function cartAdded(obj,qty){
var product_id = obj.attr("pid");
var quantity = qty; 
// Ajax calls for adding product to cart
function(pObj,quantity){
    cartAdded(pObj,quantity);}
}

function cartRemoved(obj){
var product_id = obj.attr("pid");
// Ajax call for removing product from cart
}

function cartUpdated(obj,qty){
var product_id = obj.attr("pid");
var quantity = qty; 
// Ajax call for updating product on cart
}

function cartAdded(obj,qty){
            var partNum = obj.attr("partNumber");
            var quantity = qty;                
         $.ajax({
        type: 'POST',
        url: "json/sessionManager",
        data : "partNum=" + partNum + "&qty=" + quantity,
        dataType: "text/json",
        success: function(msg){
            obj.attr("qty", msg[1]);
        },
        error: function(httpRequest, textStatus, errorThrown) {
           alert("status=" + textStatus + ",error=" + errorThrown);
        }
    });  
        }

同じことをお勧めします。

4

1 に答える 1

4
  1. サーバー側でカートを実装します。
  2. カート オブジェクト (製品) をコレクションなどに保管します。
  3. Ajax リクエストがサーバー側に到着するたびに:

    • リクエストからデータ (product_id、quantity、...など) を取得します。
    • 操作タイプを取得します (追加、削除 ..)。
    • データの有効性を確認します。
    • 必要なサーバー側のビジネスを実行します (データベースの更新、Web サービスの呼び出しなど)。
    • すべて問題なければ、指定した製品をコレクションに追加/コレクションから削除します。
    • サーバー側のカートをJSONに変換し、Ajax 呼び出しの応答に書き込みます。
  4. JSON 応答がクライアント側に到着するたびに:

    • カートを新しいデータで更新します。

Ajax 部分の場合。jQuery Ajax()関数を使用する

$.ajax({
   type: "POST",
   url: "cart.jsp",
   data: "p_id=SKU001&quantity=4",
   success: function(msg){
     alert( "FOUR SKU001 ADDED TO CART");
   }
 });

編集:なるほど。product_id is undefined は、機能しobj.attr("pid");ていないことを意味します。

このプラグインは、製品定義に非表示の HTML 入力を使用します。(あなたが私に尋ねるなら、単純にばかげています)この入力には、で取得できる疑似obj.attr("pid");属性がいくつかあります。フォームに入力がない場合、または入力に疑似属性がない場合、コードは失敗します。

非表示の HTML 入力にこの疑似属性があることを確認してください。

例えば:

<div id="SmartCart" class="scMain">
  <input type="hidden" pimage="products/product1.jpg" pprice="2299.99" pdesc="" 
    pcategory="Computers" pname="Apple MacBook Pro MA464LL/A 15.4" pid="100">

  <input type="hidden" pimage="products/product6.jpg" pprice="2699.99" pdesc="" 
    pcategory="Computers" pname="Sony VAIO 11.1&quot; Notebook PC" pid="101">
  <input type="hidden" pimage="products/product3.jpg" pprice="550.00" pdesc="" 
    pcategory="Cameras" pname="Canon Digital Rebel" pid="102">
</div>

著者のドキュメントから:

説明:太字で示されているテキストは、製品について説明する疑似属性です。商品名、価格、説明など。

  • pid : 製品 ID
  • pname : 製品名
  • pdesc : 製品の説明
  • pprice : 商品の価格
  • pimage : 商品画像ソース
  • pcategory : 商品のカテゴリ

入力要素に新しい属性を追加することで、より多くの製品の詳細を追加できるため、テンプレートを編集して製品リストまたはカートに表示できます。疑似属性名をカスタマイズして、[属性設定] セクションのプラグイン ファイルで構成できます。

Edit2: 私の推奨事項のこのセクションで問題があると思います。

JSON 応答がクライアント側に到着するたびに:

カートを新しいデータで更新します。

以下の非表示の入力はデータです。スタックオーバーフローで別の質問を開いて質問してください

jQuery でこの入力を変更 (作成、更新、削除) するにはどうすればよいですか

<div id="SmartCart" class="scMain">
  <input type="hidden" pimage="products/product1.jpg" pprice="2299.99" pdesc="" 
    pcategory="Computers" pname="Apple MacBook Pro MA464LL/A 15.4" pid="100">

  <input type="hidden" pimage="products/product6.jpg" pprice="2699.99" pdesc="" 
    pcategory="Computers" pname="Sony VAIO 11.1&quot; Notebook PC" pid="101">
  <input type="hidden" pimage="products/product3.jpg" pprice="550.00" pdesc="" 
    pcategory="Cameras" pname="Canon Digital Rebel" pid="102">
</div>

最初の質問を解決した後、同じ投稿で別の質問をするのは悪い習慣だからです。

于 2011-03-30T23:02:27.767 に答える