通过从javascript文件中调用部分来更新html元素

Updating html element by partial called from javascript file

本文关键字：更新 html 元素 调用部 javascript 文件      更新时间：2023-09-26

我有一个容器td元素，我使用HTML部分成功地填充了其他元素，这是在页面加载时完成的。

部分运行作为参数的任务对象，并决定添加哪些元素。

在一个特定的操作完成后，任务对象被更新，我想通过再次运行部分来更新容器。

我用更新的任务从我的create.js.haml调用这个部分，部分运行并构建正确更新的HTML(我可以在Firebug响应中看到它)。

但是实际的页面没有更新。我遗漏了什么?

这是我的文件:

html.haml承载容器td:

%td#task-categories{ :class => "#{dom_id(task)}_categories"}
  = render 'task_categories_mini_bar', :task => task

部分html.haml:

- _MAX_DISPLAYED_CAT = 3
- cat_index = 0
- task.categories.each do |category|
  - if (cat_index == _MAX_DISPLAYED_CAT)
    %td{:style => "padding-left:1px; padding-right:5px"} ...
    - break
  - cat_index += 1
  %td{ :class => "task-category-color_#{dom_id(category)}",
  :style => "width:60px; background:#{category.color}; border:solid 1pt lightblue; border-radius:3pt; text-align:center; "}
    = truncate(category.name, :length => 10)

它们组合在一起形成了这个HTML:

<td id="task-categories" class="task_3_categories"> </td>
<td class="task-category-color_category_1" style="width:60px; background:#b8d7ff; border:solid 1pt lightblue; border-radius:3pt; text-align:center; "> cat1 </td>
<td class="task-category-color_category_2" style="width:60px; background:#ff8fcb; border:solid 1pt lightblue; border-radius:3pt; text-align:center; "> cat2 </td>

这里有另一个问题-两个添加的类别tds被添加到第一个容器td下面。我怎么能把它们加进去而不是放在后面呢?

现在这里是create.js.haml再次调用部分:

$('td.#{dom_id(@task)}_categories').html(#{escape_javascript(render(:partial => 'tasks/task_categories_mini_bar', :locals => {:task => @task}))})

同样，响应HTML确实显示了一个新的HTML，但页面没有更新。

我使用rails 3.0.10感谢分配，Eyal.

那么，我缺少的是在我的ajax create.js.haml

中调用部分的"
$('td.#{dom_id(@task)}_categories').html("#{escape_javascript(render(:partial => 'tasks/task_categories_mini_bar', :locals => {:task => @task}))}")

这。

相关文章：