Make transaction form remote

app/assets/javascripts/application.js

@@ -19,7 +19,6 @@
 ready = function() {
   $(".select2-selector").select2({
     width: 'resolve',
-    allowClear: true,
     placeholder: "Ontvanger"
   });
 }

app/assets/javascripts/transactions.coffee

@@ -1,3 +1,17 @@
 # Place all the behaviors and hooks related to the matching controller here.
 # All this logic will automatically be available in application.js.
 # You can use CoffeeScript in this file: http://coffeescript.org/
+ready = ->
+  $("#new_transaction").on("ajax:success", (e, data, status, xhr) ->
+    console.log("success")
+  ).on("ajax:error", (e, xhr, status, error) ->
+    console.log(e)
+    console.log(xhr)
+    console.log("failed")
+  )
+$.ajaxSetup({
+  dataType: 'json'
+})
+
+$(document).ready(ready)
+$(document).on('page:load', ready)

app/controllers/transactions_controller.rb

@@ -20,21 +20,11 @@ class TransactionsController < ApplicationController
   end
 
   def create
-    @transaction = Transaction.new(transaction_params)
+    transaction = Transaction.new(transaction_params)
-    respond_to do |format|
+    if transaction.save
-      format.html do
+      head :created
-        @user = current_user
+    else
-        if @transaction.save
+      render json: transaction.errors.full_messages, status: :unprocessable_entity
-          flash[:success] = "Transaction created"
-          redirect_to current_user
-        else
-          render "users/show"
-        end
-      end
-
-      format.json do
-        head(@transaction.save ? :created : :unprocessable_entity)
-      end
     end
   end
 

app/views/transactions/_new.html.haml

@@ -1,5 +1,5 @@
 = render 'partials/form_errors', object: @transaction
-= form_for @transaction, html: { class: "pure-form" } do |f|
+= form_for @transaction, remote: true, html: { class: "pure-form" } do |f|
   - if current_user.penning
     = f.collection_select :debtor, User.all, :name, :name,
         { selected: @transaction.debtor.try(:name) || current_user.name }, { class: 'select2-selector'}
@@ -8,10 +8,13 @@
     = f.select :creditor,
         options_from_collection_for_select(User.all.order(:name), :name, :name),
         { include_blank: true },
-        { class: 'select2-selector', size: 50, required: true }
+        { class: 'select2-selector', size: 50 }
-  = f.text_field :message, required: true, placeholder: "Message", size: 75
+  -# { class: 'select2-selector', size: 50, required: true }
+  = f.text_field :message, placeholder: "Message", size: 75
+  -# = f.text_field :message, required: true, placeholder: "Message", size: 75
   %fieldset.pure-group-inline
     %span.euro.pure-group-addon
     = f.number_field :euros, value: amount(@transaction.amount),
-        placeholder: "Bedrag", step: 0.01, min: 0.01, class: "pure-group-addon price", size: 20, required: true
+        placeholder: "Bedrag", step: 0.01, min: 0.01, class: "pure-group-addon price", size: 20
+    -# placeholder: "Bedrag", step: 0.01, min: 0.01, class: "pure-group-addon price", size: 20, required: true
   = f.submit "Send it!", class: "pure-button pure-button-primary"