javascript - jQuery ajax POST request fired twice -

the ajax post request i'm firing here insert line of data database 2 separate tables. first, here jquery code.

$(window).on 'add.playlist', (e, collection, callback) ->     e.preventdefault()     e.stoppropagation()     if window.playlist.show_bucket_list()[0].id       alert 'you have made playlist these videos.'       return false     if $('.add-playlist input').val().trim().length < 1       alert 'please make name.'       return false     $.ajax       url: '/playlist/add/new'       method: 'post'       async: false       headers:         accept: 'application/json'       data:         playlist_name: $('.add-playlist input').val()         data: json.stringify collection       success: (d, s, x) ->         console.log 'playlist add result: ', d         if x.status isnt 200           return 'error'       error: (x, s, d) ->         console.log s, d     return callback() if callback   $ '.add-playlist form'     .on 'submit', (e) ->       after_adding_playlist = ->         $ '.add-playlist-success'           .removeclass 'hide'           .addclass 'animated fadeinright'         settimeout ->           $('.add-playlist-success').addclass('animated fadeoutright')         , 2000         settimeout ->           $('.add-playlist-success').addclass('hide').removeclass('animated fadeinright fadeoutright')         , 3500       $(window).trigger 'add.playlist', [window.playlist.show_bucket_list(), after_adding_playlist] 

please note i'm using coffeescript instead of javascript. created event called add.playlist , bound callback function it. , when form submitted, event triggered , after_adding_playlist function fired when it's finished. however, came realize every time submit form, post request fired twice, first data , second no data, hence server returning

syntaxerror: unexpected token u  

because there no json-formatted data parse. why happening? i've navigated through of similar questions on stack overflow couldn't find answer.