13

Has anyone extended an existing jQuery plugin?

I am unsure of where to start. I would rather not actually copy and modify the plugin I wish to extend. Do I do this through prototype or just an extend call on the plugin in question?

Or am I dreaming that it would make sense to do this?

Chad Ruppert
  • 3,650
  • 1
  • 19
  • 19

2 Answers2

10

EDIT: As pointed out by Seb, this is not strictly an example of 'extending' a plugin, more 'encapsulating' a plugin, so take it as it comes :)

Here's something I did to simplify my usage of the jquery autocomplete plugin a while ago:

// small autocomplete plugin wrapping the full autocomplete plugin for a standard look and feel
(function($) {
    $.fn.standardAutocomplete = function(type) {
        return this.autocomplete(ToAbsoluteUrl("~/System/Autocomplete/" + type), {
            formatItem: formatItem,
            formatResult: formatResult
        });
        // Autocomplete formatting callbacks
        function formatItem(row) { return row[0] + "<span class=\"sub\">" + row[1] + "</span>"; }
        function formatResult(row) { return row[0].replace(/(<.+?>)/gi, ''); }
    }
})(jQuery);

Now that's not following "by the book" jquery coding practise - e.g. I'm not accounting for the fact there could be multiple elements selected, but in this case, I know I'm never going to select more than one element on a page with this so I wanted to keep simple, and it "works for me". You might be able to use a similar approach, perhaps with a little more sophistication.

Steve Willcock
  • 26,111
  • 4
  • 43
  • 40
  • Actually, I was considering that method, as it feels less dirty than copying and pasting. You'll forgive me if I hold out for a 'by the book' answer for a while before marking yours as the answer? :) – Chad Ruppert Apr 16 '09 at 19:31
  • 6
    This is a wrapper, it's not extending any class nor object. You're in fact creating a new plugin that _uses_ other, but doens't have any of the other plugin's methods nor options - in that case, you're extending anything. – Seb Apr 16 '09 at 23:24
  • I know it's a wrapper - that's why it says 'wrapping the full autocomplete plugin' in the code comments. I didn't claim this was 'extending' anything, it's just an example of something that was useful for me when I needed more consistent functionality from a plugin I was using. – Steve Willcock Apr 17 '09 at 08:38
  • Well, since there appear to be no further answers on this points to Steve, since it's at least advice. – Chad Ruppert Apr 17 '09 at 12:56
  • Edited the post to point out that it's not really extending, more encapsulating - to make it clear to anyone reading it ;) – Steve Willcock Apr 17 '09 at 13:34
2

If the plugin is well done, then you don't have many alternatives other than using its options to change its behavior.

The purpose of this is that all its code is encapsulated and doesn't interfere with other code, so you can't inject any code in it.

If you really need to change its behavior, then I guess you'll need to copy & paste the code.

Seb
  • 24,920
  • 5
  • 67
  • 85
  • 1
    In typical inheritence you aren't injecting code, but extending the object, creating a new one. Can we not use normal inheritance in this case? I am not looking to modify an existing method, but to add methods and the like. – Chad Ruppert Apr 16 '09 at 19:16
  • See my comment in Steve's answer to know my opinion. In short, I think you won't be able to extend, but _WRAP_, which is something completely different than what you asked. – Seb Apr 16 '09 at 23:25
  • I understand it's a wrapper, which is why it was my *second* choice when compared to true inheritance. – Chad Ruppert Apr 17 '09 at 12:49