1

I have an app that uses AngularJS for an Orders page, which connects via the JSON API to my SQLite3/ Postrgres database in Rails. I can create and delete Orders from the Angular page, but I'm having trouble updating the column for order shipped (a checkbox). When I click on the checkbox, the JS console indicates the change of the shipped value from false to true, but then it returns an error: POST ... /orders/1.json 404(Not Found).

I think the problem might be with the code in the Rails orders_controller.

Here is my code.

index.html.erb

<input type="checkbox" value="order.shipped" ng-click="changeShipped(order)">

app.js

// change shipped status via checkbox
$scope.changeShipped = function(order) {
  order.shipped = !order.shipped;
  models.orders.save(order); // returns POST... 404 (Not Found)
  console.log(order.shipped);  // indicates true / false
}

orders_controller.rb

class OrdersController < ApplicationController
  protect_from_forgery
  skip_before_action :verify_authenticity_token, if: :json_request?
  respond_to :json, :html
  load_and_authorize_resource

def index
  @user = current_user
  @orders = Order.all.to_json(:include => [{:product => {:only => :title}}, {:user => {:only => :email}}])
  respond_with @orders  
end

def show
  @order = Order.find(params[:id]).to_json(:include => [{:product => {:only => :title}}, {:user => {:only => :email}}])

# def new
# end

def create
  @order = Order.create(order_params)
  respond_with @order
end

def update
  @order = Order.find(params[:id])
  respond_with @order
end

def destroy
  respond_with Order.destroy(params[:id])
end

protected

def json_request?
  request.format.json?
end

private
def order_params
  params.require(:order).permit(:product_id, :user_id, :total, :shipped)
  end
end

order model

t.integer "user_id"
t.integer "product_id"
t.decimal   "total"
t.boolean "shipped",    default: false, null: false
t.index ["product_id"], name: "index_orders_on_product_id"
t.index ["user_id"], name: "index_orders_on_user_id"

routes.rb

Rails.application.routes.draw do
  devise_for :users, :controllers => { :registrations =>  "user_registrations" }
  resources :users
  resources :orders, only: [:index, :show, :create, :update, :destroy]

  resources :products do
   resources :comments
  end

  root 'static_pages#index'

  get '/search', to: 'static_pages#search'

  get '/search_results', to: 'products#search_results'

  get '/about', to: 'static_pages#about'

  get '/contact', to: 'static_pages#contact'

  post 'static_pages/thank_you'

  devise_scope :user do
    get '/sign_up', to: 'devise/registrations#new'
    get '/profile', to: 'devise/registrations#edit'
  end

  post '/payments/create', to: 'payments#create'
  get 'payments/payment_thank_you', to: 'payments#payment_thank_you'
end
1
  • Could you also post your routes? Commented Jul 28, 2016 at 10:07

1 Answer 1

1

From what I can tell, it seems you're sending a POST request to the update action but by default, rails is expecting a PUT or PATCH request to that action.

However most browser do not support a real http PUT or PATCH request via ajax, so the trick is to add, a specific _method to the posted json data.

{_method:'put', order: order_data } Ruby on rails - PUT method on update ajax

Sign up to request clarification or add additional context in comments.

2 Comments

That could be right. How would I my JS? $scope.changeShipped = function(order) {
You need to check the models.orders.save(order) as this code seems to be sending the ajax request. You need to update it so that it sends a PUT request instead of a POST.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.