Question

I have a custom plugin, with a constructor like this:

 (function($){

    $.fn.extend({ 

        myplugin: function(options) {
  [..]

In the plugin, I have a bunch of other functions. Now I attach my plugin to a dom-element:

$('myelement').myplugin()

and after that I want to send a message to the plugin from the wrapping document. Basically, I want to call the internal function with custom parameters from outside. How can I achieve this?

Thanks a lot.

Answer 1

I follow the following pattern while developing jQuery plugins. Its quite helpful:

(function($)   {
   $.fn.myWidget = function(options)  {
      var defaults = {
         // default options
      };
      // these are our final options
      var opts = $.extend(defaults, options);

      // private functions
      var myFunc = function(param) {
      };

      // our widget object
      var widget = {
         functionA: function(strMsg)  {
            // do something important or call internal function myFunc
         },


         functionB: function(idx)   {
            // do something important
         }
      };
      // return the widget object 
      return widget; // THIS WILL HELP YOU CALL FUNCTIONS ON YOUR WIDGET
   };
})(jQuery);

var w = $("#myDiv").myWidget();
w.functionA("Hell(o)");

Another way to do it:

(function($)   {
   $.fn.myWidget = function(options)  {
      var defaults = {
         // default options
      };
      // these are our final options
      var opts = $.extend(defaults, options);

      // private functions
      var myFunc = function(param) {
      };

      this.functionA = function(strMsg) {
      };

      this.functionB = function(param) {
      };

      return this;

   };
})(jQuery);

var w = $("#myDiv").myWidget();
w.functionA("Hell(o)");