Question

The following is not working because @only is undefined (stated 30 times in the log). I guess the function is executed out of the scope, but I don’t understand why and how to solve this.

class DateDisabler

  constructor: (@only) ->

  beforeShowDay: (date) ->
    console.log @only
    if @only == date.getDate()
      [true, 'available', 'This date is a good date']
    else
      [false, 'unavailable', 'This date is NOT good']

jQuery ->
  $('.datepicker').each (i, e) ->
    dates = $(e).data('only')
    disabler = new DateDisabler dates
    $(e).datepicker({beforeShowDay: disabler.beforeShowDay})

Also I’d like an opinion if you think this is a good approach. I’m trying to get an html div to handle everything with the following:

.datepicker{data: {only: 5}}

Here the fiddle. Sorry for some reason it doesn’t run there(if you know…), but at least there’s html and js for whom prefer it.

Thanks

Answer 1

Alex is right about the underlying cause of the problem so you could inline the callback function but the more idiomatic way to get around the this problem in CoffeeScript is to use a fat-arrow when you define the callback function:

beforeShowDay: (date) =>
  #...

That will bind the function to the context that you’re expecting it to have. Also, you can use CoffeeScript on http://jsfiddle.net/ by selecting it in Panels in the sidebar.

Demo: http://jsfiddle.net/ambiguous/Ztgsq/