我已经添加了这个问题的答案。
Implement multiple product chooser widget Magento
我已经检查了https://github.com/dio5/magento-multiproducts-widget 下的模块。
使用 FORK 选项而不是下载 ZIP。
它有效并为我们提供了准确的结果，即 WIDGET 中的多个产品选择。如果有任何错误，请告诉我。
让我知道这是否适合你。
谢谢！
[编辑我之前的评论，直接在此处请求代码]
/命名空间/模块名/etc/widget.xml
<widgets>
<catalog_product_multiproducts type="namespace_modulename/widget_catalog_product_multiproducts" translate="name description" module="namespace_modulename">
<name>Catalog Multiple Products Widget</name>
<description>Select multiple products for display</description>
<parameters>
<title translate="label">
<visible>1</visible>
<label>Title</label>
<type>text</type>
</title>
<products_count translate="label">
<visible>1</visible>
<required>1</required>
<label>No of Products</label>
<type>text</type>
</products_count>
<ids translate="label">
<visible>1</visible>
<required>1</required>
<label>Products</label>
<type>label</type>
<helper_block>
<type>namespace_modulename/adminhtml_catalog_product_widget_multiproducts_chooser</type>
<data>
<button translate="open">
<open>Select Products...</open>
</button>
</data>
</helper_block>
<sort_order>10</sort_order>
</ids>
<template translate="label description">
<required>1</required>
<visible>1</visible>
<label>Product Carousel Template</label>
<type>text</type>
<value>catalog/product/widget/products_carousel.phtml</value>
<values>
<default translate="label"> <value>catalog/product/widget/products_carousel.phtml</value>
<label>New Products Grid Template</label>
</default>
<list translate="label">
<value>catalog/product/widget/new/content/new_list.phtml</value>
<label>New Products List Template</label>
</list>
</values>
<description>Template path cannot be changed/updated</description>
</template>
</parameters>
</catalog_product_multiproducts>
</widgets>
/NameSpace/ModuleName/Block/Adminhtml/Catalog/Product/MultiProducts/Chooser.php
此函数将调用 DOCHOOSE() 函数，该函数将帮助“选择”选中/选定的产品。
/**
* prepare layout for products grid
*
* @return type Mage_Adminhtml_Block_Catalog_Product_Widget_Chooser
*/
protected function _prepareLayout()
{
$this->setChild('choose_button', $this->getLayout()->createBlock('adminhtml/widget_button')
->setData(array(
'label' => Mage::helper('adminhtml')->__('Choose Selected Products'),
'onclick' => $this->getJsObjectName() . '.doChoose()'
))
);
return parent::_prepareLayout();
}
需要使用以下函数来准备产品元素的 HTML，格式为 {1}{2}
/**
* Prepare chooser element HTML
*
* @param Varien_Data_Form_Element_Abstract $element Form Element
* @return Varien_Data_Form_Element_Abstract
*/
public function prepareElementHtml(Varien_Data_Form_Element_Abstract $element)
{
$uniqueId = Mage::helper('core')->uniqHash($element->getId());
$sourceUrl = $this->getUrl('*/multiproducts/chooser', array(
'uniq_id' => $uniqueId,
'use_massaction' => true,
));
$chooser = $this->getLayout()->createBlock('widget/adminhtml_widget_chooser')
->setElement($element)
->setTranslationHelper($this->getTranslationHelper())
->setConfig($this->getConfig())
->setFieldsetId($this->getFieldsetId())
->setSourceUrl($sourceUrl)
->setUniqId($uniqueId);
if ($element->getValue())
{
$label = "";
$ids = explode('}{', $element->getValue());
$cleanIds = array();
foreach ($ids as $id)
{
$id = str_replace('{', '', $id);
$id = str_replace('}', '', $id);
$cleanIds[] = $id;
}
$products = $this->_getProductsByIDs($cleanIds);
if ($products)
{
$label .= '<ul>';
foreach ($products as $product)
{
$label .= '<li>' . $product->getName() . '</li>';
}
$label .= '</ul>';
$chooser->setLabel($label);
}
}
$element->setData('after_element_html', $chooser->toHtml());
return $element;
}
选中/取消选中复选框的 JS
/**
* Checkbox Check JS Callback
*
* @return string
*/
public function getCheckboxCheckCallback()
{
if ($this->getUseMassaction())
{
return "function (grid, element) {
$(grid.containerId).fire('product:changed', {element: element});
}";
}
}
点击/检查/选择的行/产品的 JS
/**
* Grid Row JS Callback
*
* @return string
*/
public function getRowClickCallback()
{
if (!$this->getUseMassaction())
{
$chooserJsObject = $this->getId();
return '
function (grid, event) {
var trElement = Event.findElement(event, "tr");
var productId = trElement.down("td").innerHTML;
var productName = trElement.down("td").next().next().innerHTML;
var optionLabel = productName;
var optionValue = "product/" + productId.replace(/^\s+|\s+$/g,"");
if (grid.categoryId) {
optionValue += "/" + grid.categoryId;
}
if (grid.categoryName) {
optionLabel = grid.categoryName + " / " + optionLabel;
}
' . $chooserJsObject . '.setElementValue(optionValue);
' . $chooserJsObject . '.setElementLabel(optionLabel);
' . $chooserJsObject . '.close();
}
';
}
}
JS 代码，如果用户有兴趣从特定类别中选择产品。
/**
* Category Tree node onClick listener js function
*
* @return string
*/
public function getCategoryClickListenerJs()
{
$js = '
function (node, e) {
{jsObject}.addVarToUrl("category_id", node.attributes.id);
{jsObject}.reload({jsObject}.url);
{jsObject}.categoryId = node.attributes.id != "none" ? node.attributes.id : false;
{jsObject}.categoryName = node.attributes.id != "none" ? node.text : false;
}
';
$js = str_replace('{jsObject}', $this->getJsObjectName(), $js);
return $js;
}
用于准备带有产品 ID 的 POST 元素的附加 JS。
/**
* return additional JS for controls
*
* @return JS
*/
public function getAdditionalJavascript()
{
$chooserJsObject = $this->getId();
$js = '
{jsObject}.initChecked = function() {
$$("#' . $chooserJsObject . '_table tbody input:checkbox").each(function(element, i) {
var values = ' . $chooserJsObject . '.getElementValue();
var capture = values.replace("{"+element.value+"}", "match");
var searchValue = "match";
if(capture.search(searchValue) != -1)
{
element.checked = true;
}
});
}
{jsObject}.initChecked();
var values = ' . $chooserJsObject . '.getElementValue();
$("' . $chooserJsObject . '").insert({bottom: "<div class=\"filter\"><input type=\"hidden\" value=\"+values+\" name=\"selected_products\" /></div>"});
$$("#' . $chooserJsObject . '_table tbody input:checkbox").invoke("observe", "change", function(event) {
var element = Event.element(event);
var label = element.up("td").next().next().next().innerHTML;
label = label.replace(/^\s\s*/, "").replace(/\s\s*$/, "");
if(element.checked)
{
{jsObject}.addValue(element.value);
{jsObject}.addLabel(label);
} else {
{jsObject}.removeValue(element.value);
{jsObject}.removeLabel(label);
}
});
{jsObject}.removeValue = function(value) {
var currentValue = ' . $chooserJsObject . '.getElementValue();
currentValue = currentValue.replace("{"+value+"}", "");
' . $chooserJsObject . '.setElementValue(currentValue);
}
{jsObject}.addValue = function(value) {
var currentValue = ' . $chooserJsObject . '.getElementValue();
currentValue = currentValue.replace("{"+value+"}", "");
currentValue = currentValue + "{"+value+"}";
' . $chooserJsObject . '.setElementValue(currentValue);
}
{jsObject}.removeLabel = function(label) {
var currentLabel = ' . $chooserJsObject . '.getElementLabelText();
currentLabel = currentLabel.replace("<li>"+label+"</li>", "");
' . $chooserJsObject . '.setElementLabel(currentLabel);
}
{jsObject}.addLabel = function(label) {
var currentLabel = ' . $chooserJsObject . '.getElementLabelText();
if(currentLabel.search("ul") != -1)
{
currentLabel = currentLabel.replace("</ul>", "");
currentLabel = currentLabel.replace("<li>"+label+"</li>", "");
} else {
currentLabel = "<ul>";
}
currentLabel = currentLabel +"<li>"+label+"</li></ul>";
' . $chooserJsObject . '.setElementLabel(currentLabel);
}
{jsObject}.doChoose = function(node,e) {
' . $chooserJsObject . '.close();
}
';
$js = str_replace('{jsObject}', $this->getJsObjectName(), $js);
return $js;
}
以上是主要功能，可帮助您在弹出窗口中从 GRID 中选择多个产品。
还有更多代码可以在这里查看：https://github.com/dio5/magento-multiproducts-widget
步骤：
- 在管理面板中导航到 CMS 页面
- 在所见即所得编辑器中单击“插入小部件”
- 选择小部件类型 - 目录多个产品小部件
- 输入标题、产品数量
- 选择模板（可以根据需要添加任意数量的模板）
- 点击“选择产品”按钮
- 从 GRID 中选择产品
- 点击“选择产品”按钮
希望这对某人有所帮助！
快乐编码...