CODEWITHSUNDEEP
coffeescript
Viktor
Viktor

Reputation: 702

Coffescript not compiling valid source

I'm calling this function and get error in this place: data: { key: node.parent.data.key } saing "Unexpected {". Is there something wrong. because I can't find the error.

 $("#discipline-list", @el).dynatree({
        fx: { height: "toggle", 
        duration: 100 },
        initAjax: {
          url: "/disciplines",
          data: { mode: "funnyMode" }
        },
        onLazyRead: (node) ->
            console.log(node);
            node.appendAjax({url: "/disciplines_details",
                data: { key: node.parent.data.key }
            });
        });

Upvotes: 0

Views: 437

Answers (3)

Ricardo Tomasi
Ricardo Tomasi

Reputation: 35283

The object properties on the same line are confusing the parser:

node.appendAjax({url: "/disciplines_details",

Just move url to the next line and it should work:

node.appendAjax({
    url: "/disciplines_details",

That said, you're still writing javascript.

Whitespace is significant in coffeescript (i.e. you can't minify it). Correct indentation is essential, and this code is all wrong. Fix indentation, get rid of commas and semi-colons:

$("#discipline-list", @el).dynatree({
    fx: {
        height: "toggle"
        duration: 100
    }
    initAjax: {
        url: "/disciplines",
        data: { mode: "funnyMode" }
    }
    onLazyRead: (node) ->
        console.log(node)
        node.appendAjax({
            url: "/disciplines_details"
            data: { key: node.parent.data.key }
        })
})

Then proceed to get rid of brackets and parenthesis as in @Billy's last sample. If you're not comfortable you should try sticking to plain javascript for some time.

Upvotes: 0

Billy Moon
Billy Moon

Reputation: 58619

Coffee script is not appreciating having the anonymous object properties on the same line. Adding a single newline fixes this...

 $("#discipline-list", @el).dynatree({
        fx: { height: "toggle", 
        duration: 100 },
        initAjax: {
          url: "/disciplines",
          data: { mode: "funnyMode" }
        },
        onLazyRead: (node) ->
            console.log(node);
            node.appendAjax({
                url: "/disciplines_details",
                data: { key: node.parent.data.key }
            });
        });

EDIT: How to convert js to coffee script...

go to http://js2coffee.org/ and paste the js (corrected from your version)

$("#discipline-list", this.el).dynatree({
    fx: { height: "toggle", 
    duration: 100 },
    initAjax: {
        url: "/disciplines",
        data: { mode: "funnyMode" }
    },
    onLazyRead: function(node){
        console.log(node);
        node.appendAjax({ url: "/disciplines_details",
            data: { key: node.parent.data.key }
        });
    }
});

You will end up with well formed coffee script...

$("#discipline-list", @el).dynatree
  fx:
    height: "toggle"
    duration: 100

  initAjax:
    url: "/disciplines"
    data:
      mode: "funnyMode"

  onLazyRead: (node) ->
    console.log node
    node.appendAjax
      url: "/disciplines_details"
      data:
        key: node.parent.data.key

Upvotes: 2

Thilo
Thilo

Reputation: 262842

I don't know exactly what is wrong, but the more canonical way to write it would be

node.appendAjax
  url: "/disciplines_details"
  data: 
    key: node.parent.data.key

With compile errors like that, always first go to Try Coffeescript and see how it gets parsed. That makes it very easy and quick to fix in most cases.

Upvotes: 0

Related Questions