Question

首先，我想说我不是前端的专家，这是我第一次挖掘ajax。所以这就是我想要做的事情：

我想更改并显示更新的值而不刷新整个页面..我唯一想要更新的是输入字段及其值，就是这样。如何只更新代码的那一部分？

这是我的树枝（当我按下+按钮时我增加了产品的数量，我希望树枝更新它而不刷新整个页面。就像在任何标准购物车中一样）：

{% for key, item in cart %}
    {% if key == info.id %}
        <div class="input-append">
            <input class="span1" style="max-width:34px" placeholder="{{ key }}" value="{{ item }}" id="appendedInputButtons" size="16" type="text" data-id="{{ key }}"/>
            <a href="javascript:void(0)" class="remove btn"><i class="icon-minus"></i></a>
            <a href="javascript:void(0)" class="add btn"><i class="icon-plus"></i></a>      
    {% endif %}         
{% endfor %}

这是剧本：

$(document).ready(function () {
    $(document).on('click', '.add', function (e) {
    $this = $(this);   
    $.ajax({
        type: 'POST',
        url: 'add/quantity',
        dataType: 'JSON',
        data: {product: $this.parent('.input-append').find('input').data('id'),quantity: $this.parent('.input-append').find('input').val()},
        success: function (data) {      
          if(data.success == false){
           alert('error')
          }else{
            document.location.reload(true);
           }
        }
    });
});   
});

目前我只有document.location.reload(true);重新加载整页，我该如何更改该代码？

行动：

public function addQuantityAction( Request $request ) {
    $response = new JsonResponse();
    $requestData = $request->request->all();
    $productid     = $requestData['product'];
    $quantity = $requestData['quantity'];
    /** logic*/
    $em = $this->getDoctrine()->getManager();
    $product = $em->getRepository('MpShopBundle:Product')->find($productid);
    $qtyAvailable = $product->getStock();
    $session = $this->getRequest()->getSession();
    $cart = $session->get('cart', array());
    if ( $qtyAvailable > $cart[ $productid ] ) {
        $cart[ $productid ] = $cart[ $productid ] + 1;
        $qtyAvailable = $qtyAvailable - 1;
        $response->setData(array('success'=>true,'message'=>'Qunatity increased'));
         $session->set('cart', $cart);
    } else {
        $response->setData(array('success'=>false,'message'=>'Out of stock'));
    }
    return $response;
}

Answer 1

您可以在添加/数量操作的响应中返回新值，并在页面上的所需位置输入：

success: function (data) {      
      if(data.success == false){
       alert('error')
      }else{
        // Assuming the value on data.amount
        $('.input-data input[type=text]').val(data.amount);
       }
    }

如果您愿意，请告诉我您的操作代码（添加/数量），并在那里提供帮助。

我希望它有所帮助

<强>更新

在您的行动回复中：

$response->setData(array(
    'success' => true,
    'message' => 'Qunatity increased',
    'amount'  => $cart[ $productid ]
));

Symfony2更新值并显示它们而不用ajax刷新

1 个答案: