복붙노트

[RUBY-ON-RAILS] .js.erb VS의의 .js

RUBY-ON-RAILS

.js.erb VS의의 .js

당신의 application.js 파일에 던지는 단지 .js.erb 파일로 레일 앱을 자바 스크립트 두는 대신에 장점은 무엇입니까? 나는 그래서 나는 create.js.erb 파일에 코드를 삽입 또는 사용하여 내 application.js에 넣어해야 기업을위한 버튼을 만들 수 있습니다 :

$("#business_submit").click(function() {}

옆으로 내 생성 버튼을 가지고있다 그 모든

    $('.error').hide();
$("#business_submit").click(function() {
    // validate and process form here

    $('.error').hide();
    var name = $("input#business_name").val();
    if (name == ""  || name == "Required Field") {
        $('#namelabel').show()
        $("#business_name").focus();
        return false;
    }
    var address = $("#business_address").val();
    if (address == ""  || address == "Required Field") {
        $('#addresslabel').show();
        $("#business_address").focus();
        return false;
    }
    var city = $("#business_city").val();
    if (city == "" || city == "Required Field") {
        $('#citylabel').show();
        $('#business_city').focus();
        return false;
    }
    var state = $("#business_state").val();
    if (state == ""  || state == "Required Field") {
        $('#statelabel').show();
        $("#business_state").focus();
        return false;
    }
    var zip = $("#business_zip").val();
    if (zip == ""  || zip == "Required Field") {
        $('#ziplabel').show();
        $("#business_zip").focus();
        return false;
    }
    var phone = $("#business_phone").val();
    if (phone == ""  || phone == "Required Field") {
        $('#phonelabel').show();
        $("#business_phone").focus();
        return false;
    }

     var category = $("#business_business_category_id").val();
    if (category == " - Choose one - ") {
        $('#categorylabel').show();
        $("#business_business_category_id").focus();
        return false;
    }
    $("#new_business")[0].reset();
    $("#new_business").toggle();
   return false;
});

이건 내의 .js 파일에서 잘 작동하지만, 내가 만들 클릭하면 실제로 그들이 데이터베이스에 양식에 입력 한 정보를 전송하지 않습니다. 그래서 .js.erb 파일에 코드를 붙여 복사를 시도했다. 이제 양식은 내가 만들 클릭하면 데이터베이스에 제출되지만 반 자바 스크립트가 작동하지 않습니다. $ ( '오류.') 숨기기 ().; 내 오류를 숨기고하지 않고 그들은 모두에 관계없이 나타나고있다. $ ( "#의 new_business") [0] .reset (); 내 양식을 다시 설정하라는, 그리고 내가 만들 클릭하면 더 유효성 검사가 없습니다되지 않습니다. 나도 제출하거나 하나 그을 제출하지만 실제로는 작동하지 않는 완전한 기능의 양식을 가지고 그래서. 어떤 사람은 내가 작업을 진행하려고 하는가?

나는 $ 아약스와 코드를 많이 볼 수 있지만 내 인생 내가 그것을 알아낼 수 없습니다. 내가 조금만 노력과 나는 완전히 다른 문제가 레일에서 일부 위조 보호 오류를 받기 시작했다.

해결법

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

    1..js.erb 파일은 자바 스크립트가되면 작업 완료를 실행하고자 할 때와 같은, 생성, 컨트롤러 액션을위한 것입니다. 당신이 아약스를 통해 양식을 제출하고자하는 모든 것이 완료되면 경고를 표시 할 때 예를 들어, 당신은을 둘 것

    .js.erb 파일은 자바 스크립트가되면 작업 완료를 실행하고자 할 때와 같은, 생성, 컨트롤러 액션을위한 것입니다. 당신이 아약스를 통해 양식을 제출하고자하는 모든 것이 완료되면 경고를 표시 할 때 예를 들어, 당신은을 둘 것

    $('#business_submit').click(...)
    

    당신의 application.js 또는 * .html.erb하고 create.js.erb에서 다음과 같이 수 :

    alert('New object id: ' + <%= new_object.id %>);
    

    이 방법은 브라우저에 반환지고 자바 스크립트는 먼저 당신이 .html.erb 템플릿 수처럼 등 사용자 정의 문자열 / 변수 / 삽입 할 수 있도록 ERB에 의해 렌더링 할 수 있습니다.

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

    2.나는 몇 센트와 대답에 기여할 수 있다면 ...

    나는 몇 센트와 대답에 기여할 수 있다면 ...

    귀하의 질문에 대한 대답은 정말 간단하다 :

    같은 당신이 어떤 루비 코드 내부를 배치하면 당신은 일에 *의 .js 파일을 얻을하지 않습니다 :

    $(function () {
      new Highcharts.Chart({
        chart: { renderTo: 'orders_chart' },
        title: { text: <%= gon.my_title_of_the_day.to_json %> },
      });
    })
    

    부분 <% = gon.my_title_of_the_day.to_json %> 자바 스크립트는 루비에 대해 아무것도 알고 있기 때문에 그냥 오류가 발생합니다.

    당신의 *의 .js 파일 작품 위해서는 정적 때마다 그것을 하루 변경을 변경해야합니다 :

    $(function () {
      new Highcharts.Chart({
        chart: { renderTo: 'orders_chart' },
        title: { text: 'Monday' },
      });
    })
    

    N.B. : 당신이 *의 .js.erb를 사용하는 경우, 당신은하지만 JS로 컨트롤러에서 데이터를 전달하는 이외에 "곤"보석이 필요합니다.

    이제 기본적인 질문에 대해 나는 어떤 자바 스크립트 전문가는 아니지만 때문에 내가 대답 할 수없는 "이유를 '작동하지 않는 내 자바 스크립트 코드는"이것은 ... 또 다른 이야기이다 ;-)

  3. ==============================

    3.내보기 당, js.erb 파일을 가지고있는 이유는 something_url 경로와 같은 레일 도우미에 액세스 할 수 있습니다. 나는 그것을 거의 필요가 있으므로 해당 URL이 이미 그 같은
    태그 또는 뭔가에 포함 된 것으로, 대부분의 시간을 발견했습니다. .erb와 처리 모든도 적극적으로 자바 스크립트를 캐싱을 방지 할 수 있습니다.

    내보기 당, js.erb 파일을 가지고있는 이유는 something_url 경로와 같은 레일 도우미에 액세스 할 수 있습니다. 나는 그것을 거의 필요가 있으므로 해당 URL이 이미 그 같은 태그 또는 뭔가에 포함 된 것으로, 대부분의 시간을 발견했습니다. .erb와 처리 모든도 적극적으로 자바 스크립트를 캐싱을 방지 할 수 있습니다.

    그 이유로, 나는 가장 적절한 결정은 가능한 가장 눈에 거슬리지 장소에서 자바 스크립트를 넣어 생각 : application.js (또는 다른 정적 스크립트). 특히 의도 된대로 정말 jQuery를 함께.

    그런데, javascript_auto_include 렌더링 된 뷰에 따라 자바 스크립트를 조직을위한 좋은, 깔끔한 플러그인입니다. 오히려 application.js 모든 것을 보관 한 것보다, 당신은이를 고려할 수 있습니다.

    이 두 가지 (.erb) 중 하나는 템플릿에서 자바 스크립트를 생성 정말입니다. 이것은 당신이 HTML의 태그로 포함 할 것 물건의 일종이다. 다른 (.rjs)는 AJAX 응답 페이지의 콘텐츠를 제어에 대한, 그리고 이러한 AJAXy 호출이 될 때까지 실행되지 않습니다.

  4. from https://stackoverflow.com/questions/1127697/js-erb-vs-js by cc-by-sa and MIT license