Accessing jQuery object

I know this sounds pretty trivial, but I'm new to jQuery... I use this plugin: http://www.emposha.com/javascript/fcbkcomplete.html

Its source code contains:

jQuery(function ($) {
    $.fn.fcbkcomplete = function (opt) {
        return this.each(function () {

            /// ...
            /// ...implementation deleted...
            /// ...

            // public method to add new item
            this.addItem = function (title, value) {
                addItem(title, value);
            }

            return this;
        });
    };
});

I know how to use this element in my code and it works fine:

    $(document).ready(function() 
    {        
        $("#select2").fcbkcomplete({ ... options deleted ... });
    });

Now I want to call public method addItem() on the instance of the object "fcbkcomplete" created in my code (for example, when I click a button or from onTimer event). But I don't know how to access it. I tried to do it this way, but it does not work:

  var fcel = $("#select2").fcbkcomplete({ ... options deleted ... });
  fcel.addItem('Test1', 'Test1');

Firefox shows error: "fcel.addItem is not a function".

Thanx...

13.10.2009 16:45:18
Do you want to make this: $("#select2").text($(this).val() + ' '+'TEST'); ?
powtac 13.10.2009 16:52:22
I don't know what your code should do ;-) I tried: $("#select2").addItem("Test1","Test2"); but it shows the same error. I want to call a public method of the object I created. This public method adds a new item to the list, but I don't know how to call this method.
oneee 13.10.2009 16:59:01
3 ОТВЕТА
РЕШЕНИЕ

From your example, it looks like fcbkcomplete returns a jquery object (not a DOM element), as that is what this.each() returns.

The addItem method is added to individual elements ("this" within the each function refers to an individual element).

So in order to call addItem, you would have to refer to an individual element. Try:

fcel[0].addItem('Test1','Test1')
0
13.10.2009 18:24:21
Old thread, later versions use trigger() : $("elem").trigger("addItem",[{"title": "test", "value": "test"}]); See Readme file before trying those solutions (I hadn't)
sglessard 28.08.2012 04:40:03

You have to add the elements to the list element used for the control (the control uses an input field and a list of elements).

Therefore you should add the elements to the UL.

(with something like $('#myUlId').append('<li>Hello</li>');)

Cheers

0
13.10.2009 17:00:28
Ok, maybe I can add new items manually, but what if I want to use that public method? No doubt, it is better solution...
oneee 13.10.2009 17:17:11

jQuery allows you to access variables like this:

$(fcel).addItem('Test1', 'Test1');

Just stick your variable name in there without any quotes. Presto.

-1
13.10.2009 17:02:09
Yeah, I tried it... But, it does not work... I got: $(fcel).addItem is not a function.
oneee 13.10.2009 17:15:56