Question

I am in the process of rewriting a website in Coffeescript and I am having trouble with some very nooby errors. I know it is probably a very simple answer, but I’ve been stuck on this for quite some time so decided to post.

Here is my code:

$ ->
    rankings = new Rankings
    $('.filter').click ->
        #highlighting filter on click
        if $(this).hasClass('genre-filter')
            rankings.filters.set('genre', $(this).html().toLowerCase())
        else   
            rankings.filters.set('time', $(this).html().toLowerCase())
        #todo: add loading screen to rankings here
        #ajax post
        $.post '../history/ajax/rankingsajax.php',
            genrefilter: rankings.filt('genre')
            timefilter: rankings.filt('time')
            artistfilter: rankings.filt('artist')
            userfilter: rankings.filt('user')
            (data) ->
                alert data

No matter how I try and fiddle with it, it always ends up alerting a blank pop-up window. So I thought I’d try a simpler example and just use a get request. I tried the following:

    $.get '../index.html', (data) -> alert data

However, this also results in a blank pop-up window.

The the above code compiles correctly to JS so I am lost as to where to begin. Any help is appreciated.

-Calvin

Answer 1

Don’t be afraid to use curly braces and parenthesis. They’re not required, but they can help clarify what’s going on.

$ ->
    rankings = new Rankings
    $('.filter').click ->
        #highlighting filter on click
        if $(this).hasClass('genre-filter')
            rankings.filters.set('genre', $(this).html().toLowerCase())
        else   
            rankings.filters.set('time', $(this).html().toLowerCase())
        #todo: add loading screen to rankings here
        #ajax post
        $.post '../history/ajax/rankingsajax.php', {
            genrefilter: rankings.filt('genre')
            timefilter: rankings.filt('time')
            artistfilter: rankings.filt('artist')
            userfilter: rankings.filt('user')
        }, (data) -> console.log(data)

The blank popup at least lets you know you’re getting to the success callback, which is good. So maybe check that you’re calling the correct url. I noticed you’re using a relative path, ../history/ajax/rankingsajax.php, make sure that path is relative to the HTML page that is using the JavaScript and not the JavaScript file itself.

Instead of alert(data), I would use console.log(data) and use Firebug or the JS console in Chrome and Safari to see what’s going on. The console provides more information than an alert.

Good luck,
Sandro