.js.erb VS .js

Question

将你的rails应用程序的javascript放入.js.erb文件而不是将其放入application.js文件中有什么好处？我有一个企业的创建按钮,所以我应该将代码放入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文件中.现在,当我单击"创建"时,表单将提交到数据库,但是一半的javascript无法正常工作.$('.error').hide(); 没有隐藏我的错误,他们都出现了.$( "#new_business")[0] .reset段(); 没有重置我的表单,单击创建时没有验证检查.所以我要么有一个功能齐全的表单,不提交,要么提交但不是真正的功能.我应该尝试哪一个工作？

我看到很多带有$ .ajax的代码,但是我无法理解我的生活.我尝试了一下,我开始在rails中获得一些伪造保护错误,这是另一个问题.

Answer 1

.js.erb当您希望在操作完成时执行javascript时,文件用于控制器操作,例如create.例如,当您想通过ajax提交表单并希望在完成所有操作后显示警告时,您可以将其设置为

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

在您的application.js或*.html.erb中,您的create.js.erb可能如下所示:

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

这样,返回到浏览器的javascript可以首先由Erb呈现,允许您像在.html.erb模板中一样插入自定义字符串/变量/等.

Answer 2

如果我可以用我的几分钱为答案做出贡献......

你的问题的答案非常简单:

• 以*.js.erb结尾的文件允许您的文件由ruby解释.(所以你将能够使用铁路助手)

• 以*.js结尾的文件是纯JavaScript.

如果你在里面放置任何ruby代码,你永远不会得到一个*.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 %>只会生成错误,因为javascript对ruby一无所知.

为了使您的*.js文件正常工作,您必须在每次更改时静态更改它:

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

注意:如果您使用*.js.erb,您还需要" Gon "gem来将数据从控制器传递给JS.

现在你的基本问题是"为什么我的javascript代码无法运行"我无法回答,因为我不是javascript专家,这是另一个故事...... ;-)

Answer 3

根据我的观点,拥有js.erb文件的原因是为了获得像something_url路由一样的rails助手.我发现,大多数时候,这些URL已经嵌入到<form>标签或类似的东西中,所以我几乎不需要它.使用.erb处理所有内容也会阻止您积极地缓存javascript.

出于这些原因,我认为最合适的决定是将javascript放在最不显眼的地方:application.js(或其他静态脚本).特别是对于jQuery,这真的是它的意图.

顺便说一下,这javascript_auto_include是一个漂亮,整洁的插件,用于根据渲染的视图组织您的JavaScript.application.js你可以考虑这一点,而不是把所有东西藏起来.

js.erb与js.rjs

这两个中的一个(.erb)实际上是用于从模板生成javascript.这是您在HTML中作为标记包含的内容.另一个(.rjs)是关于控制AJAX响应中的页面内容,并且在进行这样的AJAXy调用之前不会运行.