Ruby on Rails 및 json 및 jquery를 사용하여 partial을 렌더링하는 방법

Question

Ruby on Rails 초보자 : 혼란스럽고 좌절 한 :) 나는 하루 동안이 시간을 보냈으며 아마 혼란스러워 할 것 같아요.

기본적으로보기에서 부분을 렌더링하려고합니다. 여기에 내가 구체적으로 무엇입니까 : 두 가지 기본 필드가있는 양식 : 범주 및 하위 범주. 카테고리에서 사용자가 선택한 항목에 따라 하위 카테고리가 변경됩니다. 애셋 파이프 라인이 활성화 된 상태에서 "JQuery"를 사용하고 있습니다. 이 부분은 작동합니다 :

    contact_infos.js.coffee 

    jQuery(document).ready(-> 
     $("select#contact_info_category_id").change(-> 
      id_value_string = $(@).val() 
      if id_value_string == "" 
      # if the id is empty remove all the sub_selection options from being selectable  and do not do any ajax 
      $("select#contact_info_subcategory_id option").remove() 
      row = "" + "" + "" 
      $(row).appendTo("select#contact_info_subcategory_id") 
      else 
      # Send the request and update sub category dropdown 
      tmp = '/subcategories/for_categoryid/' + id_value_string + '.json' 
      $.ajax(
      type: 'GET', 
      dataType: 'json', 
      url: tmp, 
      timeout: 2000, 
      error: (XMLHttpRequest, errorTextStatus, error) -> alert "Failed to submit : " + errorTextStatus + " ;" + error, 
       success: (data) -> 
       # Clear all options from sub category select 
       $("select#contact_info_subcategory_id option").remove() 
       # put in a empty default line 
       row = "" + "" + "" 
       $(row).appendTo("select#contact_info_subcategory_id") 
       # Fill sub category select 
       $.each(data, (i, j) -> 
        row = "" + j.name + "" 
        $(row).appendTo("select#contact_info_subcategory_id") 
       ) 
     ) 
     ) 
    ) 

올바르게 json 응답을 생성합니다.

폼이로드 될 때 Category 및 SubCategory 외에도 previous_value 및 current_value라는 두 개의 텍스트 필드가 있습니다. 그러나 하위 범주 == "전체" 이면 이전 값 및 현재 값을 숨기고 새 필드로 부분을 삽입해야합니다.

내가 PREVIOUS_VALUE 및 JQuery와 작동하고 (이것은 위의 코드에 삽입)과 같습니다과 CURRENT_VALUE 필드 숨어 아무 문제가없는 해요 :

$("select#contact_info_subcategory_id").change(-> 
    id_text_string = $("#contact_info_subcategory_id option:selected").text() 
    if id_text_string == "Full" 
     $('#contact_info_previous_value_id').hide() 
     $('#contact_info_current_value_id').hide() 
    else 
     $('#contact_info_previous_value_id').show() 
     $('#contact_info_current_value_id').show() 
) 

나는 내 양식에 "테스트"라는 사업부를 만들었을 나는 하위 범주 "전체"입니다 물론 경우 새 필드를 삽입 할 경우, contact_infos.js.coffee에이 라인을 삽입 작동하지 않습니다 : I 페이지에서 얻을 수있는 모든 같은

$('#test').html('<%= escape_javascript render("contact_infos/_full_name_info") %>') 

문자열입니다 "< % = 이스케이프 _ 자바 스크립트 렌더링 ("contact_infos/_full_name_ 내가 해봤

정보 ">) %"다음하지만 작업에 어떤을 얻을 수 없습니다

<% self.formats = ["html"] %> 
     test = { 
     "html":"<%= raw escape_javascript(render :partial =>  'contact_infos/full_name_info', 
        :content_type => 'text/html')} 
       %>" 
     } 

:
1. 다음 코드를 사용하여 new.json.erb 파일을 생성 이 json 파일이 실행되지 않았습니다. 내 컨트롤러에는 다음 줄이 있습니다.

format.json { render json: @contact_info } 

이렇게하는 것이 가장 좋은 방법입니까? 그렇다면 다음에 무엇을 시도 할 수 있습니까? application.html.erb 레이아웃 파일 (나는 그것이 fullnamefield라고도 함)뿐만 아니라 자바 스크립트 변수를 만드는 방법에 대해 - (다른 컴퓨터에 있던 나는 지금 그것을 찾을 수 없습니다)

2. 어제 포스팅을 보았다 js 변수를 new.html.erb 뷰에 추가했다. 나는 또한 contacts_infos.js.coffee에이 줄을 추가 :

('#test').html(fullnamefield) 

하고 일했다! 그런 다음 사이트의 다른 영역으로 갔을 때 오류가 발생했습니다.
3. 임시 해결책으로 jquery가 js로 생성 한 json을 js로 변경 한 다음 new.js.erb를 트리거하려고 시도하는 방법에 대해 생각했습니다. 나는 아약스 전화를 변환하는 데 어려움을 겪었다. 나는 "json"과 "text"dataTypes를 만들 수 있었지만 스크립트는 만들 수 없었다.

그래서 ... 어떤 아이디어/도움이 필요하십니까? 정말 검색을 해봤지만 모든 필드와 숨기기 생성/JQuery에서 필요에 따라 표시하는 것을 고려하고 있습니다. 구현하기가 너무 간단하지만 잘못되었습니다.

업데이트 : 시도 4 (또는 40?) :

당신이 쓴 것은 저에게 생각이 들었습니다 ... 나는 가까이 있지만 아직 거기에 없다고 생각합니다.

def get_full_fields 
    @full_name = FullName.new 
    respond_to do |format| 
     format.js 
    end 
    end 

: 내가 추가 한 contact_infos_controller.rb에 그런

<div class="field"> 
     <%= f.label :category_id %> 
     <br/> 
     <%= collection_select(:contact_info, :category_id, Category.all, :id, :name, options ={:prompt => "--Select a Category--"}) %> 
    </div> 
    <div class="field"> 
     <%= f.label :subcategory_id %> 
     <br/> 
     <%= collection_select(:contact_info, :subcategory_id, Subcategory.find_all_by_category_id(@contact_info.category_id), :id, :name, options ={:prompt => "--Select a SubCategory"}, "data-remote" => true, "data-url" => "/contact_infos/get_full_fields", "data-type" => :json) %> 
    </div> 

: 내 _form.html.erb에서

, 나는 하위 카테고리 필드에 데이터 원격 데이터 URL 및 데이터 유형을 추가 내 routes.rb에서

나는 ... 모음을 추가하여 contact_infos을 수정

resources :contact_infos do 
     collection do 
      get 'get_full_fields' 
     end 
     end 

그 나는 내가이 "전체"나는 그것이 제대로 실행 것을 알 수 있습니다 위해 디버거 변경 하위 범주 브라우저에서이 테스트 지금

var full_fields_form = $('<%= j(render(:partial => "contact_infos/full_name_info"))%>'); 
$('#test').html(full_fields_form); 

(내 생각) :

나는 contact_infos는 \ get_full_fields.js.erb 생성 이 다시 받고 있어요 :

요청 URL : HTTP : // localhost를 : 3000/contact_infos/get_full_fields contact_info % 5Bsubcategory_id % 5D = 3 신청 방법 : 200 OK

은 "유형 : 상태 코드를 GET "텍스트/자바 스크립트로 표시됩니다. 응답 탭은 자바 스크립트 코드를 표시하고 있지만 아무 것도 일어나지 않습니다/트리거링합니다. 단지 자리를 차지할 때도

alert('hello'); 

은 js 파일에 아무 것도 발생하지 않습니다.

어떤 아이디어 왜?

Answer 1

하위 카테고리 데이터를 가져 오는 것과 같은 방식으로 사용해보십시오. 부분 (및 해당 컨트롤러 액션)을 포함하는 뷰를 만들고 해당 내용을 표시하려면 ajax를 통해 호출합니다.