Haml新手无法向页面添加无序列表

时间:2012-10-17 15:46:15

标签: html-lists haml

我想在我的应用上添加三个将用作计数器的字段到屏幕顶部。以下代码确实有效,但是,如果您将页面置于编辑模式然后单击“保存”按钮,则三个计数器字段将消失并保持这种状态直到您刷新浏览器。我是一个Haml新手,那里没有太多的文件,而且那里的一点点没有帮助我。

以下是用于呈现相关页面的相关Haml代码:

- form_for [@application, @item_collection], :html => { 'data-remote' => 'json', :id => 'edit_item_collection', :class => 'show_progress inline_edit' } do |f|
  = render 'edit_fields', :f => f
  .submit.editing_only
    %button.default_action{ :type => 'submit',:id => 'Save'} Save`

这是实际页面的Haml代码:

.field.large
  = f.label      :name, nil, 'data-help-id' => 'page_name'
  = f.text_field :name, disabled_if_unauthorized(@item_collection, :maxlength => 255, :title => "Edit Page")
  = f.error_message_on(:name, :css_class => 'error_message')
.field
  = f.label      :path, nil, 'data-help-id' => 'page_path'
  = f.text_field :path, disabled_if_unauthorized(@item_collection, { :maxlength => 255, :class => 'extra_margin', :title => "Edit Page" })
  = f.error_message_on(:path, :css_class => 'error_message')
.field.info
  = f.label      'Info'
  %ul.elements_count
    %li.elements_in_use{ :id => 'elements_in_use' }
    %li.unused_elements{ :id => 'unused_elements'}
    %li.undefined_elements{ :id => 'undefined_elements'}

当我点击“保存”时,elements_count无序列表消失(但如果我刷新浏览器则重新出现)。我知道问题是我需要把“= f”。在这些元素面前,但我不知道如何为列表做到这一点。

这是我填充li元素的JavaScript:

function getElementCount() {
  var usage_element_total = $('.usage').size();
  var unused_element_total = $('.unused').size();
  var undefined_element_total = $('.undefined').size();
  $('#elements_in_use').html(usage_element_total + " Elements in use,");
  if (unused_element_total < 1) {
    $('#unused_elements').html(" 0 unused Elements,");
  } else {
    $('#unused_elements').html((unused_element_total-1) + " unused Elements,"); 
  }
  $('#undefined_elements').html(undefined_element_total + " undefined Elements");
}

任何帮助都会受到极大的赞赏。谢谢!

1 个答案:

答案 0 :(得分:0)

每当表单更新时,您需要触发填充元素计数的Javascript。假设您在页面加载时调用getElementCount,您可以在呈现表单时触发它:

$("form").bind("ajax:complete", getElementCount);

但是我猜测事情是如何连接在一起的,也许这对你的情况不起作用。