1

I have a controller and inside the controller

def publish
  post = Post.find(params[:post_id])
  post.update(published: true, published_at: Time.now)
  redirect_to edit_post_path(post)
end

def unpublish
  post = Post.find(params[:post_id])
  post.update(published: false, published_at: nil)
  redirect_to edit_post_path(post)
end

And my stimulus controller "publishers_controller"

import { Controller } from "@hotwired/stimulus"
import log from "stimulus_reflex/javascript/log";

// Connects to data-controller="publishers"
export default class extends Controller {
  connect() {
    console.log("Connected")
  }

  publish(event){
    event.preventDefault();
    const postId = event.currentTarget.getAttribute("data-post-id");
    const url = `/posts/${postId}/publish`; 

    fetch(url, {
      method: "PUT",
      headers: {
        "Accept": "application/json",
        "Content-Type": "application/json",
        "X-CSRF-Token": document.querySelector('meta[name="csrf-token"]').getAttribute('content')
      },
    })
      
  }

  unpublish(event){
    event.preventDefault();
    const postId = event.currentTarget.getAttribute('data-post-id');
    const url = `/posts/${postId}/unpublish`;
    fetch(url, {
      method: "PUT",
      headers: {
        "Accept": "application/json",
        "Content-Type": "application/json",
        "X-CSRF-Token": document.querySelector('meta[name="csrf-token"]').getAttribute('content')
      },
    })
    
    }
}

this is my route.rb

scope module: "authors" do
    resources :posts do
      put "publish", to: "posts#publish"
      put "unpublish", to: "posts#unpublish"
      resources :elements do
      end
    end
  end

And where i use it edit.html.erb

<div class="card-footer">
        <% if @post.published? %>
          <a
            href="#"
            class="btn btn-danger d-block my-4"
            data-action="click->publishers#unpublish"
            data-post-id="<%= @post.id %>"
          >Unpublish</a>
        <% else %>
          <a
            href="#"
            class="btn btn-success d-block my-4"
            data-action="click->publishers#publish"
            data-post-id="<%= @post.id %>"
          >Publish</a>
        <% end %>
      </div>

Everything works good but when i try to send a request from UI publish or unpublish, it doesn't load the UI for me. Only when i refresh the page it shows publish state changed . I want that without me manually refresh the page, whenever state for publish will change it should reflect it. And i though by using redirect_to would be enough.

2
  • 2
    fetch doesn't update your browser, you have to handle the response yourself developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch . also note that you're not sending or responding with any json so "application/json" seems unnecessary, you'd be better off without this stimulus controller and just make two buttons with button_to. Commented Sep 27, 2023 at 2:59
  • Also you should never just assume that updating a record will always be successful. Commented Sep 28, 2023 at 13:55

0

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.