Question

我在Magento 1.8.1.0版本中使用扩展名简单可配置产品（SCP）

我想要实现的是拥有一个可配置的产品（使用SCP！），它将不同的选项显示为单选按钮而不是下拉列表（默认）。虽然这听起来很容易，到目前为止我找不到合适的解决方案（有很多建议，但似乎没有任何建议）。我很乐意在后端解决这个问题，尽管我现在还会欣赏工作前端解决方案。

configurable.phtml中的工作是吐出为产品设置的不同自定义选项，如下所示：

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

我可以想象这是一个起点，即使我没有想到它。

我可以确认不工作，插件是那两个：

Inchoo's plugin与SCP发生冲突
Attribute Icons处于测试状态且无法正常工作
Magento-Configurable-Products-Radio-Select也没有保留SCP-Funcionality

我知道这是一个非常具体的问题，并且它可能是this的副本，但是甚至可能有v1.7的工作解决方案在v1.8中不再有效且我有一种感觉这对许多其他人来说可能非常有趣。

编辑：只是详细说明SCP做了什么：它允许您拥有可以在选项之间具有依赖关系的可配置产品。这可以通过为每个可能的选项提供单个产品来实现。这样，您可以将价格提高，具体取决于产品的材料和尺寸。因此，根据材料，一种尺寸可以具有不同的价格，然后如果尺寸增大则可以具有新的价格范围。 GitHub网站也提供了更好的理解，以防这种情况令人困惑。

如果您想安装SCP，请务必安装回购请求的pull请求中提供的修补程序。

Answer 1

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

Answer 2

所以这就是我最终使用的东西。它不会更改configurable.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>元素转换为单选按钮。使用CSS隐藏<select>个元素，因为我们不希望选项出现两次。接下来只是收听单选按钮上的点击事件，并基本上将点击同步到<select>元素。当select元素发生变化时，您只需调用spConfig.configureElement(el);函数，其中el是相应的<select>元素。

如果第二个<select>元素与第一个元素具有依赖关系，那么当单击一个单选按钮时，该元素也必须更新。

希望能给别人一个线索，试图做同样的事情。

Magento SCP Extension＆amp;可配置产品的单选按钮

2 个答案: