javascript - ajax提交表单不刷新整个页面只刷新ATG中的特定div标签

Question

这是我的表格

<dsp:form  id="add-to-cart" action="#?productId=${prodId}" method="post">
            <dsp:input bean="CartModifierFormHandler.addItemCount" value="1" type="hidden" />
            <dsp:input  bean="CartModifierFormHandler.items[0].quantity" value="1" type="hidden" id="quantityval"/>
            <dsp:input bean="CartModifierFormHandler.items[0].catalogRefId" value="${skuId}" type="hidden" />
            <dsp:input id="productIdd" bean="CartModifierFormHandler.items[0].productId" value="${prodId}" id="productIdd" type="hidden" />
            <dsp:input bean="CartModifierFormHandler.items[0].commerceItemType" value="default" type="hidden" />
            <dsp:input bean="CartModifierFormHandler.addItemToOrder" type="submit" value="Add To Cart" class="btn btn-primary btnpadding" id="cartSubmit"/>
</dsp:form>

这是我的ajax代码

    $(document).ready(function() {
        $("#cartSubmit").on("click", function(e) {
            e.preventDefault();

            var formData = $('#add-to-cart').serialize();

            var dynSessConf = $(
                "[name=_dynSessConf]").val();

            formData += ' _dyncharset=UTF-8&_dynSessConf=' + dynSessConf + '&%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.addItemCount=1&_D%3A%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.addItemCount=+&%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.items%5B0%5D.quantity=1&_D%3A%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.items%5B0%5D.quantity=+&%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.items%5B0%5D.catalogRefId=sku70304&_D%3A%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.items%5B0%5D.catalogRefId=+&%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.items%5B0%5D.productId=prod70023&_D%3A%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.items%5B0%5D.productId=+&%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.items%5B0%5D.commerceItemType=default&_D%3A%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.items%5B0%5D.commerceItemType=+&%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.addItemToOrder=Add+To+Cart&_D%3A%2Fatg%2Fcommerce%2Forder%2Fpurchase%2FCartModifierFormHandler.addItemToOrder=+&_DARGS=%2Fvast%2FproductDescriptionPage.jsp',
                $.ajax({
                    type: 'get',
                    url: 'addToCart.jsp?_DARGS=/vast/productDescriptionPage.jsp',
                    data: formData,
                    success: function(data, status, xhr) {
                        $("#totalCommerceItemCountDiv").load("/vast/productDescriptionPage.jsp #totalCommerceItemCountDiv");
                    }
                });
        });
    });

但是我会在url中添加任何东西ajax不起作用(例如:productListingPage.jsp？productId =“prod007”)并且正常的 ajax 代码无法在 commerceItem 列表中添加产品。如果没有请求表单数据附加，ajax 将无法工作。

当我提交表单时。表单数据已添加到购物车，无需重新加载整个页面。

Answer 1

尝试从表单标记中删除操作，或粘贴以下代码

    <dsp:form  id="add-to-cart">