最新消息:Excel无乱码转CSV,由于工作原因很少更新博客和回复大家的评论,非常抱歉。

可筛选下拉框在Magento商城中的应用

在Magento添加可配置产品的时候,某一属性如果选项很多,我们就要盯着下拉框一个一个扫描下去了,这样会崩溃的。我用jQuery写了个可以对属性进行筛选的方法。实现原理就是弄了个假的select选择框覆盖在上面。先看下事例图。
未进行筛选的下拉框

筛选后的下拉框

在app/design/adminhtml/default/default/template/cagalog/product /edit/super/config.phtml加入以下代码.
其中#simple_product_huaxing是select的id,改为你的select的iD即可

<div id="huase">
<div id="selecthuaxin"><input type="text" /></div>
</div>
<script type="text/javascript">// <![CDATA[
 jQuery("#huase").insertBefore("#simple_product_huaxing");
jQuery("#selecthuaxin input").keyup(function(){
      var inputval=jQuery(this).val();
      jQuery("#weiselect li").remove()
jQuery("#simple_product_huaxing option:contains("+inputval+")").each(function(){
            var selecton=jQuery(this).text();
            var opval=jQuery(this).val();
var li=jQuery("

	<li />")
li.text(selecton)
jQuery("#weiselect").append(li)
li.addClass(opval)
jQuery("#weiselect li").click(function(){
      var lion=jQuery(this).attr("class")
      var litext= jQuery(this).text()
jQuery("#simple_product_huaxing").val(lion);
 jQuery("#selecthuaxin input").val(litext)
 jQuery("#weiselect li").remove()
})
jQuery("#simple_product_huaxing").change(function(){
var selcted=jQuery("#simple_product_huaxing option:selected").text()
  jQuery("#selecthuaxin input").val(selcted)
})
jQuery("#weiselect li").hover(function(){
jQuery(this).css({background:"#2E4A99",color:"#fff"})
},function(){
jQuery(this).css({background:"#fff",color:"#000"})
} ) 

      });

})
// ]]></script>

本文由网络转载,至于能不能实现,本人我也没有实践,如有使用此方法的,请在下方做出相应的评论,以便大家学习交流。

转载请注明:嗨酷哥,有你更酷! » 可筛选下拉框在Magento商城中的应用

与本文相关文章

发表我的评论

取消评论
表情 插代码

Hi,您需要填写昵称和邮箱!

  • 必填项
  • 必填项