Как обновить Item одним щелчком мыши?

Question

Я хочу обновить Предмет, который хранится в моей БД одним щелчком мыши. Например, у меня есть модель под названием Car. Он имеет атрибут «активный», который является логическим, поэтому может быть 0 или 1 в БД. Я хочу, чтобы пользователи имели возможность изменить этот атрибут одним щелчком мыши, например, со страницы индекса своих автомобилей. Я знаю, что это можно было бы сделать, если бы я сделал эту кнопку как всю форму. Но я думаю, что это не лучшее решение и не правильное. Могу ли я сделать это каким-либо другим способом, может быть, создать специальный link_to или что-то вроде этого? Как я понимаю, следует отправить запрос CarsController в метод обновления, но как это сделать без формы?

Answer 1

Вам просто нужно использовать link_to с remote: true. Например, на ваш взгляд:

link_to "Activate", car_path(@car.id), method: :post, remote: true

А в вашем контроллере метод:

def active
  @car = Car.find(params[:id])
  @car.update(active: true)
  render json: :ok
end

Полное руководство присутствует здесь .

Answer 2

Если вы используете jquery, вы можете использовать jjery ajax метод с dataType как JSON. И вы также можете использовать тот же метод обновления restful, т.е. без создания какого-либо нового метода.

Просмотр - <%= button_tag 'Activate', car_id: "22" , id: "activate_car" %>

Контроллер -

  def update
    @car = Car.find(params[:id])
    respond_to do |format|
      if @car.update(car_params)
        format.html { redirect_to @car, notice: 'Car was successfully updated.' }
        format.json { render :json: 'Successfully update' }
      else
        format.html { render :edit }
        format.json { render json: @car.errors }
      end
    end
  end

  private

  def car_params
      params.require(:car).permit(:active)
  end

JS -

$(document).on("click", '#activate_car', function () {
  car_id = $(this).attr('car_id')
  $.ajax({
    url: "/cars/" + car_id,
    type: "PUT",
    data: {
      active: true
    },
    dataType: "json",
    success: function (response) {
      alert(response)
    }
  });
});