如何使用 AJAX 替换 Rails 3 中的 div？

发布于 2024-10-25 03:21:04 字数 1493 浏览 3 评论 0原文

我试图使用 RJS 替换 DOM 中的 div。这是我尝试过的代码，控制器有这个方法：

def change
  render :update do |page|
    page.replace(:test_id, :partial => "input",:locals =>{ :type => 'text', :name => 'user[user][contactinfo][city]', :val => "", :size => '244', :placeholder_text => 'Yes it is working...'})
  end
end

视图包含：

<div id = "test_id"></div>
<%= link_to "AJAX", "/poc/change", :remote => true %>

现在我想用提到的部分替换 div id="test_id" 。

我得到的输出是：

try {
Element.replace("test_id", "<input type=\"text\" id=\"user[user][contactinfo][city]\" name=\"user[user][contactinfo][city]\" value=\"\" placeholder=\"Yes it is working...\" style=\"width:244px; height:33px; border:0; color:#646464; background:url(/images/form_textfield_244.png) 0 5px no-repeat; padding:12px 5px 0 5px; margin:0 0 10px 0;\" />\n");
} catch (e) { alert('RJS error:\n\n' + e.toString()); alert('Element.replace(\"test_id\", \"<input type=\\\"text\\\" id=\\\"user[user][contactinfo][city]\\\" name=\\\"user[user][contactinfo][city]\\\" value=\\\"\\\" placeholder=\\\"Yes it is working...\\\" style=\\\"width:244px; height:33px; border:0; color:#646464; background:url(/images/form_textfield_244.png) 0 5px no-repeat; padding:12px 5px 0 5px; margin:0 0 10px 0;\\\" />\\n\");'); throw e }

这是在浏览器中看到的。有人能解释一下我哪里出了问题吗？预期的输出是 div 应该被替换为给定的替换内容。

原文

I was trying to replace my div in DOM using RJS. Here is the code i tried,
The controller has this method:

def change
  render :update do |page|
    page.replace(:test_id, :partial => "input",:locals =>{ :type => 'text', :name => 'user[user][contactinfo][city]', :val => "", :size => '244', :placeholder_text => 'Yes it is working...'})
  end
end

The view contains:

<div id = "test_id"></div>
<%= link_to "AJAX", "/poc/change", :remote => true %>

Now I want to replace the div id="test_id" with the partial mentioned.

The output i get is:

try {
Element.replace("test_id", "<input type=\"text\" id=\"user[user][contactinfo][city]\" name=\"user[user][contactinfo][city]\" value=\"\" placeholder=\"Yes it is working...\" style=\"width:244px; height:33px; border:0; color:#646464; background:url(/images/form_textfield_244.png) 0 5px no-repeat; padding:12px 5px 0 5px; margin:0 0 10px 0;\" />\n");
} catch (e) { alert('RJS error:\n\n' + e.toString()); alert('Element.replace(\"test_id\", \"<input type=\\\"text\\\" id=\\\"user[user][contactinfo][city]\\\" name=\\\"user[user][contactinfo][city]\\\" value=\\\"\\\" placeholder=\\\"Yes it is working...\\\" style=\\\"width:244px; height:33px; border:0; color:#646464; background:url(/images/form_textfield_244.png) 0 5px no-repeat; padding:12px 5px 0 5px; margin:0 0 10px 0;\\\" />\\n\");'); throw e }

This is seen in browser. Can anybody explain where I am going wrong? The expected output is the div should get replaced with whatever given for replacement.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

此岸叶落 2024-11-01 03:21:04

我建议你不要再使用RJS了。更好的是用你想要的 javascript 生成一个 JS 视图。

例如，如果您使用 jQuery，您可以添加一个文件：

changes.js.erb

在您添加 Javascript 的内部：

$('#test_id').html("<%= escape_javascript(render :partial => "input",:locals =>{ :type => 'text', :name => 'user[user][contactinfo][city]', :val => "", :size => '244', :placeholder_text => 'Yes it is working...'}) %>")

现在，如果您调用 /proc/change.js，您可以看到生成的 JS，就像您在页面中执行一些 JS 一样。

I advise you do not use RJS anymore. The better is generate a JS view with you want your javascript do.

By example if you use jQuery you can add a file :

changes.js.erb

Inside you add you Javascript :

$('#test_id').html("<%= escape_javascript(render :partial => "input",:locals =>{ :type => 'text', :name => 'user[user][contactinfo][city]', :val => "", :size => '244', :placeholder_text => 'Yes it is working...'}) %>")

Now if you call the /proc/change.js you can see the JS generated like if you do some JS in you page.

回复收藏 0 原文

~没有更多了~