2017-09-20 1 views
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 필드가 레일에 걸쳐 실시되지 않는 이유를 알아낼 수 없습니다. 왜 이런 생각 일지 모르겠다.

미리 감사드립니다.

답변

1

그냥 알아 냈습니다. 배열 필드를 허용하는 레일스의 강력한 매개 변수는 다음과 같습니다.

def listing_params 
    params.require(:listing).permit(
    :name, 
    :city, 
    :state, 
    :address, 
    :items => [] 
) 
end 

이제 작동합니다!

관련 문제