一些熟练的程序员推荐仅嵌套资源 1 层深 http://weblog.jamisbuck.org/2007/2/5/nesting-resources。当然,您的域可以更复杂,但您不应该在单个视图中公开所有复杂性。如果你真的need要在单个页面上管理整个站点,我建议您使用多种表单并通过 AJAX 更新各种显示,而不是尝试在一种表单中完成所有操作。您将拥有更好的可用性和更清晰的代码。
EDITED
好的,这是 HAML 中的示例视图:
%h1 Editing Site
#site-form
- form_for @site, :class => 'remote', :'data-update' => '#site-form' do |f|
%p
= f.label :name
= f.text_field :name
%p
[All the other fields on your Site model]
%p
= f.submit "Save Site"
%h2
Buildings for
= @site.name
#buildings-forms
- for building in @site.buildings
%div{ :id => "building-#{building.id}" }
- form_for building, :class => 'remote', :'data-update' => "#building-#{building.id}" do |f|
%p
= f.label :name
= f.text_field :name
%p
[All other building fields]
%p
= f.submit "Save Building"
%h3
Controllers for
= building.name
- for cntroller in building.controllers
%div{ :id => "controller-#{cntroller.id}"}
- form_for cntroller, :class => 'remote', :'data-update' => "#controller-#{cntroller.id}" do |f|
%p
= f.label :name
= f.text_field :name
%p
[All other controller fields]
%p
= f.submit "Save Controller"
下一个级别“测量”看起来几乎相同。
至于让 AJAX 摇摆起来,在 jQuery 中你会说:
$( function() {
$('form.remote').submit( function() {
var submitted_form = this;
$.post( this.action, $.serialize(this), function( data_returned, status, request ) {
var updated_block = $( data_returned ).find( $(submitted_form).attr('data-update').html();
$( $(submitted_form).attr('data-update') ).html( updated_block );
} );
return false;
} );
});
这允许每个表单在发布后使用来自服务器的新版本发布和更新其可更新块。您可以更喜欢并使用元数据插件来存储应更新哪个块的信息以及有关请求的其他信息,但这很简单,并且允许您在 html 中查看配置。 data-x 属性是 HTML5 的预定功能,但无论如何我们都可以继续使用它们。
通过为远程表单创建约定,可以轻松地让 jQuery 使用少量代码处理所有 ajax 帖子。您可能需要一些更奇特的东西,旋转器,验证等。有空间,但这将使您开始使用单页面界面。