1

我正在使用Magento 版本 1.8.1.0的扩展简单可配置产品 ( SCP )

我想要实现的是拥有一个可配置的产品(使用 SCP!),它将不同的选项显示为单选按钮而不是下拉菜单(默认)。尽管这听起来很简单,但到目前为止我还没有找到合适的解决方案(有很多建议,但似乎都不起作用)。我很想在后端解决这个问题,尽管此时我会同样欣赏工作的前端解决方案。

在可配置的.phtml 中起作用的是为产品设置不同的自定义选项,如下所示:

$attribute = Mage::getModel('eav/config')->getAttribute('catalog_product', '#ATTRIBUTENAME#'); 
            foreach ($attribute->getSource()->getAllOptions(true) as $option) {
                echo /*$option['value'] . ' ' .*/ $option['label'] . "\n";
            }

我可以想象这是一个起点,即使我还没有考虑清楚。

我可以确认不工作,插件明智的是这两个:

我知道这是一个非常具体的问题,并且可能与问题重复,但是甚至可能有适用于 v1.7 的有效解决方案在 v1.8 中不再有效,我觉得这可能对好多其它的。

编辑:只是详细说明 SCP 的作用:它允许您拥有一个可配置的产品,该产品可以在选项之间具有依赖关系。这是通过为每个可能的选项提供一个产品来实现的。例如,您可以通过这种方式提高价格,具体取决于产品的材料和尺寸。因此,根据材料的不同,一种尺寸可以有不同的价格,如果尺寸增加,则会有一个新的价格范围。GitHub 站点也提供了更好的理解,以防万一这很令人困惑。

如果要安装 SCP,请确保安装 repo 的拉取请求中提供的修复程序。

4

2 回答 2

3

试试这个 Magento-Configurable-Products-Radio-Select

于 2014-05-26T06:39:57.303 回答
1

所以这就是我最终使用的。它不会更改可配置的.phtml 或 SCP 核心代码中的任何代码。相反,我只是调用 skin/frontend/base/default/js/scp_product_extension.js 来更新选项和价格。这必须发生在客户端,但大部分 SCP 逻辑显然也是如此。

   var sizeselect = $(".catalog-product-view .input-box select").eq(0);
   var materialselect = $(".catalog-product-view .input-box select").eq(1);


      function optionsToRadios(element){
        var select = element;

        if (element == materialselect){
            $(".radios").append("<div class='secondradiofield'></div>")
            select.find('option').each(function(j, option){
                var option = $(option);
                var eachval = option.val();

                $(".catalog-product-view .secondradiofield").append(
                    "<input type='radio' id='s1"+j+"' data-value='"+eachval+"' data-position='"+j+"'/><span><label for='s1"+j+"'>"+option.text()+"</label></span>"
                );

            }); // ende find each

        } else{

            select.find('option').each(function(j, option){
                var option = $(option);
                var eachval = option.val();

                $(".catalog-product-view .radios").append(
                    "<input type='radio' id='s2"+j+"' data-value='"+eachval+"' data-position='"+j+"'/><span><label for='s2"+j+"'>"+option.text()+"</label></span>"
                );

            }); // end find each
        }   
    };

    // Make first <select> to radios
    optionsToRadios(sizeselect);




        /*
        *
        * @SCP - seems like the passed element cannot be a jQuery object!
        * @SCP - spConfig.reloadPrice() is autmatically called by spConfig.configureElement(el).
        *
        */

        $(document).on("click", ".radios>input[type='radio']", function(){

            var val = $(this).attr("data-value");
            var index = $(this).attr("data-position");
            var select = $(".catalog-product-view .input-box select").eq(0);

            // deselect other options
            select.prop("selected", false);
            select.find("option").removeAttr("selected"); 

            // synch options with <select>
            var clickedOption = $(select.find("option")[index]);
            clickedOption.attr("selected", "selected");
            clickedOption.prop("selected", true); // IMPORTANT: Firefox need the prop to work!

            // Make call to SCP to update
            var el = document.getElementsByClassName("super-attribute-select")[0];
            spConfig.configureElement(el);
            spConfig.reloadPrice();

            // Show second <select> as radios
            if($("input[type='radio']").length < 5){
                optionsToRadios(materialselect);
            }

            // Deselect other radio buttons
            $(".radios>input[type='radio']").not($(this)).prop('checked', false);
        });

第一个函数只是将默认<select>元素变成单选按钮。<select>元素被 CSS 隐藏,因为我们不希望选项出现两次。接下来只是监听单选按钮上的点击事件,并基本上将点击同步到<select>元素。When the select element has changed, you just have to call the spConfig.configureElement(el);function where el is the corresponding <select>element.

如果有第二个<select>元素依赖于第一个元素,那么当单击单选按钮时,这个元素也必须更新。

希望能给其他人一个线索,他们试图做同样的事情。

于 2014-05-29T10:26:38.090 回答