레일에서 클릭 및 모달에서 컨트롤러 작업을 호출하는 방법

Question

링크에서 컨트롤러를 호출하고 모든 프로세스가 완료된 후 데이터를 반환하는 기능을 관리하는 방법을 파악하는 중, 동시에 해당 데이터가 반환 된 모달 여기 내 논리는 내가 알아 낸 것과 누군가가 도울 수 있기를 바란다.

나는 다음을 시도해 보았다.

#HTML 
<%= link_to "#WidgetGenModal", :data => {:toggle => "modal"}, :action => 'gen_key', :class => 'gen-widget pull-right' do %><i class="fa fa-slideshare fa-1x"></i><% end %> 

#CONTROLLER (Widget controller) 
protected 

def generate_token 
    user = current_user 
    self.token = loop do 
    random_token = SecureRandom.urlsafe_base64(nil, false) 
    break random_token unless user.widget.exists?(token: random_token) 
    end 
end 

#MODAL (Bootstrap) 
<div class="modal fade" id="WidgetGenModal" tabindex="-1" role="dialog" aria-labelledby="widgetGenModal" aria-hidden="true"> 
      <div class="modal-dialog"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
       <h3 class="modal-title" id="widgetGenModal"><div class="btn btn-danger btn-xs">NEW</div> Share Your Category</h3> 
       <p>We've made it easier for you to share everything you store/save within your categories. Simply copy the specially generated code, paste it some where on your website or share the link with someone to let them see what you've saved.</p> 
       </div> 
       <div class="modal-body"> 

       </div> 
       <div class="modal-footer"> 
       <div id="test"></div> 
       <%= f.hidden_field :color, value: '' %><div id="output"></div> 
       <div class="clearfix visible-xs"></div> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
       </div> 
      </div><!-- /.modal-content --> 
      </div><!-- /.modal-dialog --> 
     </div> 
     <!-- /.modal --> 

나는 내가 여기 일을 노력하고있어 그 나의 모달로 token 이동 힘든 시간을 보내고 것 같아. 제안?

Answer 1

빈 모달을 렌더링하고 본문에 ID를 부여하는 한 가지 방법이 있습니다. 액션에 아약스 요청을 보낸 후 모달의 몸에 새로운 데이터를 주입의 .js 파일을 렌더링하고 사용

$("#Modal_ID").modal("toggle") 

---

예 :보기 ::

<%= link_to "NAME OF LINK", PATH_TO_YOUR_ACTION, :"data-toggle"=>"modal", :"data-target"=>"#WidgetGenModal", class: "company-name-link", remote: true%> 

<%= render "YOUR_EMPTY_MODAL_PARTIAL"%> 

에서 일부 비어있는 모달에

<div class="modal fade" id="WidgetGenModal" tabindex="-1" role="dialog" aria-labelledby="widgetGenModal" aria-hidden="true"> 
     <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      <h3 class="modal-title" id="widgetGenModal"><div class="btn btn-danger btn-xs">NEW</div> Share Your Category</h3> 
      <p>We've made it easier for you to share everything you store/save within your categories. Simply copy the specially generated code, paste it some where on your website or share the link with someone to let them see what you've saved.</p> 
      </div> 
      <div class="modal-body" id="WidgetGenModalBody"> 

      </div> 
      <div class="modal-footer"> 
      <div id="test"></div> 
      <%= f.hidden_field :color, value: '' %><div id="output"></div> 
      <div class="clearfix visible-xs"></div> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      </div> 
     </div><!-- /.modal-content --> 
     </div><!-- /.modal-dialog --> 
    </div> 
    <!-- /.modal --> 

는 f.hidden_field에 대한 논리를 확인하시기 바랍니다이 장비 아니다 ht. 액션 ::

def your_action 
    // whatever 
    format.js 
end 

your_action.js 파일 뷰에서

$("WidgetGenModalBody").html('<%= YOUR DATA RETURNED OR PARTIAL CONTAING THE DATA %>') 
$("WidgetGenModal").modal("toggle")