编程语言
首页 > 编程语言> > 将新的简单javascript注入magento后端(作为模块)

将新的简单javascript注入magento后端(作为模块)

作者:互联网

我想在magento产品管理后端的一些描述和元字段上添加简单的字符计数器功能.就像下面的截图一样.

我通过将简单的原型脚本添加到一个JS文件中来实现,该文件在magento admin HTML上加载.我选择了browser.js(/js/mage/adminhtml/browser.js)因为这是我在magento安装的后端区域加载的最后一个脚本.这是我的原型脚本代码块:

/* ADMIN CHAR COUNTER SCRIPT */
Event.observe(window, 'load', function() {

    Element.insert( $('meta_title').up().next().down('span'), { 
        'after': "<div id='meta_title_counter'>Char count: <span id='meta_title_counter_num'>"+(69-$('meta_title').getValue().length)+"</span></div>"
    });
    Element.insert( $('meta_description').up().next().down('span'), { 
        'after': "<div id='meta_description_counter'>Char count: <span id='meta_description_counter_num'>"+(156-$('meta_description').getValue().length)+"</span></div>"
    });
    Element.insert( $('short_description').up().next().down('span'), { 
        'after': "<div id='short_description_counter'>Char count: <span id='short_description_counter_num'>"+$('short_description').getValue().length+"</span></div>"
    });
    Element.insert( $('description').up().next().down('span'), { 
        'after': "<div id='description_counter'>Char count: <span id='description_counter_num'>"+$('description').getValue().length+"</span></div>"
    });

    Event.observe('meta_title', 'keyup', function(event) {  
        $counter = 69-$('meta_title').getValue().length;
        $("meta_title_counter_num").update($counter);
        if($counter < 0){ $("meta_title_counter").setStyle({ color: 'red' }); }
        else{ $("meta_title_counter").setStyle({ color: '#6F8992' }); }
    });
    Event.observe('meta_description', 'keyup', function(event) {
        $counter = 156-this.getValue().length;
        $("meta_description_counter_num").update($counter);
        if($counter < 0){ $("meta_description_counter").setStyle({ color: 'red' }); }
        else{ $("meta_description_counter").setStyle({ color: '#6F8992' }); }
    });
    Event.observe('short_description', 'keyup', function(event) {   $("short_description_counter_num").update(this.getValue().length);  });
    Event.observe('description', 'keyup', function(event) { $("description_counter_num").update(this.getValue().length);    });
});
/* END OF CHAR COUNTER MODULE */

我确实意识到我所做的是如此快速而肮脏的伎俩.我几乎编辑核心文件.这意味着在升级magento后将删除此脚本.我的老板让我把这个功能放到一个模块中.但我没有任何创建magento模块的经验.我试图找到一些关于如何创建简单的magento模块的基础教程.但是这些教程都没有给我一种注入新脚本的方法.这可能是最近的指南:

http://www.magentocommerce.com/wiki/5_-_modules_and_development/admin/how_to_customize_backend_template_f.e._sales_order_information

但我仍然不知道从哪里开始这个简单的模块创建.我很抱歉,如果这个问题感觉太新手了,但我真的需要帮助,而不像平常一样,这次谷歌无法帮助我(或者至少我找不到一个好的关键词来开始谷歌搜索).所以在这里我希望那里的人会很乐意帮助我:)

解决方法:

尝试使用管理布局更新添加模块文件

<adminhtml_catalog_product_edit>
    <reference name="head">
        <action method="addJs"><script>your_js_file.js</script></action>
    </reference>
</adminhtml_catalog_product_edit>

甚至

<default>
    <reference name="head">
        <action method="addJs"><script>your_js_file.js</script></action>
    </reference>
</default>

在所有管理页面上添加加载js文件.

标签:javascript,magento,prototypejs
来源: https://codeday.me/bug/20190902/1793867.html