javascript에 추가 된 html 양식 필드를 레일 컨트롤러에 전달할 수 없습니다.

Question

루비 온 레일을 사용하여 양식을 만들고 있지만, 양식에 내가 무슨 일이 일어나고 있는지 이해하지 못하는 섹션이 있습니다.

양식에 antecedentes라는 필드가 있으며 영어로 배경으로 번역됩니다. 나는 모든 배경이 다른 선택 태그와 addBackground라는 자바 스크립트 함수를 호출하는 버튼이 있습니다. addBackground 함수는 폼 내에있는 테이블 div에 몇 가지 html 필드를 추가합니다.

제출 단추를 누를 때까지 Everithing이 유효합니다. 문제는 추가 된 배경 필드가 레일스 매개 변수를 통해 응용 프로그램 컨트롤러의 작업 만들기에 전달되지 않는 것입니다.

가 여기 내 자바 스크립트 코드의

<div class="col-sm-4 text-center">  
    <h4><%= t('titles.backgrounds') %></h4> 
    <div class="input-group col-sm-12"> 
    <%= text_field_tag 'text_bgd_bgd', 7, placeholder: t('st_sheet.st_dots'), class: "form-control" %> 
    <span class="input-group-addon" style="width:0px; padding-left:0px; padding-right:0px; border:none;"></span> 
    <%= select_tag 'select_bgd', options_for_select(@backgrounds), include_blank: false, class: "form-control" %> 
    <span class="input-group-btn"> 
     <button id="add_user" type="button" class="btn btn-default btn-md" , onclick="addBackground(select_bgd)" ><span class="fa fa-plus" aria-hidden="true"></span></button> 
    </span> 
    </div> 
    <br> 
    <div class="table-responsive"> 
    <table id="table_backgrounds" class="table table-hover table-striped "> 
     <thead> 
     <tr> 
      <th><%= label_tag t('Backgrounds.background') %></th> 
      <th><%= label_tag t('Backgrounds.value') %></th> 
      <th><%= label_tag t('Backgrounds.operation') %></th> 
     </tr> 
     </thead> 
     <tbody> 
     </tbody> 
    </table> 
    </div> 

:

여기 내 HTML 코드의

function addBackground(select) { 
    var backgroud_id = select.options[select.selectedIndex].value; 
    var background_name = select.options[select.selectedIndex].text; 

    if (!document.getElementById('row_' + background_name)) { 
    $('#table_backgrounds > tbody:last').append(
     '<tr id="row_' + background_name + '">' + 
     '<td>' + background_name + '<input type="hidden" id="bgd_id_' + backgroud_id + '" value="' + backgroud_id + '" /></td>' + 
     '<td><input type="number" id="bgd_' + background_name + '" value="0" min="0" max="5" class="form-control" onclick="refillManager(bgd_' + background_name + ')" /></td>' + 
     '<td><button id="bgd_remove_' + backgroud_id + '" type="button" class="btn btn-default btn-md" onclick="removeBackground(bgd_' + background_name + ', \'' + background_name + '\')"><span class="fa fa-minus" aria-hidden="true"></span></button></td>' + 
     '</tr>' 
    ); 
    } else { 
    alert("O antecedente "+background_name+" já foi adicionado."); 
    } 
} 

Answer 1

단지 document.getElementById()

자바 스크립트를 통해 가져 오기, 데이터를 전달해야하지 마십시오

을 (210)

HTML :

<%= select_tag 'select_bgd', options_for_select(@backgrounds), 
       include_blank: false, class: "form-control", id: "select_bgd" %> 

이 비어 나는`submit` 버튼에 대한`form`를 참조 DNT

onclick="addBackground()"