2014-01-10 58 views
6

阅读David Heinemeier Hansson的关于服务器生成的JavaScript的blog post之后,我决定回顾一下我在Rails应用程序中使用AJAX调用的方式。 David建议创建一个.js.erb模板,该模板只是嵌入了在服务器上生成的ruby代码的JavaScript,而不是在客户端JavaScript中执行任何DOM操作。将HTML返回给AJAX Rails调用

另一种方法当然是简单地做客户端的一切,(例如)返回一个JSON对象表示从服务器更新的对象,并使用JavaScript来完成所有的DOM操作。

我不喜欢的原因有两个第一种方法:

1)我使用HAML和CoffeeScript的在我的应用程序,并认为通过使用香草javascript和再培训局uncecessarily臃肿我的代码库使用不同语言的代码(也许有可能创建.coffee.haml模板,而不是js.erb,我不知道)

2)我真的不喜欢'乱丢'我的视图文件夹与什么本质上的JavaScript文件,嵌入一点红宝石。

第二种方法,正如David在他的博客文章中谈到的,非常依赖于客户端JavaScript,这可能会导致客户端JavaScript代码臃肿,并且可能需要客户端模板,这在最糟糕的情况下案例情景可能意味着模板数量几乎翻倍。

我决定去的方法(和要问是否是去了解这个完全愚蠢的方式)如下:

1)将remote: true标志进行链接和表单使用AJAX来发布到服务器。

2)在我的控制器,处理一切为html,根本没有渲染的布局应请求是一个AJAX请求:render partial: '<partial-name>', layout: false if request.xhr?。这只是返回部分的HTML,评估Ruby代码。

3)在资产javascript文件(例如<partial-name>.js.coffee)中收听ajax:success并从响应中追加HTML。

我喜欢这种做法,因为(我很简单的应用程序),这让我保持我的所有代码HAML/CoffeeScript中,并避免任何JavaScript模板。

我意识到如果应用程序的复杂性增加,这个问题可能会有不同的性质,但我仍然认为这是一个有效的问题:这是一个糟糕的方式去实现基于AJAX的架构的Rails应用程序(如果是这样的话,为什么呢?也就是说,为什么从AJAX调用返回HTML而不是JSON是一个坏主意?)还是我应该继续使用的东西?

谢谢你:-)

回答

1

如果你使用remote:true它发送一个js请求,而不是html请求。

然后控制器的执行方法时,它将查找具有相同的名称作为刚完成执行控制器动作的js.erb或js.haml文件。

在这个文件可以写“JS”代码以执行需要所述控制器动作已经完成像改变的局部或更新视图等执行之后进行的任何行动

如果您在javascript资源文件中有函数,那么您也可以调用该函数。

2

你的方法在我看来相当准确。不过,我会改变1点。而不是使用remote:true,我会直接使用jQuery ajax调用。

$(function(){ 
    $('#some_link').click(function() { 
     $.ajax({ 
      // some parameters here 
     }) 
     .done(function(data){ 
      $('div').html(data); 
     }); 
    }); 
});