Magento - 如何在类别页面上显示多个可配置产品 - 不显示下拉值

时间:2014-01-30 18:52:24

标签: javascript php magento categories configurable-product

我正在尝试将多个可配置产品添加到Magento 1.7.2的类别列表页面中。我正在使用有机互联网SCP扩展以及EM Gala Colorswatches,这使得它比平时更加​​棘手。我已经按照这些网站的教程进行了....他们几乎是一样的想法...

http://inchoo.net/ecommerce/magento/display-multiple-configurable-products-with-options-on-one-page-in-magento/

http://www.catgento.com/adding-configurable-product-options-to-category-list-in-magento/

产品页面上的下拉列表和颜色样本显示正常,但在类别页面上显示下拉列表,标签和价格,但选择下拉列表时不显示产品值。我已经在产品页面中包含了所有相同的.js文件。我能看到的唯一区别是在控制台中我从prototype.js

获得了以下错误
TypeError: document.getElementById(...) is null
element.attachEvent("ondataavailable", responder);
prototype.js (line 5644)

TypeError: element.attachEvent is not a function    
element.attachEvent("ondataavailable", responder);
prototype.js (line 5644)

TypeError: element.attachEvent is not a function
element.attachEvent("on" + actualEventName, responder);

TypeError: element.dispatchEvent is not a function  
element.dispatchEvent(event);

仅当我在页面上取消注释可配置产品块时才会出现第三个错误。它所指的功能是在prototype.js中,如下所示

function observe(element, eventName, handler) {
element = $(element);
var responder = _createResponder(element, eventName, handler);
if (!responder) return element;
if (eventName.include(':')) {
if (element.addEventListener)
element.addEventListener("dataavailable", responder, false);
else {
element.attachEvent("ondataavailable", responder);
element.attachEvent("onlosecapture", responder);
}
} else {
var actualEventName = _getDOMEventName(eventName);
if (element.addEventListener)
element.addEventListener(actualEventName, responder, false);
else
element.attachEvent("on" + actualEventName, responder);
}
return element;
} 

当我查看源代码时,我可以看到JSON对象在那里并且数据可用但由于某种原因它没有被添加到选择框作为产品页面上的选项....任何帮助将不胜感激。

以下是app / design / frontend / default / mytheme / catalog / product / list.phtml中的代码

    <?php if ($_product->getData('type_id') == "configurable"){  
                 Mage::unregister('product');
                    Mage::register('product', $_product);
                    $block = $this->getLayout()->createBlock(
                        'OrganicInternet_SimpleConfigurableProducts_Catalog_Block_Product_View_Type_Configurable',
                        'options_configurable',
                        array('template' => 'catalog/product/view/type/options/configurable.phtml')
                        );
                    echo $block->toHtml(); 

                   $priceBlock = $this->getLayout()->createBlock(
                        'OrganicInternet_SimpleConfigurableProducts_Catalog_Block_Product_Price',
                        $_product->getFinalPrice(),
                        array('template' => 'catalog/product/price.phtml')
                        );
                    echo $priceBlock->toHtml(); 
    }   
 ?>

以下是此块在/app/design/frontend/default/mytheme/template/catalog/product/view/type/options/configurable.phtml中调用的代码

<?php
$_product    = $this->getProduct();
$_attributes = Mage::helper('core')->decorateArray($this->getAllowAttributes());
?>
<?php if ($_product->isSaleable() && count($_attributes)):?>

    <dl>
    <?php foreach($_attributes as $_attribute): ?>
      <dt><label class="required"><!--  <em>*</em>--><?php echo $_attribute->getLabel() ?></label></dt>
        <dd<?php if ($_attribute->decoratedIsLast){?> class="last"<?php }?>>
            <div class="input-box">
                <select name="super_attribute[<?php echo $_attribute->getAttributeId() ?>]" id="attribute<?php echo $_attribute->getAttributeId() ?>" class="required-entry super-attribute-select_<?php echo $_product->getId()?>">
                    <option><?php echo $this->__('Choose an Option...') ?></option>
                </select>
              </div>
        </dd>
    <?php endforeach; ?>
    </dl>

    <script type="text/javascript">
        var spConfig_<?php echo $_product->getId()?> = new Inchoo_Product.Config(<?php echo $this->getJsonConfig() ?>);
    </script>
<?php endif;?>

提前致谢,如果您需要更多信息,请与我们联系...

1 个答案:

答案 0 :(得分:0)

我认为这可能会发生,因为magento在这些页面上使用不同的脚本:

  • configurable.js 应包含在产品视图页
  • configurableList.js 应包含在目录视图页面

两个脚本都有几个命名相同的方法。因此,如果您在目录视图页面中包含这两个脚本,或者仅在目录视图页面中包含configurable.js,那么您的选择下拉列表中将不会显示任何内容,因为方法名称相同,而逻辑则不同。