主页上的产品选项（特色模块）Opencart

Question

我正在尝试在主页上显示产品选项，并且它正确显示了产品选项，但是当我点击添加到购物车按钮后从下拉列表中选择选项后，它无法正常工作。我认为有一些javascript问题，请检查代码并告诉我我错在哪里。

这是我的common.js

var cart = {
    'add': function(product_id, el) {
        if ($(el).parent().children('input[name="quantity"]').val() != 'undefined') {
        quantity = $(el).parent().children('input[name="quantity"]').val();
    } else {
        quantity = 1;
    }

    var option = $("#input-option").val();


        $.ajax({
            url: 'index.php?route=checkout/cart/add',
            type: 'post',
            data: 'option=' + option + 'product_id=' + product_id + '&quantity=' + (typeof(quantity) != 'undefined' ? quantity : 1),
            dataType: 'json',
            beforeSend: function() {
                $('#cart > button').button('loading');
            },
            complete: function() {
                $('#cart > button').button('reset');
            },
            success: function(json) {
                $('.alert, .text-danger').remove();

                if (json['redirect']) {
                    location = json['redirect'];
                }

                if (json['success']) {
                    $('#content').parent().before('<div class="alert alert-success"><i class="fa fa-check-circle"></i> ' + json['success'] + ' <button type="button" class="close" data-dismiss="alert">&times;</button></div>');

                    // Need to set timeout otherwise it wont update the total
                    setTimeout(function () {
                        $('#cart > button').html('<span id="cart-total"><i class="fa fa-shopping-cart"></i> ' + json['total'] + '</span>');
                    }, 100);

                    $('html, body').animate({ scrollTop: 0 }, 'slow');

                    $('#cart > ul').load('index.php?route=common/cart/info ul li');
                }
            },
            error: function(xhr, ajaxOptions, thrownError) {
                alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
            }
        });
    },

这是我的featured.tpl

<h3 class="my-fa3 blue-txt"><b>Deal of The Day</b></h3>
<div class="row">
  <?php foreach ($products as $product) { ?>
  <div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12">
    <div class="product-thumb transition">
      <div class="image"><a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" class="img-responsive" /></a></div>
      <div class="caption">
        <h4><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a></h4>

        <!--No Need--

        <p class="my-fa gray-txt"><b><?php echo $product['description']; ?></b></p>

        --No Need-->

                <div class="col-sm-12" style="color:#FF0000;">



                  <!--SHOWING PRODUCT OPTIONS-->


            <div id="product">    
            <?php if ($product['options']) { ?>

            <?php foreach ($product['options'] as $option) { ?>
            <?php if ($option['type'] == 'select') { ?>
            <div class="form-group<?php echo ($option['required'] ? ' required' : ''); ?>">
              <label class="control-label" for="input-option<?php echo $option['product_option_id']; ?>"><?php echo $option['name']; ?></label>
              <select name="option[<?php echo $option['product_option_id']; ?>]" id="input-option<?php echo $option['product_option_id']; ?>" class="form-control">
                <option value=""><?php echo $text_select; ?></option>
                <?php foreach ($option['product_option_value'] as $option_value) { ?>
                <option value="<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?>
                <?php if ($option_value['price']) { ?> - Rs.<?php echo $option_value['price']; ?>
                <?php } ?>
                </option>
                <?php } ?>
              </select>
            </div>
            <?php } ?>
            <?php } ?>
            <?php } ?>
            </div>



          <!--SHOWING PRODUCT OPTIONS-->


                </div>


        <?php if ($product['price']) { ?>
        <p class="price dark-gray-txt my-fa4" style="font-weight:bold;">
          <?php if (!$product['special']) { ?>
          <?php echo $product['price']; ?>
          <?php } else { ?>
          <span class="price-new"><?php echo $product['special']; ?></span> <span class="price-old"><?php echo $product['price']; ?></span>
          <?php } ?>
        </p>
        <?php } ?>
      </div>

      <div class="my-col">
      <div class="my-clear-brdr"></div>
        <div class="qty-box white-txt yellow-bg pull-left"><b>Qty</b></div>

        <input type="text" size="3" id="quantity-<?php echo $product['product_id']; ?>" name="quantity" value="1" placeholder="1" class="form-control my-form-control input-lg qty-input radius-none pull-left" />

        <button type="button" onclick="cart.add('<?php echo $product['product_id']; ?>', this);" class="my-blue-btn pull-right"><i class="fa fa-shopping-cart"></i> <b><?php echo $button_cart; ?></b></button>

      </div>

    </div>
  </div>
  <?php } ?>
</div>

Answer 1

在文件中进行以下更改。

  

category.tpl

替换以下代码

<button type="button" onclick="cart.add('<?php echo $product['product_id']; ?>');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $button_cart; ?></span></button>

使用此

<input type="hidden" name="quantity" value="<?php echo $product['minimum']; ?>" size="2" id="input-quantity" class="form-control" />
<input type="hidden" name="product_id" value="<?php echo $product['product_id']; ?>" />
<button id="categorycart<?php echo $product['product_id']; ?>" type="button" onclick="categorycartv.add('<?php echo $product['product_id']; ?>', '<?php echo $product['minimum']; ?>');"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">Add to Cart</span></button>
<script type="text/javascript"><!--
// Cart add remove functions
var categorycart<?php echo $product['product_id']; ?> = {
    'add': function(product_id, quantity) { 
        $.ajax({
        url: 'index.php?route=checkout/cart/add',
        type: 'post',
        data: $('#categoryproduct<?php echo $product['product_id']; ?>  input[type=\'text\'], #categoryproduct<?php echo $product['product_id']; ?> input[type=\'hidden\'], #categoryproduct<?php echo $product['product_id']; ?> input[type=\'radio\']:checked, #categoryproduct<?php echo $product['product_id']; ?> input[type=\'checkbox\']:checked, #categoryproduct<?php echo $product['product_id']; ?> select, #categoryproduct<?php echo $product['product_id']; ?> textarea'),
        dataType: 'json',
        beforeSend: function() {
            $('#categorycart<?php echo $product['product_id']; ?>').button('loading');
        },
        complete: function() {
            $('#categorycart<?php echo $product['product_id']; ?>').button('reset');
        },
        success: function(json) {

            $('.alert, .text-danger').remove();
            $('.form-group').removeClass('has-error');
            if (json['error']) { 
                if (json['error']['option']) {
                    for (i in json['error']['option']) {
                        var element = $('#categoryproduct<?php echo $product['product_id']; ?> #input-option' + i.replace('_', '-'));

                        if (element.parent().hasClass('input-group')) {
                            element.parent().after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
                        } else {
                            element.after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
                        }
                    }
                }

                if (json['error']['recurring']) {
                    $('#categoryproduct<?php echo $product['product_id']; ?> select[name=\'recurring_id\']').after('<div class="text-danger">' + json['error']['recurring'] + '</div>');
                }

                // Highlight any found errors
                $('.text-danger').parent().addClass('has-error');
            }
            if (json['success']) { 
                $('#content').parent().before('<div class="alert alert-success">' + json['success'] + '<button type="button" class="close" data-dismiss="alert">&times;</button></div>');

                $('#cart > button').html('<i class="fa fa-shopping-cart"></i> ' + json['total']);

                $('html, body').animate({ scrollTop: 0 }, 'slow');

                $('#cart > ul').load('index.php?route=common/cart/info ul li');
            }
        }
    });
    }
}
//--></script>

在

  

Category.php

将以下元素添加到 $ data [＆＃39; products＆＃39;] [] = array（

'minimum'       => $result['minimum'],