Javascript Type error, not a function

Question

I have a strange problem that I just can’t solve! This is part of the big structure that I am writing, but I wrote some test code that has the same problem. See the following:

!function ($, window, undefined) { // BASE FUNCTION var test = function (selector, context) { return new test.fn.init(selector, context); }; // SELECTOR FUNCTIONS test.fn = { selector: undefined, init: function (selector, context) { // Use jQuery to build selector object this.selector = $(selector, context); return this; }, // Create a popup dialog popup: function (options) { this.selector.dialog(); } }, // Expose Carbon to the global object window.test = test; }(window.jQuery, window); 

Now when I use the following:

 test('#popupLink').popup(); 

I get "TypeError: test (" # popupLink "). Popup is not a function." I know this partially works, as I can use standard jQuery functions if I do something like:

 test('#popupLink').selector.hide(); 

Any help would be greatly appreciated since I now have a mental block. Thanks in advance!:)

Update

I used console.log to view the returned object, and it only has a selector element, which makes sense since I did not use a prototype. How can i fix this?

Answer 1

 (function ($, window) { // BASE FUNCTION var test = function (selector, context) { return new test.fn.init(selector, context); }; // SELECTOR FUNCTIONS test.fn = test.prototype = { constructor: test, init: function (selector, context) { // Use jQuery to build selector object this.selector = $(selector, context); return this; }, // Create a popup dialog popup: function (options) { console.log('popup'); return this; } }; // Expose test to the global object window.test = test; }(window.jQuery, window)); test.fn.init.prototype = test.fn; 

You missed the constructor and prototype chain in the created test instances.