2016-08-30 5 views
0

私はショッピングカートのアプリケーションで作業しています。ユーザーがadd to cartボタンをクリックすると、私のコントローラー関数へのajax呼び出しで、ページに表示されるtotalPricetotalQtyの2つの値が返されます。私はjsonの値を返すことができました:{"totalPrice":100,"totalQty":1}。今、どのようにしてtotalPricetotalQtyを抽出し、ページの別の部分に表示しますか?ありがとう。ここLaravel 5:jsonを解読する方法をAJAX呼び出しから返しました

は私のコードである:ここ

<a data-id="{{ $product->id }}" class="btn btn-success addToCart" >Add to cart</a> 

は私のAJAXのコードである:ここ

<script type="text/javascript"> 
    $(function(){ 
     $.ajaxSetup({ 
      headers: { 
       'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') 
      } 
     }); 

     $('.addToCart').click(function(){ 
      var id = $(this).data('id'); 

      $.ajax({ 
       url : "{{ route('product.addToCart') }}", 
       type : "POST", 
       data : { 
        'id' : id, 
        "_token": "{{ csrf_token() }}" 
       }, 
       success:function(data){ 
        alert(data); // returns {"totalPrice":100,"totalQty":1} 
        // how do I decode and display data returned here? 
       } 
      }); 
     }); 

    }); 
</script> 

は私の制御方法であって、

public function addToCart(Request $request){ 
    $post = $request->all(); 
    $id = $post['id']; 
    $product = Product::find($id); 

    //some code is excluded to simplify this function 

    $total_price = 100; 
    $total_qty = 1; 
    $vals = array('totalPrice' => $total_price,'totalQty' => $total_qty); 
    $vals = json_encode($vals); 
    echo $vals; 
    exit(); 

} 

JSON値が返さ場所ですされています表示されるはずです:

<a href="{{ route('product.shoppingCart') }}"> 
Cart - <span class="cart-amunt">//display amount here</span> 
<span class="product-count"> //display totalQty here </span> 
</a> 
+0

try JSON.parse(data); –

答えて

3

はこれを試してみてください:

var response = JSON.parse(data); 

alert(response.col_name); // will print the column value 

Parse json documentation

1

Laravel's json responseを見てください。コントローラーで単にエコーすると、jsonレスポンスとして返すと文字列として返されます。あなたはちょうどあなたのjavascriptでdata.totalPriceとそれを参照することができます。

success:function(data){ 
       $(".product-count").html(data.totalQty); 
} 
1

あなたは、コントローラにjson_encode()エンコーディングされている場合にはJSON.parse()を使用することができます。

したがって、あなたはこのような何かを行うことができます。あなたは、コントローラでjson_encode()を行ういけないなら、あなたはJSON.parse()

2

せずに応答値にアクセスすることができますが、送信のためのAjaxメソッドを使用すると、受信したときにdataType:'json',を使用している場合、あなたがより良いデータ型

から使用して、この問題は解決されました。

、あなたが成功して使ってすることができます

success:function(data){ 
    alert(data.totalPrice); 
} 
2

あなたはLaravelからエンコードされたJSONデータを返却する場合は、jQueryの中で、あなたは、AjaxリクエストをしながらdataType:'json'を使用することができますし、それが自分自身をJSONに応答データを変換します、あなたドンJSONに手動で変換する必要はありません.jQueryがそれを行います。

$.ajax({ 
    ... 
    dataType:"json", 
    data : { 
     'id' : id, 
     "_token": "{{ csrf_token() }}" 
    }, 
    ... 
}); 

あなたはdataTypeで使用できる値の完全なリストについては、http://api.jquery.com/jquery.ajax/を参照してください。

関連する問題