Помогите создать метод ajax для добавления в корзину - PullRequest
Новая
       1

Помогите создать метод ajax для добавления в корзину

0 голосов
/ 08 апреля 2011

У меня есть следующий код, который я хочу превратить в тихую функцию 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; ?>&nbsp;</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; ?> - &pound;<?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 и обновлял корзину, не обновляя страницу?

Ответы [ 2 ]

0 голосов
/ 08 апреля 2011

Я уже ответил на вопрос для JSP / SERVLET здесь , этот должен работать, изменив URL на страницу PHP ...

Вам нужно сделать запрос XML Http к сервлету, для чего вам нужно сделать объект XML Http в javascript на вашей странице HTML / PHP 

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;
    }

Теперь вам нужно сделать запрос к PHP из JavaScript 

var url="urlofPHPpage";
var para="parmeter1=value1&parameter2=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 

    }
}

Это должно помочь ...

Также взгляните на API jQuery Ajax .

0 голосов
/ 08 апреля 2011

Вам нужно разделить отображение корзины в другой файл, чтобы вы могли использовать:

$. Load ()

Пример базового использования: 

$('#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 ()

См .: http://api.jquery.com/jQuery.post/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...