0
체크 된 항목을 레일즈 컨트롤러에 게시하려하지만 제대로 작동하지 않는 것 같습니다.Rails 5.1 컨트롤러에 폼 요소를 게시하기
<%= form_for(listing, html: { id: listing.id, class: 'listing_form' }) do |f| %>
...
<div v-for="(item, idx) in items">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" v-model="checkedItems[idx]" :value="item.id">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">{{ item.text }}</span>
</label>
</div>
...
<div class="actions">
<%= f.submit class: 'btn btn-success', 'v-on:click.prevent': 'submitListing' %>
</div>
<% end %>
내 뷰 코드는 다음과 같습니다 : 내 양식에
내가 가진
if(document.getElementById('listing-multistep') != null) {
Vue.http.headers.common['X-CSRF-Token'] = document.querySelector('input[name="authenticity_token"]').getAttribute('value');
var listingForm = document.getElementsByClassName('listing_form')[0];
var id = listingForm.dataset.id;
const listingForm = new Vue({
el: '#listing-multistep',
data: {
id: id,
name: '',
city: '',
state: '',
address: '',
items: [
{id: 0, text: "Item1"},
{id: 1, text: "Item2"},
{id: 2, text: "Item3"}
],
checkedItems: []
},
methods: {
submitListing: function() {
var itemNames = []
var checkedIndices = []
// Probably a better way to do this...
// Get the indices of all checkedItems that are true
this.checkedItems.forEach((elt, idx) => {
if(elt === true){ checkedIndices.push(idx) }
});
// Get the value of all the above indices
this.items.map((item) => {
if(checkedIndices.includes(item.id)){
itemNames.push(item.text);
}
});
var listingObj = {
id: this.id,
name: this.name,
city: this.city,
state: this.state,
address: this.address,
items: itemNames // <--- this is an array of items which isn't filtering through to Rails in the POST request
}
if(this.id == null) {
console.log(listingObj)
// POST the listingObj if it's a new listing
this.$http.post('/listings', {listing: listingObj}).then(
response => {
window.location = `/listings/${response.body.id}`
}, response => {
console.log(response)
})
} else {
// PUT the listingObj if it's an existing listing
this.$http.put(`/listings/${this.id}`, {listing: listingObj}).then(
response => {
window.location = `/listings/${response.body.id}`
}, response => {
console.log(response)
})
}
}
}
대부분의 데이터를 통해 전송되고 있으며 목록이 생성되는 동안 문제 items
어레이가 Rails 컨트롤러에 연결되지 않는다는 것입니다.
내 데이터베이스 (그래서 배열 필드가 가능해야한다) schema.rb
에 다음과 같이 PostgreSQL을 데이터베이스에 제출 한 항목은 정의입니다 : 나는에 강한 PARAMS를 통과 할 수 있도록하고
t.text "items", default: [], array: true
내 컨트롤러 :
class ListingsController < ApplicationController
...
private
def listing_params
params.require(:listing).permit(
:name,
:city,
:state,
:address,
:items)
end
end
하지만 listingOb의 items
필드가 레일에 걸쳐 실시되지 않는 이유를 알아낼 수 없습니다. 왜 이런 생각 일지 모르겠다.
미리 감사드립니다.