Coffeescript objects, jquery callback and variable scope conflicts and confusion

Question

Trying to find out best approach to have this work:

class Person

  constructor: (@el) ->
    @el = $(el)
    this.bind()

  bind: ->
    @el.find('.something').on 'click', ->
      $(this).hide()       # conflict!
      this.do_something()  # conflict!

  do_something: ->
    alert 'done!'

I'm aware I can use the hash rocket (=>) and then access this.do_something from within my callback, but then that conflicts with callback 'this', and so jquery is trying to select object, not element '.something'. How to resolve this?

Answer 1

You can't get this to refer to different objects. Use a different identifier, by storing the instance's this reference in an auxiliary variable:

  bind: ->
    person = this
    @el.find('.something').on 'click', ->
      $(this).hide()
      person.do_something()