Jquery plugin error Object [object Object] has no method 'methodname'

413 views Asked by At

I've created a jquery plugin for a project: http://jsfiddle.net/4kb9R/144/

I want this plugin to be able to either be used as, of course a plugin, but also have a public method available called init that basically does the same thing.

The problem I've encountered is that when I'm trying to run through the public init function I'm not able to run the private functions using:

   self = this;

   //Start using the amountFormatter
   this.init = function(elements) {
        if(elements instanceof jQuery) {
            //Check the value of each element and update it accordingly
            elements.each(function() {
                var $this = $(this);
                var elementIsInput = $this.is("input");

                value = $this.val() == "" ? $this.text().trim() : $this.val().trim();
                value = (typeof value === 'undefined') ? '0' : value;

                value = thousandSeperator(
                    convertNumber(roundingOfNumber(value, config.rounding))
                );

                //Checks whether we need to add the new amount as text or as a value
                return elementIsInput === true ?
                    elem.val(addCurrencyToNumber(value)) :
                elem.text(addCurrencyToNumber(value));
            });
        }
        else {
            if(elements.length !== 0) {                    
                for (var i = 0; i < elements.length; i++) {
                    var value = elements[i];

                    //I get the error here, when I'm using self;
                    elements[i] = self.addCurrencyToNumber(
                                        self.thousandSeperator(self.convertNumber(self.roundingOfNumber(value, config.rounding)))
                                  );
                }
                return elements;
            }
        }
    };

    this.init(elem);

I call the function like this:

var containerWithValue = $('.sf-insurance-amount');
var amountToTransform = containerWithValue.text();
var AmountsToFormat = ["4512.45", "784,687", "875943,5975"];

//Shows the original value...
$(".sf-insurance-amount-original").text("Original: " + amountToTransform);

// With options...
containerWithValue.amountFormatter({
    culture: "en",                   
    valuta:  "euro",
    rounding: 3
});

var amountFormatterData = containerWithValue.data('amountFormatter');
var newAmounts = amountFormatterData.init(AmountsToFormat);
console.log(newAmounts);

$.each(newAmounts, function(index, value) {
  $(".sf-insurance-amount-provided ul li").eq(value-1).html(value);
});

Anyone have an idea as to why this is? Am I using the this keyword incorrectly here? I would love to get a solution for this.

1

There are 1 answers

0
reaper_unique On BEST ANSWER

Stupid mistake. I switched things. I tried it like I wanted to use a public function inside a private one. I should have noticed it. if I want to access a private function in a public function I just need to call that function without the this keyword.

so it should be:

this.init = function(elements) {
    if(elements.length !== 0) {                    
         for (var i = 0; i < elements.length; i++) {
            var value = elements[i];
            elements[i] = addCurrencyToNumber(
                                      thousandSeperator(convertNumber(roundingOfNumber(value, config.rounding)))
                                  );
         }
         return elements;
    }
};