ajaxでショッピングカート内のデータを動的に表示させるには？

練習用にECサイトを作っています。
ショッピングカートページの合計金額、合計個数をカートに入れた商品をセレクトボックスで個数を変更するようにしています。
変更すると、jQueryでイベントが発生して、商品IDと変更後の個数をajaxで送り、送り先でカート内のデータを更新しています。

コードで流れを説明すると、

html
1           　 <select name="product-num" data-productid="<?php echo $val['id']; ?>">
2                <?php for($i = 0; $i < 3num"0; $i++) : ?>
3                  <option value="<?php echo $i?>" <?php if ($i == $num)  echo "selected"; ?> ><?php echo $i?></option>
4                <?php endfor ; ?>
5              </select>

上のような感じのセレクトボックスです。

これを変更すると、以下のコードでajaxNumにデータを送ります。

jQuery
1  var $select = $('.js-select-num');
2  var selectProductId = $select.data('productid');
3  $select.on('change', function() {
4    var value = $select.val();
5     $(this).children('option').removeAttr('selected');
6    $.ajax({
7      type: "POST",
8      url: "ajaxNum.php",
9      data: {
10        productId : selectProductId,
11        number : value,
12      },
13    }).done(function( data ) {
14      console.log('Ajax success');
15
16    }).fail(function ( msg ) {
17      console.log('Ajax failure');
18    });
19
20    });

送り先のajaxNum.phpで合計金額、合計個数を格納している＄_SESSION['cart_total]を更新しています。

php
1$p_id = $_POST['productId'];
2$number = $_POST['number'];
3$productInfo = getProductDetail($p_id);
4
5foreach($_SESSION['cart_each'] as $key => &$val) {
6  // 変更した商品の個数とその合計金額を更新
7  if ($val['id'] == $p_id) {
8      $val['number'] = $number;
9      $val['price'] = $number * $productInfo['price'];
10    }
11  }
12  unset($val);
13  $_SESSION['cart_total']['num'] = 0;
14  $_SESSION['cart_total']['price'] = 0;
15  foreach($_SESSION['cart_each'] as $key => $val) {
16    // カート内の合計個数と合計金額を更新
17    $_SESSION['cart_total']['num'] += $val['number'];
18    $_SESSION['cart_total']['price'] += $val['price'];
19
20  }