3.3.2.5. Configuring jQuery plugins

This section shows you how to configure a jQuery plugin and how to use it in the jQueryPluginPortlet portlet.

  1. Use the jQuery plugin as a minimal one:
    (function($) {
     $.fn.doesPluginWork = function() {
        alert('YES, it works!');
     };
    })(jQuery);
  2. Declare it as a module:

    
    <module>
      <name>jquery-plugin</name>
      <as>jqPlugin</as>
      <script>
        <path>/jqueryPlugin/jquery-plugin.js</path>
      </script>
      <depends>
        <module>jquery</module>
        <as>jQuery</as>
      </depends>
    </module>
  3. Use this plugin in your portlet:

    
    <portlet>
      <name>jQueryPluginPortlet</name>
      <module>
        <script>
          <path>/jqueryPlugin/jqueryPluginPortlet.js</path>
        </script>
        <depends>
          <module>jquery</module>
          <as>$</as>
        </depends>
        <depends>
          <module>jquery-plugin</module>
        </depends>
      </module>
    </portlet>

Note

Your portlet module should depend on the jquery and you need to declare:

  • The dependency on jquery that allows using the jQuery object.

  • The dependency on jquery-plugin that ensures the plugin to be loaded in the jquery dependency before it is injected in the portlet module.
Copyright ©. All rights reserved. eXo Platform SAS
blog comments powered byDisqus