Example for Marko

application.js

/*
  =form_for :sendemail, :url => :sendemail_index,:remote => true, :html => { :"data-name" => "Contact ASC Admin", :"data-cancelable" => true }
*/

var Asc = {
  
  center: $(window).width() / 2,
  
  _init: function(){
    Asc.notice_fade()
    Asc.data_table()
    Asc.bind_events()
  },
  
  bind_events: function(){
    $('a[data-modal="form"]').live('ajax:success', Asc.modal)
    
    $(document).ajaxComplete(function(event, request, options){
      if (request.getResponseHeader('X-Message-Type')) {
        var msg = {
          type: request.getResponseHeader('X-Message-Type').split(","),
          html: request.getResponseHeader('X-Message').split(","),
        }
        $('#message_container').html("");
        $.each(msg.type, function(index, val) {
          $(document.createElement('div')).addClass(val).html(msg.html[index]).appendTo('#message_container')
        });
        $('.modal_dialog').dialog('close')
        Asc.notice_fade();
      }
    })
    
  },
  
  modal: function(event, data){
    var d = $(document.createElement('div')).addClass("modal_dialog")
        d.html(data)
        var submit_button = d.find('input[type="submit"]')
        var form = d.find('form')
        var buttons = []
        
        if(form.data('cancelable')) buttons.push( {text: "Cancel", click: function(){ $(this).dialog("destroy") }} )
        buttons.push( {text: submit_button.val(), click: function(){ form.submit() } } )
        
    var dialog = d.dialog({
                  open: function(event, ui) { $(this).parent().find('.ui-dialog-titlebar-close').remove() },
                  title: form.data('name'),
                  buttons: buttons,
                  show: "fade",
                  width: 460
                  })
                  
    submit_button.remove();
    dialog.parent().data('dialog', true) 
  },
  
  notice_fade: function(){
    if ($('.notice, .alert').length) {
      var notice_alert = $('#message_container')
          notice_alert.css({display:'block'})
      setTimeout(function(){ notice_alert.fadeOut('slow') }, 4000)
      notice_alert.css({
        left:  Asc.center - notice_alert.width() / 2
      })
    }
  },
  
  data_table: function(){
    if ($("table.dt").length) {
      var dTable = $("table.dt").dataTable({
        "bProcessing":  true,
        "bServerSide":  true,
        "sAjaxSource":  "/publisher.json"
      })
    }
  }

}

head(Asc._init);