如何使用Turbolinks使用method =“get”提交表单

时间:2022-09-21 21:16:12

I have a search form on my page, and it is safe for Turbolinks to be enabled as it is using method="get"

我的页面上有一个搜索表单,启用Turbolinks是安全的,因为它使用method =“get”

Is there any easy way to have the form submit under control of Turbolinks (ie avoid page refresh)

是否有任何简单的方法可以在Turbolinks的控制下提交表单(即避免页面刷新)

2 个解决方案

#1


1  

At the turbolinks project, there's issue #64 where someone has written a Coffeescript implementation for Rails.

在turbolinks项目中,有问题#64,有人为Rails编写了Coffeescript实现。

Add the code provided at that link. It adds a turboforms function that needs to be called at page ready, like this:

添加该链接提供的代码。它添加了一个需要在页面就绪时调用的turboforms函数,如下所示:

$(turboforms);

I'm in the process of implementing this, I'll update my answer if I find out anything else that's useful.

我正在实施这个,如果我发现其他任何有用的东西,我会更新我的答案。

#2


23  

You could use something like this in your application.js:

你可以在你的application.js中使用这样的东西:

// send get forms through turbolinks
$(document).on("submit", "form[data-turboform]", function(e) {
    Turbolinks.visit(this.action+(this.action.indexOf('?') == -1 ? '?' : '&')+$(this).serialize());
    return false;
});

Then, to enable any form to be sent with turbolinks you would need to add the data-turboform attribute to the form, like this:

然后,要使用turbolinks发送任何表单,您需要将data-turboform属性添加到表单中,如下所示:

<form action="..." method="get" data-turboform>
    ...
</form>

#1


1  

At the turbolinks project, there's issue #64 where someone has written a Coffeescript implementation for Rails.

在turbolinks项目中,有问题#64,有人为Rails编写了Coffeescript实现。

Add the code provided at that link. It adds a turboforms function that needs to be called at page ready, like this:

添加该链接提供的代码。它添加了一个需要在页面就绪时调用的turboforms函数,如下所示:

$(turboforms);

I'm in the process of implementing this, I'll update my answer if I find out anything else that's useful.

我正在实施这个,如果我发现其他任何有用的东西,我会更新我的答案。

#2


23  

You could use something like this in your application.js:

你可以在你的application.js中使用这样的东西:

// send get forms through turbolinks
$(document).on("submit", "form[data-turboform]", function(e) {
    Turbolinks.visit(this.action+(this.action.indexOf('?') == -1 ? '?' : '&')+$(this).serialize());
    return false;
});

Then, to enable any form to be sent with turbolinks you would need to add the data-turboform attribute to the form, like this:

然后,要使用turbolinks发送任何表单,您需要将data-turboform属性添加到表单中,如下所示:

<form action="..." method="get" data-turboform>
    ...
</form>