ฉันต้องการตั้งค่าตัวเลือกเริ่มต้นเป็นค่าตัวเลือกที่กำหนดเองในระดับผลิตภัณฑ์
โปรดช่วยฉันแก้ไขปัญหานี้ด้วย
ฉันต้องการตั้งค่าตัวเลือกเริ่มต้นเป็นค่าตัวเลือกที่กำหนดเองในระดับผลิตภัณฑ์
โปรดช่วยฉันแก้ไขปัญหานี้ด้วย
คำตอบ:
ฉันไม่แน่ใจว่าคุณสามารถทำได้ผ่านทางผู้ดูแลระบบ ฉันเพิ่งแก้ไขปัญหาที่ทำให้แน่ใจว่า "ตัวเลือกเริ่มต้น" ของฉันทั้งหมดเป็นตัวเลือกแรกในผู้ดูแลระบบจากนั้นเพิ่มด้านล่างลงใน js สำหรับร้านค้าของฉัน
<script>
require(['jquery', 'jquery/ui'], function($){
$('.product-add-form .field select').each(function(i, obj) {
$(obj).find('option:eq(1)').prop('selected', true);
});
});
</script>
ใช้งานได้กับตัวเลือกที่กำหนดเองเนื่องจากแสดงผลทั้งหมดเมื่อโหลดหน้าเว็บ รหัสจะวนซ้ำตามตัวเลือกที่กำหนดเองทั้งหมดและตั้งค่าตัวเลือกที่ 2 เป็นตัวแรกคือ "โปรดเลือก"
ฉันมีปัญหาเล็กน้อย แต่กับผลิตภัณฑ์ที่กำหนดค่าได้เนื่องจากตัวเลือกทั้งหมดโหลดหลังจากโหลดหน้าเว็บ แต่ต้องทำเช่นนั้นคุณสามารถเห็นคำถามของฉันได้ที่นี่: วีโอไอพี 2: วิธีตั้งค่าตัวเลือกเริ่มต้นในตัวเลือกที่กำหนดค่าได้อย่างไร
ฉันคิดว่าสิ่งที่คุณต้องการที่จะบรรลุคืออะไรเช่นนี้?
ฉันใช้งานสำหรับเขตข้อมูลแบบเลื่อนลงควรจะเหมือนกันกับ radiobuttons
catalog_product_option_type_value
ลงในตารางMagento\Catalog\Ui\DataProvider\Product\Form\Modifier\CustomOptions
ของตัวอย่าง:
ผู้ขาย / โมดูล / etc / adminhtml / di.xml
<?xml version="1.0"?>
<config>
<type name="Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\CustomOptions">
<plugin name="CustomOptionsUiPlugin" type="Vendor\Module\Plugin\CustomOptionsUiPlugin" sortOrder="1"/>
</type>
</config>
ผู้ขาย \ โมดูล \ ปลั๊กอิน \ CustomOptionsUiPlugin.php
namespace Vendor\Module\Plugin;
class CustomOptionsUiPlugin
{
...
public function afterModifyMeta(\Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\CustomOptions $subject,$meta)
{
$result = $meta;
$result['custom_options']['children']['options']['children']['record']['children']["container_option"]['children']['values']['children']['record']['children']['is_default'] = [
'arguments' => [
'data' => [
'config' => [
'label' => __('Default'),
'componentType' => 'field',
'formElement' => 'checkbox',
'dataScope' => 'is_default',
'dataType' => 'number',
'additionalClasses' => 'admin__field-small',
'sortOrder' => 55,
'value' => '0',
'valueMap' => [
'true' => '1',
'false' => '0'
]
]
]
]
];
return $result;
}
}
และสุดท้ายคุณต้องเขียนทับไฟล์Magento\Catalog\Block\Product\View\Options\Type\Select.php
ด้วยสิ่งนี้
$defaultAttribute = array();
if($_value->getData('is_default') == true){
$defaultAttribute = ['selected' => 'selected','default' => 'default'];
}
$select->addOption(
$_value->getOptionTypeId(),
$_value->getTitle() . ' ' . strip_tags($priceStr) . '',
['price' => $this->pricingHelper->currencyByStore($_value->getPrice(true), $store, false),$defaultAttribute]
);
หวังว่าจะช่วย!
$defaultAttribute
เป็นคุณลักษณะพิเศษสำหรับตัวเลือกจะขัดแย้งกับค่าที่กำหนดไว้ล่วงหน้า (buy_request, ... ) ตัวอย่างเช่นเมื่อแก้ไขรายการรถเข็นค่าที่เลือกโดยลูกค้าและค่า "is_default" จะถูกทำเครื่องหมายเหมือนselected="selected"
ในรหัส
@TrytoFly ขอบคุณสำหรับการแก้ปัญหาของคุณ ฉันลองใช้รหัสของคุณแล้วและฉันสามารถแสดงตัวเลือก "ค่าเริ่มต้น" ได้ แต่ค่าที่กำหนดเองไม่แสดง โปรดช่วยฉันแก้ไขปัญหาด้วยกรุณาค้นหารูปภาพ
$result = $meta;
ในจุดเริ่มต้นของวิธี afterModifyMeta () ของคุณ มิฉะนั้นคุณจะเขียนทับค่าที่ส่งคืนแทนการเพิ่มตัวเลือกเริ่มต้นให้กับมัน
@TrytoFly นี่คือสิ่งที่ได้ผลสำหรับฉัน
<?php
namespace Sigma\DefaultCustomOptions\Plugin;
class CustomOptionsUiPlugin
{
public function afterModifyMeta(
\Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\CustomOptions $subject,
$result
) {
$subject;
$result['custom_options']['children']['options']['children']['record']['children']["container_option"]
['children']['values']['children']['record']['children'] =array_replace_recursive(
$result['custom_options']['children']['options']['children']['record']['children']
["container_option"]['children']['values']['children']['record']['children'],
[
'is_default' => [
'arguments' => [
'data' => [
'config' => [
'label' => __('Default'),
'componentType' => 'field',
'formElement' => 'checkbox',
'dataScope' => 'is_default',
'dataType' => 'number',
'sortOrder' => 70,
'value' => '0',
'valueMap' => [
'true' => '1',
'false' => '0'
]
]
]
]
]
]
);
return $result;
}
}
คุณสามารถแทนที่ไฟล์ Select.php เช่นฟังก์ชั่นรหัสการดึงข้อมูล:
class AroundOptionValuesHtml extends \Magento\Catalog\Block\Product\View\Options\Type\Select
{
public function getValuesHtml()
{
$_option = $this->getOption();
$configValue = $this->getProduct()->getPreconfiguredValues()->getData('options/' . $_option->getId());
$store = $this->getProduct()->getStore();
$this->setSkipJsReloadPrice(1);
// Remove inline prototype onclick and onchange events
if ($_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_DROP_DOWN ||
$_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_MULTIPLE
) {
$require = $_option->getIsRequire() ? ' required' : '';
$extraParams = '';
$select = $this->getLayout()->createBlock(
\Magento\Framework\View\Element\Html\Select::class
)->setData(
[
'id' => 'select_' . $_option->getId(),
'class' => $require . ' product-custom-option admin__control-select'
]
);
if ($_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_DROP_DOWN) {
$select->setName('options[' . $_option->getId() . ']')->addOption('', __('-- Please Select --'));
} else {
$select->setName('options[' . $_option->getId() . '][]');
$select->setClass('multiselect admin__control-multiselect' . $require . ' product-custom-option');
}
foreach ($_option->getValues() as $_value) {
$priceStr = $this->_formatPrice(
[
'is_percent' => $_value->getPriceType() == 'percent',
'pricing_value' => $_value->getPrice($_value->getPriceType() == 'percent'),
],
false
);
// custom code
$defaultAttribute = array();
if($_value->getData('is_default') == true){
$defaultAttribute = ['selected' => 'selected'];
}
// custom code
$select->addOption(
$_value->getOptionTypeId(),
$_value->getTitle() . ' ' . strip_tags($priceStr) . '',
['price' => $this->pricingHelper->currencyByStore($_value->getPrice(true), $store, false),$defaultAttribute]
);
}
// custom code added
if ($_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_MULTIPLE) {
$extraParams = ' multiple="multiple"';
}
if (!$this->getSkipJsReloadPrice()) {
$extraParams .= ' onchange="opConfig.reloadPrice()"';
}
$extraParams .= ' data-selector="' . $select->getName() . '"';
$select->setExtraParams($extraParams);
if ($configValue) {
$select->setValue($configValue);
}
return $select->getHtml();
}
}
}
นี่เป็นวิธีที่สะอาดที่สุดที่ฉันพบเพื่อตั้งค่าเริ่มต้นสำหรับตัวเลือกที่กำหนดเองได้ :
(ขึ้นอยู่กับคำตอบ @TrytoFly)
หมายเหตุ : ฉันจะถือว่าคุณทำงานกับโมดูลที่สร้างขึ้นแล้วซึ่งฉันจะโทรหาVendor_Module
ผมจะถือว่าคุณทำงานในโมดูลที่สร้างไว้แล้วซึ่งผมจะโทรหา
is_default
คอลัมน์ลงในcatalog_product_option_type_value
ตารางapp / รหัส / ผู้ขาย / โมดูล / ติดตั้ง / UpgradeSchema.php
<?php
namespace Vendor\Module\Setup;
use Magento\Framework\Setup\UpgradeSchemaInterface;
use Magento\Framework\Setup\ModuleContextInterface;
use Magento\Framework\Setup\SchemaSetupInterface;
/**
* @codeCoverageIgnore
*/
class UpgradeSchema implements UpgradeSchemaInterface
{
/**
* {@inheritdoc}
* @SuppressWarnings(PHPMD.ExcessiveMethodLength)
*/
public function upgrade(SchemaSetupInterface $setup, ModuleContextInterface $context)
{
if (version_compare($context->getVersion(), '2.0.1') < 0) {
$setup->getConnection()->addColumn(
$setup->getTable('catalog_product_option_type_value'),
'is_default',
[
'type' => \Magento\Framework\DB\Ddl\Table::TYPE_SMALLINT,
'length' => 1,
'unsigned' => true,
'nullable' => false,
'default' => '0',
'comment' => 'Defines if Is Default'
]
);
}
}
}
หมายเหตุ : อย่าลืมเปลี่ยนรุ่นเปรียบเทียบตามโมดูลของคุณ
app / รหัส / ผู้ขาย / โมดูล / etc / adminhtml / di.xml
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
<type name="Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\CustomOptions">
<plugin name="vendor_module_custom_options_ui_plugin"
type="Vendor\Module\Plugin\CustomOptionsUiPlugin" />
</type>
</config>
app / รหัส / ผู้ขาย / โมดูล / ปลั๊กอิน / CustomOptionsUiPlugin.php
<?php
namespace Vendor\Module\Plugin;
use Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\CustomOptions;
use Magento\Ui\Component\Form\Field;
use Magento\Ui\Component\Form\Element\Checkbox;
use Magento\Ui\Component\Form\Element\DataType\Number;
/**
* Data provider for "Customizable Options" panel
*/
class CustomOptionsUiPlugin
{
/**
* Field values
*/
const FIELD_IS_DEFAULT = 'is_default';
/**
* @param \Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\CustomOptions $subject
* @param bool $meta
* @return bool
*/
public function afterModifyMeta(CustomOptions $subject, $meta) {
$result = $meta;
$result[CustomOptions::GROUP_CUSTOM_OPTIONS_NAME]['children']
[CustomOptions::GRID_OPTIONS_NAME]['children']['record']['children']
[CustomOptions::CONTAINER_OPTION]['children']
[CustomOptions::GRID_TYPE_SELECT_NAME]['children']['record']['children']
[static::FIELD_IS_DEFAULT] = $this->getIsDefaultFieldConfig(70);
return $result;
}
/**
* Get config for checkbox field used for default values
*
* @param int $sortOrder
* @return array
*/
protected function getIsDefaultFieldConfig($sortOrder)
{
return [
'arguments' => [
'data' => [
'config' =>[
'label' => __('Default'),
'componentType' => Field::NAME,
'formElement' => Checkbox::NAME,
'dataScope' => static::FIELD_IS_DEFAULT,
'dataType' => Number::NAME,
'additionalClasses' => 'admin__field-small',
'sortOrder' => $sortOrder,
'value' => '0',
'valueMap' => [
'true' => '1',
'false' => '0'
]
],
],
],
];
}
}
หมายเหตุ : ที่นี่เราใช้Magento\Ui\Component\Form\Element\Checkbox
แทนMagento\Ui\Component\Form\Element\Radio
องค์ประกอบตามที่ดูเหมือนว่าวีโอไอพีไม่เคยกำหนดไว้ในองค์ประกอบของแบบฟอร์ม
ดูvendor\magento\module-ui\view\base\ui_component\etc\definition.xml
บรรทัดที่ 112+
Magento\Catalog\Block\Product\View\Options\Type\Select
เพื่อตรวจสอบองค์ประกอบที่ได้รับเลือกเป็น "องค์ประกอบเริ่มต้น"app / รหัส / ผู้ขาย / โมดูล / etc / adminhtml / di.xml
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
<preference for="Magento\Catalog\Block\Product\View\Options\Type\Select"
type="Vendor\Module\Block\Rewrite\Catalog\Product\View\Options\Type\Select" />
</config>
app / รหัส / ผู้ขาย / โมดูล / บล็อก / Rewrite / Catalog / สินค้า / ดู / ตัวเลือก / ประเภท / Select.php
<?php
namespace Vendor\Module\Block\Rewrite\Catalog\Product\View\Options\Type;
/**
* Product options text type block
*/
class Select extends \Magento\Catalog\Block\Product\View\Options\Type\Select
{
/**
* Return html for control element
*
* @return string
* @SuppressWarnings(PHPMD.CyclomaticComplexity)
* @SuppressWarnings(PHPMD.NPathComplexity)
* @SuppressWarnings(PHPMD.ExcessiveMethodLength)
*/
public function getValuesHtml()
{
$_option = $this->getOption();
$configValue = $this->getProduct()->getPreconfiguredValues()->getData('options/' . $_option->getId());
$store = $this->getProduct()->getStore();
$this->setSkipJsReloadPrice(1);
// Remove inline prototype onclick and onchange events
if ($_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_DROP_DOWN ||
$_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_MULTIPLE
) {
$require = $_option->getIsRequire() ? ' required' : '';
$extraParams = '';
$select = $this->getLayout()->createBlock(
\Magento\Framework\View\Element\Html\Select::class
)->setData(
[
'id' => 'select_' . $_option->getId(),
'class' => $require . ' product-custom-option admin__control-select'
]
);
if ($_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_DROP_DOWN) {
$select->setName('options[' . $_option->getId() . ']')->addOption('', __('-- Please Select --'));
} else {
$select->setName('options[' . $_option->getId() . '][]');
$select->setClass('multiselect admin__control-multiselect' . $require . ' product-custom-option');
}
foreach ($_option->getValues() as $_value) {
$priceStr = $this->_formatPrice(
[
'is_percent' => $_value->getPriceType() == 'percent',
'pricing_value' => $_value->getPrice($_value->getPriceType() == 'percent'),
],
false
);
if($_value->getData('is_default') == true && !$configValue){
$configValue = $_value->getOptionTypeId();
}
$select->addOption(
$_value->getOptionTypeId(),
$_value->getTitle() . ' ' . strip_tags($priceStr) . '',
['price' => $this->pricingHelper->currencyByStore($_value->getPrice(true), $store, false)]
);
}
if ($_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_MULTIPLE) {
$extraParams = ' multiple="multiple"';
}
if (!$this->getSkipJsReloadPrice()) {
$extraParams .= ' onchange="opConfig.reloadPrice()"';
}
$extraParams .= ' data-selector="' . $select->getName() . '"';
$select->setExtraParams($extraParams);
if ($configValue) {
$select->setValue($configValue);
}
return $select->getHtml();
}
if ($_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_RADIO ||
$_option->getType() == \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_CHECKBOX
) {
$selectHtml = '<div class="options-list nested" id="options-' . $_option->getId() . '-list">';
$require = $_option->getIsRequire() ? ' required' : '';
$arraySign = '';
switch ($_option->getType()) {
case \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_RADIO:
$type = 'radio';
$class = 'radio admin__control-radio';
if (!$_option->getIsRequire()) {
$selectHtml .= '<div class="field choice admin__field admin__field-option">' .
'<input type="radio" id="options_' .
$_option->getId() .
'" class="' .
$class .
' product-custom-option" name="options[' .
$_option->getId() .
']"' .
' data-selector="options[' . $_option->getId() . ']"' .
($this->getSkipJsReloadPrice() ? '' : ' onclick="opConfig.reloadPrice()"') .
' value="" checked="checked" /><label class="label admin__field-label" for="options_' .
$_option->getId() .
'"><span>' .
__('None') . '</span></label></div>';
}
break;
case \Magento\Catalog\Api\Data\ProductCustomOptionInterface::OPTION_TYPE_CHECKBOX:
$type = 'checkbox';
$class = 'checkbox admin__control-checkbox';
$arraySign = '[]';
break;
}
$count = 1;
foreach ($_option->getValues() as $_value) {
$count++;
$priceStr = $this->_formatPrice(
[
'is_percent' => $_value->getPriceType() == 'percent',
'pricing_value' => $_value->getPrice($_value->getPriceType() == 'percent'),
]
);
$htmlValue = $_value->getOptionTypeId();
if ($arraySign) {
$checked = is_array($configValue) && in_array($htmlValue, $configValue) ? 'checked' : '';
} else {
$checked = $configValue == $htmlValue ? 'checked' : '';
}
$dataSelector = 'options[' . $_option->getId() . ']';
if ($arraySign) {
$dataSelector .= '[' . $htmlValue . ']';
}
$selectHtml .= '<div class="field choice admin__field admin__field-option' .
$require .
'">' .
'<input type="' .
$type .
'" class="' .
$class .
' ' .
$require .
' product-custom-option"' .
($this->getSkipJsReloadPrice() ? '' : ' onclick="opConfig.reloadPrice()"') .
' name="options[' .
$_option->getId() .
']' .
$arraySign .
'" id="options_' .
$_option->getId() .
'_' .
$count .
'" value="' .
$htmlValue .
'" ' .
$checked .
' data-selector="' . $dataSelector . '"' .
' price="' .
$this->pricingHelper->currencyByStore($_value->getPrice(true), $store, false) .
'" />' .
'<label class="label admin__field-label" for="options_' .
$_option->getId() .
'_' .
$count .
'"><span>' .
$_value->getTitle() .
'</span> ' .
$priceStr .
'</label>';
$selectHtml .= '</div>';
}
$selectHtml .= '</div>';
return $selectHtml;
}
}
}
อัปเกรดของคุณsetup_version
ในapp/code/Vendor/Module/etc/module.xml
อัปเดตของคุณversion
ใน app/code/Vendor/Module/composer.json
รันคำสั่งต่อไปนี้:
php bin/magento cache:clean
php bin/magento setup:upgrade