Magento Multiusect的自定义界面
-
29-09-2020 - |
题
我的多选择列表非常大,很难找出选择哪个选项,我想将其更改为以下一些东西,是可能的吗? 它可以是任何在哪里,但目前我有一个自定义“customer_address”属性类型“multipelect”,
我正在创建像我的SQL脚本一样的属性,
<?php
$installer = $this;
$installer->startSetup();
$installer->addAttribute('customer_address', 'additional_managers', array(
'label' => 'Additional Store/Site Managers',
'visible' => true,
'required' => false,
'type' => 'varchar',
'input' => 'multiselect',
'source' => 'abc_districtmanager/address_attribute_source_districtmanager',
'onclick' => 'getSelectValues(this)',
'user_defined' => 1,
'position' => 100
));
$used_in_forms = array(
'adminhtml_customer_address',
'customer_address_edit',
'customer_register_address'
);
$attribute = Mage::getSingleton('eav/config')->getAttribute('customer_address', 'additional_managers');
$attribute->setData('used_in_forms', $used_in_forms);
$attribute->save();
$installer->endSetup();
. 解决方案 2
我通过使用“选择”jQuery来了解稍微改变的界面。
下载 chened jquery chosen.jquery.js 和 chosen.css,将这些文件放在您的设计中,将它们添加到备受尊重的.xml文件中的模块,如
<reference name="head">
<!-- Adding js and css to use "chosen" instead of "select" for "multiselect" input types-->
<action method="addItem">
<type>skin_js</type>
<name>js/chosen.jquery.js</name>
</action>
<action method="addItem">
<type>skin_css</type>
<name>css/chosen.css</name>
</action>
</reference>
.
要小心文件,在此之后,在备受尊重的视图中( .phtml )使用所选
<script type="text/javascript">
jQuery(document).ready(function ($) {
$(".myClass").chosen();
});
.
其他提示
您可以通过以下代码达到此功能
<select onchange="getSelectValues(this)"></select>
function getSelectValues(select) {
var options = select && select.options;
var opt;
for (var i=0, iLen=options.length; i<iLen; i++) {
opt = options[i];
if (opt.selected) {
opttext +=opt.text+'<br />';
}
}
document.getElementById('showdiv').innerHtml=opttext;
}
.
使用原型
$("_itemNaNadditional_managers").invoke('observe', 'change', function() {
var options = $("_itemNaNadditional_managers").options;
var opt;
for (var i=0, iLen=options.length; i<iLen; i++) {
opt = options[i];
if (opt.selected) {
opttext +=opt.text+'<br />';
}
}
document.getElementById('showdiv').innerHtml=opttext;
});
.