CODEWITHSUNDEEP
javascriptjqueryooppropertiesundefined
Ryan
Ryan

Reputation: 1791

Why does this jQuery OOP property became undefined?

Why does the property of this code is not showing after the click event?

Property this.ContainerId became undefined when it entered the this.ShoutCount method.

Thank you.

var table = function (containerId) {
  this.ContainerId = containerId;
  
  this.ShoutCount = function (totalC) {
        var label = $("#" + this.ContainerId + " .result").text();
        alert(totalC + " " + label);
  }
  this.ClickCount = function (sc) {
    $("#" + this.ContainerId + " .showTotalCount").click(function () {
      sc($(this).text());
    });
  }
  this.ClickCount(this.ShoutCount);
}

var t = new table("user-tab-pagination");
<div id="user-tab-pagination">
  <div class="search-count"><span class="showTotalCount">100</span> <span class="result">Result(s)</span></div>
</div>

Upvotes: 1

Views: 65

Answers (1)

Dan Lowe
Dan Lowe

Reputation: 56637

Because once you enter the ShoutCount method, this is scoped to that method, not to the outer method. You need to use bind to attach the scope you want, e.g.

this.ShoutCount = function (totalC) {
  var label = $("#" + this.ContainerId + " .result").text();
  alert(totalC + " " + label);
}.bind(this);

Upvotes: 2

Related Questions