Currently im not able to update my obj becuz im getting a rails 422 unprocessible entity error .I have defined all the params properly not sure why this is happening pls take a look at my code below.I have a rails backend and react front end. Routes.rb In my console I get a "EditReservationForm.js:14 PATCH http://localhost:4000/reservations/2 422 (Unprocessable Entity)" and in the rails logs

Started PATCH "/reservations/2" for 127.0.0.1 at 2022-09-01 11:53:07  0530
Processing by ReservationsController#update as */*
  Parameters: {"name"=>"koshieee", "date"=>"2022-08-30", "time"=>"2000-01-01T18:29:00.000Z", "num"=>2, "contact"=>12345, "occasion"=>"Bday", "id"=>"2", "reservation"=>{"name"=>"koshieee", "date"=>"2022-08-30", "time"=>"2000-01-01T18:29:00.000Z", "num"=>2, "contact"=>12345, "occasion"=>"Bday"}}
hello
4

Rails.application.routes.draw do
  
  resources :reservations,only: [:index,:show,:create,:update,:destroy]
  resources :reviews,only: [:index,:create,:destroy]
  resources :restaurants,only: [:index]
 

  
  post "/signup", to: "users#create"
  get "/me", to: "users#show"
  post "/login", to: "sessions#create"
  delete "/logout", to: "sessions#destroy"
 
end

Reservation controller

class ReservationsController < ApplicationController
    def index
        reservations = @current_user.reservations
         render json: reservations
      end

      def show
        reservation = Reservation.find_by(id: params[:id])
        if reservation
          render json: reservation
        else
          render json: { error: "Reservation not found" }, status: :not_found
        end

      end

    def create
        reservation=Reservation.create!(reservation_params)
        render json: reservation,status: :created


    end

    def update
        reservation = Reservation.find_by(id: params[:id])
        reservation.update!(reservation_params)
        render json: reservation,status: :ok

    end
  

    def destroy
   
        reservation = Reservation.find_by(id:params[:id])
        if reservation
          reservation.destroy
          head :no_content

        else
            render json: {error: "Reservation Not Found ."}, status: :not_found
        end
    end



    private
    
    def reservation_params
        params.permit(:name, :date, :time, :num, :contact, :occasion,:user_id,:restaurant_id)

    end
   
end

EditForm.js

import { useState } from "react";
function EditReservationForm({reservation,onUpdateReservation}){
    const{ name, date, time, num, contact, occasion}=reservation;
    const[updateName,setUpdatedName]=useState(name);
   const[updateDate,setUpdatedDate]=useState(date);
   const[updateTime,setUpdatedTime]=useState(time);
   const[updateNum,setUpdatedNum]=useState(num);
   const[updateContact,setUpdatedContact]=useState(contact);
   const[updateOccasion,setUpdatedOccasion]=useState(occasion);

   function handleEditClick(e) {
       e.preventDefault()
  
            fetch(`/reservations/${reservation.id}`, {
              method: "PATCH",
            headers: {
                "Content-Type": "application/json",
              },
            body: JSON.stringify({ name:updateName,date:updateDate, time:updateTime,num:updateNum,contact:updateContact,occasion:updateOccasion}),
             })
               .then((r) => r.json())
              .then((updatedReservation) => {
                 onUpdateReservation(updatedReservation);
              });
       }
    return(
        <>
       <h2>Modify Reservation</h2>
       <form onSubmit={handleEditClick}  >
        <div >
        <label htmlFor="name"  >Name</label>
         <input type="text" name="name"  value={updateName}    onChange={(e) => setUpdatedName(e.target.value)} placeholder="name" />
       </div>
       <div >
        <label htmlFor="date"  >Date</label>
         <input type="date" name="date"   value={updateDate}  onChange={(e) => setUpdatedDate(e.target.value)}  placeholder="date" />
       </div>
       <div >
        <label htmlFor="time"  >Time</label>
         <input type="time" name="time"  value={updateTime}  onChange={(e) => setUpdatedTime(e.target.value)} placeholder="time" />
       </div>
       <div >
        <label htmlFor="num"  >Num</label>
         <input type="number" name="num"  value={updateNum}  onChange={(e) => setUpdatedNum(e.target.value)}  placeholder="num" />
       </div>
       <div >
        <label htmlFor="date"  >Contact</label>
         <input type="tel" name="contact" value={updateContact}  onChange={(e) => setUpdatedContact(e.target.value)}  placeholder="contact" />
       </div>
       <div >
        <label htmlFor="occasion"  >Occasion</label>
         <input type="text" name="occasion"  value={updateOccasion}   onChange={(e) => setUpdatedOccasion(e.target.value)} placeholder="occasion" />
       </div>
       <button type="submit">Update Reservation</button>
       </form>
        
        </>
    )
}
export default EditReservationForm;
```

CodePudding user response：

Your strong parameters do not scope the nested params correctly. I guess it should be like this instead:

def reservation_params
  params.require(:reservation)
        .permit(:name, :date, :time, :num, :contact, :occasion, :user_id, :restaurant_id)
end

Note that there is no :user_id nor :restaureant_id in the parameters currently.