javascript - rails 中的 rjs 类型错误？

Question

我添加了一个 link_to_remote 以从部分加载模式对话框。但是当我运行应用程序时，出现以下错误。

RJS error:

TypeError: $("create_event_dialog").dialog is not a function

当我再次单击“确定”时，出现了另一个对话框。

Element.update("create_event", "<form action=\"/countries\" class=\"new_country\" id=\"new_country\" method=\"post\" onsubmit=\"new Ajax.Request('/countries', {asynchronous:true, evalScripts:true, parameters:Form.serialize(this)}); return false;\"><div style=\"margin:0;padding:0;display:inline\"><input name=\"authenticity_token\" type=\"hidden\" value=\"qWXCu2zMmlMhJG+GRf35kMbAIfzYAtFBee142ThmmMw=\" /></div>\n <p>\n    <label for=\"country_name\">Name</label><br />\n    <input id=\"country_name\" name=\"country[name]\" size=\"30\" type=\"text\" />\n  </p>\n  <p>\n    <input id=\"country_submit\" name=\"commit\" type=\"submit\" value=\"Create\" />\n  </p>\n</form>\n");   
$('create_event_dialog').dialog({
    title: 'New Event',
    modal: true,
    width: 500,
    close: function(event, ui) { $('create_event_dialog').dialog('destroy') }

});

为什么会出现这种错误？我有一个 ID 为 create_event_dialog 的 div。我正在使用原型(prototype)，但找不到解决这个问题的方法。请帮助我。

Answer 1

您的代码看起来像您想要实际使用 jQuery UI 对话框 功能。据我所知，Prototype(或 Scriptaculous)没有内置的对话框支持。

如果想要一个 jQuery UI 对话框，您有两个选择:

1. 使用 jQuery 和 jQuery UI 以及原型(prototype)。
2. 替换 Prototype 并且只使用 jQuery

选项 1:

要将 jQuery 与 Prototype 一起使用，您必须包含 jQuery Javascript 库并通过调用 jQuery.noConflict() 启用兼容模式。此后，$ 函数属于 Prototype，对于所有 jQuery 功能，您必须使用 jQuery(...) 代替。例如 jQuery('create_event_dialog').dialog(... 在你的情况下。

您可以在 Using jQuery with Other Libraries 上找到详细信息.

选项 2:

您必须删除 Prototype 库并改为包含 jQuery 库。您还需要 jRails compatibility library保留您的原型(prototype)助手。而且您必须将现有的原型(prototype)代码更改为 jQuery 代码。

例如，您的 Element.update 语句如下所示:

$("#create_event".html("<form action=...")

参见 Using jQuery with Ruby on Rails 了解更多详情。

小心:根据您现有的代码，选项 2 可能需要大量工作，但会产生更清晰的 Javascript 代码。此外，可能值得考虑将 UJS 和 jQuery 作为官方 Javascript 库切换到 Rails 3.1。