Rails ボタンを使用して、表示される配列要素を段階的に増やすにはどうすればよいですか?

概要

@necklines と @スカートという 2 つの配列があり、それぞれすべてのネックラインモデルとスカートモデルで構成されています。

一度に 1 つのネックラインと 1 つのスカートを表示しようとしています。現在表示されている要素を段階的に増加または減少させるための 2 つのボタンがあります。

ページレイアウトは次のようになります。

@necklines [@ni] と @スカート [@si] を呼び出し、ボタンを使用して @ni と @si の値を増減することでこれを実行しようとしています。

ただし、どのボタンをクリックしても要素は変わりません。

これが私のMainController.rbです

    def home
        @necklines = Neckline.all
        @skirts = Skirt.all
        
        if @ni.nil?
            @ni = 0
        end

        if @si.nil?
            @si = 0
        end

    end

    def increase_neck
        if @ni >= @necklines.count - 1
            @ni = 0
        else
            @ni += 1
        end
        redirect_to root_path    
    end

    def decrease_neck
        if @ni <= 0
            @ni = @necklines.count - 1
        else
            @ni -= 1
        end
        redirect_to root_path
    end

    def increase_skirt
        if @si >= @skirts.count - 1
            @si = 0
        else
            @si += 1
        end 
        redirect_to root_path   
    end

    def decrease_skirt
        if @si <= 0
            @si = @skirts.count - 1
        else
            @si -= 1
        end   
        redirect_to root_path 
    end

ここが私のhome.html.erbです

<h1> Main#home </h1>


<div>
  <div class='neckline'>
    <h3> <%= @necklines[@ni].style_name %> </h3>
    <div class='child inline-block-child'> <%= button_to "<", "/home/decrease_neck", method: :post %> </div>
    <div class='child inline-block-child'> <%= image_tag @necklines[@ni].image %> </div>
    <div class='child inline-block-child'> <%= button_to ">", "/home/increase_neck", method: :post %> </div>
  </div>
  <div class='skirt'>
    <div class='child inline-block-child'> <%= button_to "<", "/home/decrease_skirt", method: :post %> </div>
    <div class='child inline-block-child'> <%= image_tag @skirts[@si].image %> </div>
    <div class='child inline-block-child'> <%= button_to ">", "/home/increase_skirt", method: :post %> </div>
    <h3> <%= @skirts[@si].style_name %> </h3>
  </div>
</div>

これが私のルートです。rb

Rails.application.routes.draw do
  get '/necklines', to: 'neckline#index'
  get "/necklines/:id", to: "neckline#show"
  get '/skirts', to: 'skirt#index'
  get '/skirts/:id', to: 'skirt#show'

  # Defines the root path route ("/")
  root "main#home"
end

エラーは、ボタンをクリックするたびに @ni と @si が 0 に戻されるのではないかと思いますが、次に進む方法がわかりません。

初めてのアプリでつまずいてしまい、コードが汚くて申し訳ありません。

解決策

インスタンス変数は各リクエストを処理しません。インデックスに自動インクリメントされるフィールドを追加します (現時点では ID を使用するだけかもしれません)。これをルートパラメーターとして渡します。

したがって、インデックスには次のようなものになります。

def index 
  @neckline = params[:neckline_idx] ? Neckline.find_by(id: params[:neckline_idx]) : Neckline.first
  @skirt = params[:skirt_idx] ? Skirt.find_by(id: params[:skirt_idx]) : Skirt.first
end

インクリメント/デクリメントへのリンクは次のようになります。

# neckline increment/decrement links
link_to "<", root_path(neckline_idx: @neckline.id - 1, skirt_idx: params[:skirt_idx]) 
link_to ">", root_path(neckline_idx: @neckline.id + 1, skirt_idx: params[:skirt_idx])

# skirt increment/decrement links
link_to "<", root_path(skirt_idx: @skirt.id - 1, neckline_idx: params[:neckline_idx]) 
link_to ">", root_path(skirt_idx: @skirt.id + 1, neckline_idx: params[:neckline_idx])

最終的には、リンクを進化させて #next_id や #previous_id のようなメソッドを呼び出すことが必要になる場合があります。

link_to "<", root_path(skirt_idx: @skirt.previous_id, neckline_idx: params[:neckline_idx]) 
link_to ">", root_path(skirt_idx: @skirt.next_id, neckline_idx: params[:neckline_idx])

レコードの破棄を許可する場合にインデックス内のギャップを処理できるようにするには、次のようにします。

def next_id
  self.where("id > ?", self.id).minimum(:id)
end