我有以下代码，我想变成一个静默的ajax函数，因此当用户将产品添加到购物篮时，页面不需要刷新。
目前我有以下代码，
PHP
function showProduct($productId)
{
if (!$productId > 0)
{
redirect('home');
}
$this->load->model('Product_model');
$this->load->model('Checkout_model');
$this->data['items'] = $this->Checkout_model->GetProducts();
// Check to see if the Add To Bag button has been clicked.
if ($this->input->post('btnAddToBag'))
{
$derivativeId = $this->input->post('selDerivative-1');
$quantity = $this->input->post('selQuantity');
$derivative = $this->Product_model->GetProducts(array('pdId' => $derivativeId), 'small');
// Add item to shopping bag.
$attributes = $this->Product_model->GetProductDerivatives(array('pdId' => $derivativeId));
$this->Checkout_model->AddProduct($derivative, $attributes, $quantity);
$this->data['message'] = 'Item added to Shopping Bag.';
// Update Delivery Price
$this->Checkout_model->updateDelivery(49);
//get the bag details
}
$this->data["product_details"] = $this->Product_model->GetProducts(array('productId' => $productId, 'pdOrdering' => 1), 'detail');
$this->data['product_images'] = $this->Product_model->GetProductImages(array('productId' => $productId, 'ipPosition' => 'detail'));
//send the new filename to the view
//die(print_r($this->data['product_images']));
//die(print_r($this->data['sliderUrl']));
// Retrieve images for initial derivative.
$this->load->model('Attribute_model');
$this->data['derivative_images'] = $this->Attribute_model->GetAttributeValues(array('pdavProductDerivativeId' => $this->data["product_details"]->pdId), 'small', TRUE);;
$derivatives = $this->Product_model->GetProductDerivatives(array('pdProductId' => $productId));
$this->data["product_derivatives"] = $derivatives['derivatives'];
$this->data["product_attribute_names"] = $derivatives['attributeNames'];
// Retrieve details of this range.
$subRangeId = $this->data["product_details"]->productRangeId;
$this->data["sub_range_details"] = $this->Range_model->GetRanges(array('range.rangeId' => $subRangeId));
$rangeId = $this->data["sub_range_details"]->rangeParentId;
$this->data['active_menu_item'] = "subrange";
if ($rangeId == 0)
{
$rangeId = $subRangeId;
$this->data['active_menu_item'] = "full";
}
$this->data["range_details"] = $this->Range_model->GetRanges(array('range.rangeId' => $rangeId, 'range.rangeParentId' => 0), 'navigation');
if ($rangeId != $subRangeId)
$this->template->set_breadcrumb($this->data["range_details"]->rangeTitle, $this->data["range_details"]->rangePath);
//$this->data["rangePath"] = $this->uri->segment(1).'/';
$this->data["rangeId"] = $rangeId;
$this->data["subRangeId"] = $subRangeId;
// Retrieve list of sub ranges in this range.
$this->data["sub_ranges"] = $this->Range_model->GetRanges(array('range.rangeParentId' => $rangeId));
$this->data["individual_products"] = $this->Product_model->GetProducts(array('psiParentId' => $productId), 'small');
$this->data["related_products"] = $this->Product_model->GetRelatedProducts(array('product_related.prProductId' => $productId, 'ordering' => 'productActualPrice'), 'small');
$this->data['bestsellers'] = $this->Product_model->GetProducts(array('productBestSeller' => '1', 'range.rangeParentId' => $rangeId, 'ordering' => 'range.rangeOrder'), 'small');
$this->data["multibuy"] = $this->Product_model->GetProducts(array('psi.psiChildId' => $productId, 'productSavingType' => 'multi-buy'));
//$this->load->view('collection', $data);
if (isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH']=="XMLHttpRequest") {
$this->template
->build('product/quickview', $this->data); // views/product/product.php
}else{
$this->template
->set_layout('default') // application/views/layouts/default.php
->title(($this->data["product_details"]->productMetadataTitle != '' ? $this->data["product_details"]->productMetadataTitle : $this->data["product_details"]->productTitle))
->set_metadata('keywords', $this->data["product_details"]->productMetadataKeywords, 'meta')
->set_metadata('description', ($this->data["product_details"]->productMetadataDescription != '' ? $this->data["product_details"]->productMetadataDescription : $this->data["product_details"]->productShortDesc), 'meta')
->set_metadata('', site_url('assets/js/product.js'), 'js')
->set_metadata('', site_url('assets/js/jquery.nivo.slider.js'), 'js')
->set_metadata('', site_url('assets/js/slider.js'), 'js')
->set_partial('left-nav', 'blocks/ranges_sub_menu') // application/views/blocks/ranges_sub_menu.php
->set_breadcrumb($this->data["sub_range_details"]->rangeTitle, $this->data["sub_range_details"]->fullRangePath)
->set_breadcrumb($this->data["product_details"]->productTitle, $this->data["product_details"]->fullProductPath)
->build('product/product', $this->data); // views/product/product.php
}
}
HTML表格
<?php echo form_open(current_url(), array('id' => 'frmProducts'), array('submitted' => '1')); ?>
<div class="formRow">
<label for="rattanType"><?php echo $product_attribute_names; ?> </label><br />
<?php
$options = array();
foreach ($product_derivatives as $derivative) :
$options[$derivative['derivativeId']] = $derivative['attributeValues'];
endforeach;
?>
<?php echo form_dropdown('selDerivative-1', $options, $product_details->pdId, 'class="select clear" id="selDerivative-1"'); ?>
</div>
<?php if (count($individual_products) > 0) : ?>
<div class="formRow">
<label for="itemType">Item</label><br />
<select class="select clear" id="selURL-1" name="selURL-1">
<option value="<?php echo current_url(); ?>">Full Set</option>
<?php foreach ($individual_products as $product) : ?>
<option value="<?php echo site_url($product->fullProductPath); ?>"><?php echo $product->productTitle; ?> - £<?php echo ($product->productSavingType != 'none' ? $product->productSavingPrice : $product->productPrice); ?></option>
<?php endforeach; ?>
</select>
<input id="btnGo-1" name="btnGo-1" type="submit" value="GO" />
</div>
<?php endif; ?>
<div class="formRow">
<label for="addQty">Quantity</label><br />
<?php
$options = array();
for ($i = 1; $i < 10; $i++) :
$options[$i] = $i;
endfor;
?>
<?php echo form_dropdown('selQuantity', $options, '1', 'class="small select clear"'); ?>
</div>
<input type="submit" value="add to bag" name="btnAddToBag" id="btnAddToBag" />
<?php echo form_close(); ?>
// Reset action of form when add to bag button is clicked.
$("#btnAddToBag").click(function () {
$("#frmProducts").attr("action","<?php echo current_url(); ?>");
});
如何更改此代码，使其生成ajax请求并更新购物车而不刷新页面？
答案 0 :(得分：0)
您需要将购物篮显示分成另一个文件，以便您可以使用：
$。负载（）
基本用法示例：
$('#ShoppingCart').load('Cart.php', function() {
alert('Load was performed.');
});
<div id="ShoppingCart"> </div>
或者有点像你现在设置的那样：
$("#btnAddToBag").click(function () {
$('#ShoppingCart').load('Cart.php', function() {
alert('Load was performed.');
});
});
编辑：
重新阅读你的帖子，你不想让购物车更新吗？
在这种情况下，您需要使用$ .post（）
答案 1 :(得分：0)
我已经回答了JSP / SERVLET here的一个问题，这个问题可以通过将URL更改为PHP页面来实现......
你需要向Servlet发出一个XML Http请求，你需要在HTML / PHP页面的javascript中创建一个XML Http对象
var myxmlhttpobj=new GetXmlHttpObject();
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
现在你需要从javascript
向PHP发出请求var url="urlofPHPpage";
var para="parmeter1=value1¶meter2=valu2;
myxmlhttpobj.open("POST",url,true);
myxmlhttpobj.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
myxmlhttpobj.setRequestHeader("Content-length", para.length);
myxmlhttpobj.setRequestHeader("Connection", "close");
myxmlhttpobj.onreadystatechange=ajaxComplete;
myxmlhttpobj.send(para);
在PHP页面，您需要处理结果并将其作为字符串发送回来：
当请求返回时，将调用myxmlhttpobj.onreadystatechange=ajaxComplete;
function ajaxComplete(){
if(myxmlhttpobj.readyState==4){
///Display the result on the HTML/PHP Page BASKET
}
}
那应该有帮助...
另请查看jQuery Ajax API。