Rails 3 - 如何动态创建与param [：id]关联的html元素？

我在试图实现需要使用html5绘图画布的Rails 3应用程序。Rails 3 - 如何动态创建与param [：id]关联的html元素？

到目前为止，我有一个素描支架，我已经修改了指数和显示观点是并排侧（我键入隐藏DIV在那里只是为了证明我还计划举办在一个div画布）：

enter image description here

目前在的application.js文件我有访问，通过一个Ajax请求，旁边的草图列表并将其放在表演动作的脚本。下面是该代码：

// Show individual sketch 
$(function(){ 
    var $sketch_div = $('#show_sketch_div');   

    // return html instead of js 
    $('a[data-remote]').live('ajax:beforeSend', function(e, xhr, settings){ 
    xhr.setRequestHeader('accept', '*/*;q=0.5, text/html, ' + settings.accepts.html); 
    }); 

    // Handle sketch name links with the data-remote attribute 
    $('a[data-remote]').live('ajax:success', function(xhr, data, status){ 
    $sketch_div 
     .html(data)   
     .show(); 
    });  
});

而且，每个在草图列表中的链接都有与之相关的（为了使用jQuery抢吧）类：

<td><%= link_to 'Show', sketch, :remote => true, :class => 'show_sketch_button' %></td>

我有草图控制器设置以呈现JSON：

DEF显示 @sketch = Sketch.find（PARAMS [：ID]）

respond_to do |format| 
    format.html # show.html.erb 
    format.xml { render :xml => @sketch } 
    format.json { render :json => @sketch } 
end

末

这个地区是我真的卡住。

我打算使用JQuery插入画布标签，只要Sketch的显示按钮被单击。但是，我不知道如何使用Javascript获取相关草图的参数，然后使用它来生成仅与特定的ID相关联的Canvas元素。

我已经搜索了JSON教程，但我找不到任何似乎解决了我想要做的事情。我对JSON也很陌生 - 所以我可能会错过它。

有没有人有任何想法或例子，你可以指向我？

来源

2011-11-16 PhillipKregg

如果我是对的，你想写一个草图对象的ID到你的html中，以便以后用JavaScript。

在你的link_to标签中创建一个“data-”html5属性。在html5中，您可以创建以“数据”开头的标签，这些标签将会有效。

<%= link_to 'Show', sketch, :remote => true, :class => 'show_sketch_button', :"data-sketch-id" => sketch.id %>

在jQuery中，你可以用$('a.show_sketch_button[data-sketch-id="<NUMBER>"]')

得到这个元素顺便说一句，我不建议使用.live事件处理。它在每次改变时解析完整的DOM。而不是，只使用.bind（），.unbind（）< ---如果你需要删除事件处理程序。

来源

2011-11-17 00:36:26 p1100i

Doh！我忘了关于'data-'属性的所有信息。我得到它的工作，但需要使用警报（这个。的getAttribute（ '数据草图-ID'））;以检查并查看我是否拥有正确的值。否则，它返回'null'。谢谢 - 你的提示让我在那里！ – PhillipKregg

顺便说一句，我注意到你在设置id ::“data-sketch-id”时使用了冒号。这是否在轨道中创建一个符号？它似乎将该值作为类属性传递给html页面，无论冒号是否存在。只是好奇。 – PhillipKregg

由于“ - ”符号的存在，我确实把它们放在冒号中。这是link_to方法的html_option参数。欲了解更多信息，请访问： http://api.rubyonrails.org/classes/ActionView/Helpers/UrlHelper.html#method-i-link_to – p1100i

Rails 3 - 如何动态创建与param [：id]关联的html元素？

回答

相关问题