我有一些url,我将一些项目添加到另一个页面(购物车页面),但通过刷新页面,它工作正常,现在我尝试使用 Ajax 来做到这一点,所以我创建了一个 ajax 函数调用这个 URL 它可以工作并添加我的项目。
现在的问题是我必须重新加载其他页面(购物车页面)才能查看产品。那么如何在添加项目后刷新此页面,我的意思是在调用此 URL 后。
网址:<?php echo Mage::helper('checkout/cart')->getAddUrl($_product, $params); ?>
cart.phtml
...
<div class="row">
<div class="col-md-6">
<div class="product-qty">
<div class="custom-qty">
<div class="btn-plus">
<button type="button" class="reduced items" onclick="minusQty('<?php echo $_product->getId() ?>')">
<i class="fa fa-minus"></i>
</button>
<input name="qty" id="qty-<?php echo $_product->getId()?>" maxlength="12" value="1" title="Qté" class="input-text qty" type="text">
<button type="button" class="increase items" onclick="plusQty('<?php echo $_product->getId() ?>')">
<i class="fa fa-plus"></i>
</button>
</div>
</div>
</div>
</div>
<?php $params = array('qty'=>2) // the input value ?>
<div class="col-md-6">
<button type="button" title="<?php echo $this->__('Add') ?>" class="button btn-cart pull-left-none" onclick="addToCartAjax('<?php echo Mage::helper('checkout/cart')->getAddUrl($_product, $params); ?>')" >
<span><span><?php echo $this->__('Add') ?></span></span>
</button>
</div>
</div>
//JS PART
<script type="text/javascript">
function addToCartAjax(addUrl) {
jQuery.ajax ({
url: addUrl,
type : 'GET',
})
}
</script>
编辑:
cart.phtml
的内容
<div class="row">
<div class="col-main col-lg-12">
<div class="cart">
<fieldset>
...
<tbody>
<tr class="first odd"><td>Item1</td></tr>
<tr class="last even"><td>Item2</td></tr>
</tbody>
...
</fieldset>
</div>
</div>
</div>
编辑2:
Action Controller
public function addAction()
{
if (!$this->_validateFormKey()) {
$this->_goBack();
return;
}
$cart = $this->_getCart();
$params = $this->getRequest()->getParams();
try {
if (isset($params['qty'])) {
$filter = new Zend_Filter_LocalizedToNormalized(
array('locale' => Mage::app()->getLocale()->getLocaleCode())
);
$params['qty'] = $filter->filter($params['qty']);
}
$product = $this->_initProduct();
$related = $this->getRequest()->getParam('related_product');
/**
* Check product availability
*/
if (!$product) {
$this->_goBack();
return;
}
$cart->addProduct($product, $params);
if (!empty($related)) {
$cart->addProductsByIds(explode(',', $related));
}
$cart->save();
$this->_getSession()->setCartWasUpdated(true);
/**
* @todo remove wishlist observer processAddToCart
*/
Mage::dispatchEvent('checkout_cart_add_product_complete',
array('product' => $product, 'request' => $this->getRequest(), 'response' => $this->getResponse())
);
if (!$this->_getSession()->getNoCartRedirect(true)) {
if (!$cart->getQuote()->getHasError()) {
$message = $this->__('%s was added to your shopping cart.', Mage::helper('core')->escapeHtml($product->getName()));
$this->_getSession()->addSuccess($message);
}
$this->_goBack();
}
} catch (Mage_Core_Exception $e) {
if ($this->_getSession()->getUseNotice(true)) {
$this->_getSession()->addNotice(Mage::helper('core')->escapeHtml($e->getMessage()));
} else {
$messages = array_unique(explode("\n", $e->getMessage()));
foreach ($messages as $message) {
$this->_getSession()->addError(Mage::helper('core')->escapeHtml($message));
}
}
$url = $this->_getSession()->getRedirectUrl(true);
if ($url) {
$this->getResponse()->setRedirect($url);
} else {
$this->_redirectReferer(Mage::helper('checkout/cart')->getCartUrl());
}
} catch (Exception $e) {
$this->_getSession()->addException($e, $this->__('Cannot add the item to shopping cart.'));
Mage::logException($e);
$this->_goBack();
}
}
最佳答案
我假设当您将商品添加到购物车时,您会从服务器收到有关购物车当前商品的某种响应,如果没有,您必须首先在服务器端实现该响应
将其添加到您的函数中:
function addToCartAjax(addUrl){ $.ajax({ url: addUrl, type: 'GET', }) .done(function(response ) { //response - this is the response from the server }); }
我不知道你的服务器返回什么,如果它是 html,而不是在 .done 闭包中执行此操作:
.done(function(response ) { // response - this is the response from the server $('.YourCartContainer').html(response); });
因此,如果您的服务器返回包含您的购物车商品的 html 片段,那么您应该将其作为 html 插入到您的购物车 div 容器中,但是如果服务器返回包含商品的 Json 响应,那么您必须使用 jquery 和 format 循环遍历它们这里适本地举一个例子,但是我不知道你的服务器返回什么,所以只需应用该技术:
.done(function(response ) { // response - this is the response from the server var htmlResult = ''; $.each(response, function( item ) { htmlResult += '<p>'+ item.name + '</p><br>' }); $('.YourCartContainer').html(htmlResult); });
所以在这里我循环遍历 json 并创建了一些简单的 html,您可以在其中获取购物车内的所有商品名称,希望这有帮助!如果您需要更多有关您的案例的信息,请发布您的服务器响应!!
关于javascript - 如何使用AJAX添加项目后刷新页面内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45828053/