[英]Using a clickable div to submit a simple_form in Rails
I've got this div that I'd like to be able to click on to submit a simple_form in Rails 4. 我已经有了这个div,我希望能够单击它以在Rails 4中提交一个simple_form。
<div id="submit-form" class="bottom-nav-box" style="width: 66.6%;">
<div class="center-wrapper">
<div style="display: inline-block;">
<div class="bottom-nav-box-content" style="float: right">
<%= f.submit 'Submit' %>
</div>
</div>
</div>
</div>
The idea is that I want to get the "submit-form" div to submit the form when clicked, rather than have a tiny button in the middle of it that says 'Submit'. 我的想法是,我想让“提交表单” div在单击时提交表单,而不是在其中间有一个小按钮“ Submit”。
I was thinking something along the lines of wrapping the entire thing in <%= link_to f.submit do %>
but that doesn't work at all. 我在考虑将整个内容包装在
<%= link_to f.submit do %>
但这根本不起作用。
Is there any way I can do this? 有什么办法可以做到吗?
Any help is greatly appreciated. 任何帮助是极大的赞赏。 Thanks
谢谢
You'll be best using Javascript for this: 为此,最好使用Javascript:
#app/assets/javascripts/application.js
$(document).on("click", "#submit-form", function() {
$("#form").submit();
});
The caveat here is that you'll need a valid HTML form (as demonstrated below) which you can invoke the "submit" function for: 需要注意的是,您将需要一个有效的HTML表单(如下所示),您可以调用该表单的“ submit”函数:
#view
<%= form_tag your_path do %>
<%= ... tags ... %>
<%= submit_tag %>
<% end %>
-- -
You must remember that Rails is back-end; 您必须记住,Rails是后端。 JS is front-end.
JS是前端。 You can't call "front end" functionality with Rails directly (its exactly the same as PHP) - you'll have to use JS to bind events in the DOM to any event you wish to call on the backend
您不能直接使用Rails调用“前端”功能(与PHP完全相同)-您必须使用JS将DOM中的事件绑定到您希望在后端调用的任何事件
You must also be aware that Rails' primary task is to render HTML on the front-end. 您还必须知道,Rails的主要任务是在前端呈现HTML。 In the backend, it will do all the amazing ruby-based magic;
在后端,它将完成所有基于红宝石的神奇魔术; but the front-end only renders HTML.
但前端仅呈现HTML。 This means you have to ensure you're able to send the required data / functionality within the confines of the HTML spec
这意味着您必须确保能够在HTML规范的范围内发送所需的数据/功能
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.