我是RoR的新手,我在Rails 6中遇到了這個問題,我試圖用ajax將一個類別添加到一個類別串列中,這樣當我提交我的表單時,頁面不應該重繪 。但是它一直在重繪 。
我遵循本教程,并將該串列拆分為 _category.html.erb 部分,并創建了一個 create.js.erb 檔案,以追加到該串列中,但我沒有得到相同的結果。
這里是我的index.html.erb:
<body>
<main>
<section class="hero is-link is-fullheight pt-3"/span>>
<div class="hero-body">/span>
<div class="container is-align-self-flex-start" >
<h1 class="title has-text-centered"/span>> categories</h1>
<!--類別串列的容器-->/span>
< div class="container" id='category" >
<%= render @category %>
</div>
<h2 class="is-size-4"/span>> 添加一個類別</h2>
<%=渲染'表單',類別。@category %>
</div>
</div>
</section>/span>
</main>/span>
</body>
這是我的分類串列部分:
<!--回圈瀏覽類別并添加洗掉btn-->
<% @categories.each do |category| %>
<div class="columns is-mobile card mb-4">
<div class="column is-align-self-center"/span>>
<p class="is-size-5"><%= category. name %></p>
</div>/span>
<div class="column is-narrow">
<button class="button is-danger">/span><%= link_to 'delete', category, method: :delete, data: { confirm: 'Er du sikker? } %></button>
</div>/span>
</div>/span>
<% end %> <!--回圈結束-->
這是我的表單部分,用于輸入和提交按鈕:
<%= form_with(model: category) do |form| %>
<% if category.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(category.errors.count, "error") %> 禁止這個類別被保存:</h2>。
<ul>
<% category.errors.each do |error| %>
<li><%= error.full_message %></li>
<% end %>
</ul>
</div>
<% end %>
<div class="field has-addons" >
<%= form.text_field :name , (:class => "input", })%>
<%= form.submit "add", ({:class => "button is-primary", })%>
</div>
<% end %>
這是我的類別控制器中的創建方法,我懷疑它是罪魁禍首,因為當我洗掉format.html和format.json時,我得到了 "ActionController::UnknownFormat in CategoriesController#create"/p>
def create
@categories = Category.all
@category = Category.new(category_params)
respond_to do |format|
if @category.save
format.js
format.html { redirect_to action: "index", notice: "類別已成功創建。" }
format.json { render :show, status: :created, location: @category }
else
format.html { render :"index" , status: :unprocessable_entity }
format.json { render json: @category.errors, status: :unprocessable_entity }
結束。
end
end end
這是一個js檔案,用于將新的類別追加到串列中:
var body = document.getElementByID("category"/span>)。
body.innerHTML = "<%= j render @categories %>" body.innerHTML。
我已經嘗試了
- 這個教程也使用了jquery,但在提交時也會重新加載。
- 我已經檢查了三遍,我沒有在任何地方設定 "local:true"。
- 在一些地方嘗試用@category代替@categories,但沒有成功 。
- 我用腳手架生成了這個專案 。
我是否遺漏了什么?
如果有任何指導,我們將不勝感激。
uj5u.com熱心網友回復:
你沒有為你的表單使用data-remote屬性。這個屬性意味著該表單將通過Ajax提交結果。
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/322753.html
標籤:
