복붙노트

[RUBY-ON-RAILS] JS보기에서 어떻게 ERB 코드로 자바 스크립트 변수를 전달하는 방법?

RUBY-ON-RAILS

JS보기에서 어떻게 ERB 코드로 자바 스크립트 변수를 전달하는 방법?

내 레일 3 프로젝트에서이 자바 스크립트보기를 가지고 :

응용 프로그램 /보기 / 비용 / new_daily.js.erb

var i = parseInt($('#daily').attr('data-num')) + 1;
//$('#daily').append('agrego fila ' + i + ' <br />');

$('#daily').append('<%= escape_javascript(render(partial: 'new_expense', locals: { i: i })) %>');

$('#daily').attr('data-num', i);

나는 지역 주민을 통해 부분 루비 내 'I'자바 스크립트 변수를 전달하려면,이를 어떻게 달성 할 수 있습니까?

해결법

  1. ==============================

    1.내가 아는 바로 그것을 할 방법이없고, 이유는 HTML이 서버 측에서 실행되고, 너무 매우 간단하고 자바 스크립트는 해당 지역의 브라우저에서 실행되는 의미 클라이언트 측 언어입니다, 그게 전부는 당신도 이유를 시도하는 경우 둘 사이에 변수를 전달하기 위해 서버에 요청을해야합니다, 그러나이 문제는 AJAX 요청을 호출하여 달려있다,이 AJAX 요청은 그 새로 고치거나 그것에 페이지를 다시로드하지 않고 사용자에게 더 요구하지 않았다 있다는 환상을 제공하지 그러나 서버에 새 요청을 보내는 것과 같은 일을한다.

    내가 아는 바로 그것을 할 방법이없고, 이유는 HTML이 서버 측에서 실행되고, 너무 매우 간단하고 자바 스크립트는 해당 지역의 브라우저에서 실행되는 의미 클라이언트 측 언어입니다, 그게 전부는 당신도 이유를 시도하는 경우 둘 사이에 변수를 전달하기 위해 서버에 요청을해야합니다, 그러나이 문제는 AJAX 요청을 호출하여 달려있다,이 AJAX 요청은 그 새로 고치거나 그것에 페이지를 다시로드하지 않고 사용자에게 더 요구하지 않았다 있다는 환상을 제공하지 그러나 서버에 새 요청을 보내는 것과 같은 일을한다.

    남자가 여기에 비슷한 질문을

    당신은 MDN에 여기 AJAX에 대해 자세히 알아볼 수 있습니다 :

  2. ==============================

    2.네, 당신은 jQuery를 사용하여 값을 전달할 수 있습니다;

    네, 당신은 jQuery를 사용하여 값을 전달할 수 있습니다;

    <%=f.text_field :email ,:id=>"email_field" %>
    
    <script type="text/javascript">
       var my_email= "my@email.com"
       $(document).ready(function(){
            $("#email_field").val(my_email);
       });
    </script>
    
  3. ==============================

    3.간단한 대답은 당신이 할 수없는 것입니다. 파셜은 서버 측에서 확장하고, 자바 스크립트 변수는 클라이언트 측에서 나중에 설정됩니다. 당신은 내가 (변수 이름으로) 부분의 매개 변수를 만들 수 있고 거기에 그것을 사용합니다.

    간단한 대답은 당신이 할 수없는 것입니다. 파셜은 서버 측에서 확장하고, 자바 스크립트 변수는 클라이언트 측에서 나중에 설정됩니다. 당신은 내가 (변수 이름으로) 부분의 매개 변수를 만들 수 있고 거기에 그것을 사용합니다.

    render :partial => 'xx', :locals => { :variable => 'i' }
    

    그리고 부분에서

    alert(<%= variable %>);
    
  4. ==============================

    4.곤 보석을 확인하십시오. https://github.com/gazay/gon

    곤 보석을 확인하십시오. https://github.com/gazay/gon

    그것은 당신에게 그 window.gon를 통해 스크립트를 사용할 수에 당신이 변수를 전달할 수있는 간단한 객체를 제공합니다

    또한 여기 참조 http://railscasts.com/episodes/324-passing-data-to-javascript

  5. ==============================

    5.여기에 그것을 수행하는 방법에 대한 몇 가지 다른 옵션이다 :

    여기에 그것을 수행하는 방법에 대한 몇 가지 다른 옵션이다 :

    http://jing.io/t/pass-javascript-variables-to-rails-controller.html

  6. ==============================

    6.여기에 가장 좋은 다른 답변은이 서버가 아닌 클라이언트에 렌더링되기 때문에이 부분 ERB에 자바 스크립트 변수를 전달하여 할 수없는 권리 점이다.

    여기에 가장 좋은 다른 답변은이 서버가 아닌 클라이언트에 렌더링되기 때문에이 부분 ERB에 자바 스크립트 변수를 전달하여 할 수없는 권리 점이다.

    그러나이 찾고있는 사람은 아마에 관심이 있기 때문에 작업 주위 솔루션, 내가 여기 보지 않는, 내가 레일 UJS 및 Turbolinks 잘 작동이 예제를 게시 할 예정입니다.

    첫째, 당신은 HTML과 같은 부분을 반환하는 컨트롤러를 설정 :

    format.html { render partial: "new_expense" }
    

    다음으로, 응용 프로그램 /보기 / 비용 / new_daily.js.erb에서 자바 스크립트 AJAX 함수를 작성 :

    var i = parseInt($('#daily').attr('data-num')) + 1;
    
    $.ajax({
      url: '/daily',
      type: 'GET',
      dataType: 'html',
      contentType: "application/html",
      success: function(response) { 
    
          $('#daily').replaceWith(response)
    
          $('#daily').attr('data-num', i);
      }
    });
    

    이것은 당신이 당신의 렌더링 된 페이지의 일부를 대체하는 데 사용할 수있는 HTML 조각 같은 레일이 부분 얻을 것입니다. 당신은 거기에 몇 가지 계산을 수행하여 데이터 num 속성 값을 얻기 위해 jQuery를 사용하여보기에서 부분을 교체 한 다음 다시 속성 값을 설정할 수 있습니다.

    당신은 왜이 부분 레일 모두에게지고의 문제를 가서 페이지에 교체, 대신 그냥 데이터 속성을 받고 거기에 수학을하고, 그 설정을 요청할 수 있습니다? 답은이 최고입니다, 그리고 액션에 대한 비동기 응답을 처리하는 동안 UJS를 사용하여 부분 레일 렌더링 할 때 정말 중요하다 뭔가를하고 아마도 유일한 방법이다.

    당신이 create.js.erb 템플릿에 서버에서 비동기 응답을 처리하는 경우 요청이 완료된 후, 다음 변수 (@daily, 예를 들어) 수행 된 작업을 반영하지 않을 수 있습니다 (예를 들어, 거기 경우 ) Sidekiq 같은 배경 서버에서 처리하는 단계를 포함한다. 이 경우 당신은 js.erb 파일의 부분 당신의 레일에 전달하는 행동 반응 변수 - - 날짜를 필요는 없지만, 당신은 또한이 질문에 뾰족한 아웃으로, 당신의 부분에 자바 스크립트 데이터 응답을 전달할 수 없습니다 .

    지금까지 내가 아는 한,이 방식은 완전히 최신 비동기 응답에 대한 응답을받은 후 부분 (도시하지 않음)를 얻을 수있는 유일한 방법입니다. 이것은 당신이 최신 부분, 당신은 그것으로 당신의 자바 스크립트를 얻을 수 있으며, 거의 모든 사용 사례에서 작업을 유연 충분하다 얻는다.

  7. ==============================

    7.당신이 액세스 할 수 있습니다 그 후 1) 당신은 당신의 ERB 템플릿을 전역 변수와의 js 태그를 만들 수있는 JS 파일에서 변수

    당신이 액세스 할 수 있습니다 그 후 1) 당신은 당신의 ERB 템플릿을 전역 변수와의 js 태그를 만들 수있는 JS 파일에서 변수

    <%= javascript_tag do %>
       window.productsURL = '<%= j products_url %>';
    <% end %>
    

    2) 당신은 클라이언트 측 JS에 의해 ERB 템플릿의 데이터 속성에 대한 데이터 액세스를 전달할 수있는 방법 $ ( '# 제품'). 데이터 ( '제품')

    <%= content_tag "div", id: "products", data: {products: Product.limit(10)} do %>
       Loading products...
    <% end %>
    

    3) 당신은 당신의 js에 레일 변수를 사용하여, 곤 사용할 수 있습니다

    좋은 기사가있다, 특정 케이스를 위해 미세 솔루션을 읽어 http://railscasts.com/episodes/324-passing-data-to-javascript, 더 설명이 여기에 있습니다 http://railscasts.com/episodes/324-passing-data-to-javascript?view=asciicast

  8. ==============================

    8.하자의 메이크업은 우리가 서로를 이해 슈어. 서버 측에서 처리 될 것이다 ERB 템플릿 (new_daily.js.erb)이 루비 코드 (<% %> 내에서)으로 평가되고, 교체가 이루어진 후 생성 된 자바 스크립트가 브라우저에 전송한다. 클라이언트 측에서 브라우저는이 자바 스크립트 코드를 평가하고 i 변수에 값이 할당됩니다. 이제 때이 변수 부분적인 것에를 통과하고 싶은가?

    하자의 메이크업은 우리가 서로를 이해 슈어. 서버 측에서 처리 될 것이다 ERB 템플릿 (new_daily.js.erb)이 루비 코드 (<% %> 내에서)으로 평가되고, 교체가 이루어진 후 생성 된 자바 스크립트가 브라우저에 전송한다. 클라이언트 측에서 브라우저는이 자바 스크립트 코드를 평가하고 i 변수에 값이 할당됩니다. 이제 때이 변수 부분적인 것에를 통과하고 싶은가?

  9. from https://stackoverflow.com/questions/4959770/how-to-pass-a-javascript-variable-into-a-erb-code-in-a-js-view by cc-by-sa and MIT license