17

问题是我有一个远程表单，根据条件，id 喜欢转换为非远程表单（使用 UJS），然后提交。注意表单有文件上传。

这是详细信息：我最初使用

= form_for @myobj, :url => {:action=>"remoteAction", :controller=>"myobjects"}, :remote => true do |f|
... (f.fields....)

生成 HTML：

<form id="new_myobj" class="new_myobj" method="post" accept-charset="UTF-8" data-remote="true" action="/remoteAction">

当我按预期单击提交时，表单提交为“AS JS”。在控制器操作中，我正在对提交的表单中的字段进行一些验证。如果所有验证都通过，我执行以下 .js.haml 模板：

$('form#new_myobj').removeAttr("data-remote");
$('form#new_myobj').attr('enctype', 'multipart/form-data');
$('form#new_myobj').attr('action', '/myobjects/regularAction');

它成功地将页面上的 HTML（通过 Firebug 见证）更改为：

<form id="new_myobj" class="new_myobj" method="post" accept-charset="UTF-8" enctype="multipart/form-data" action="/myobjects/regularAction">

由于表单包含一个 f.file_field，我必须作为多部分提交，以便可以上传图像，并且我现在无法提交“AS JS”，当我点击提交时，确实调用了控制器操作“regularAction”，但它仍然'作为 JS'

问题是，我还需要在 HTML 中进行哪些更改，以便可以非 xhr 提交表单？它与标题有关吗？

4

2 回答 2

42

jQuery 在数据属性方面有点棘手，因为它既读取 HTML5 数据标签，又读取绑定到 DOM 元素的自身存储，也称为数据。当写入一个属性时，该值被复制到 jQuerys 自己的数据存储中（大概data("remote")是在被调用时）。

但是，只有当 jQuery 的数据对于该名称为空时才会发生这种情况。因此，设置属性只会起作用一次，之后即使属性发生变化，也会使用“缓存”值。为了真正摆脱值，我们需要按顺序删除属性和jQuerys自己的存储方法。原因是有一个高级 ( element.removeData(…)) 函数和一个低级( ) 函数jQuery. removeData(element, …)。前者重新读取 HTML5 数据属性并将其存储在 jQuery 自己的存储中。使用相当不寻常的低级函数显然也可以。

此外，我们确实需要删除该属性——将其设置为 false 是不够的，因为 Rails 只检查是否form.data('remote') 未定义（在 中查找jquery_ujs.js）。

TL;博士：

  • attr("data-remote") != data("remote")
  • 这两行使表单非远程（再次）。订单很重要。
  $("form").removeAttr("data-remote");
  $("form").removeData("remote");

如果您确实知道要查找的内容，则已记录在案：

StackOverflow 不允许我发布两个以上的链接，但你可以猜到 removeData 一个。高级功能与低级功能相连。

避免 Rails 4+ 中的令牌真实性错误：正如 Stan 在下面评论的那样，仅执行上述操作将失败并出现InvalidAuthenticityToken错误。解决方法很简单，请参阅此处了解详细信息：https ://stackoverflow.com/a/19858504/1684530

于 2012-09-20T00:28:02.410 回答
4

问题是您禁用 Ajax 提交的方法不太正确。您需要取消绑定已由 rails.js（Rails UJS 适配器）添加到表单的 JavaScript 事件。您可以通过以下方式做到这一点： $('form#new_myobj').unbind()取消绑定到表单的所有事件。您还需要删除$('form#new_myobj').removeAttr('data-remote')和属性（如果存在）。$('form#new_myobj').removeAttr('data-type')data-remotedata-type

于 2012-03-28T12:22:22.350 回答