How to add data-attribute to the form tag in simple_form?

Question

I'm using garlic.js to validate my forms. Garlic.js recommends adding a data-attribute on the form tag.

Here's what I need to generate:

<form data-validate="parsley">

I'm having issues to generate this data attribute on the form tag. I tried everything and nothing worked. Anyone has a solution to this?

Karolyn

Answer 1

Try this:

<%= simple_form_for @entity, :html => {:"data-validate" => 'parsley'} do |f| %>
    <!-- inputs -->
<% end %>

Update

From the comment below, to have the form include an HTML5 data attribute with no value try the following:

<%= simple_form_for @entity, :html => {:"other-data-value" => ''} do |f| %> 

By setting the attribute to an empty string the form helper renders just the attribute.

Dabney

what to do if the data attribute does not need a value? just data-validate? I tried with data-validate: true but it din not work out – Valediction

@VysakhSreenivasan I updated the answer to show how what you are asking can be accomplished. Hope that helps! – Dabney

I do a little bit different. Add input_html: { data: { validate: "required"} } in every input field. Ex: f.input :title, label: false, input_html: { data: { validate: "required" }, class: "form-control", placeholder: "Post Title" } – Branton

Answer 2

You can set data attributes directly by passing in a data hash, but all other HTML options must be wrapped in the HTML key. Example:

<%= form_for(@post, data: { validate: "parsley" }, html: { name: "go" }) do |f| %>
   ...
<% end %>

The HTML generated for this would be:

<form action='http://www.example.com' method='post' data-validate='parsley' name='go'>
  ...
 </form>

api.rubyonrails.org

Tufa

This is the only one that worked. I didn't know about the data: wrapper, thank you! – Pinhead

Answer 3

For anyone stumbling across this in 2016 using either the newer version of Rails (4) or the newer version of Parsley (2) here is what you'll need to do:

First of all to activate parsley with data attributes in the new version you add data-parsley-validate now instead of the data-validate="parsley" from version 1 of Parsley. Now lets get that to work with rails form_for.

Even if you're not using parsley, this is how to insert a data attribute in Rails 4.

<%= form_tag '/login', :"data-parsley-validate" => '' do %>
    <!-- inputs -->
<% end %>

So basically the difference is not using the html=>{} hash. I tried that to see if that trick would work and at least for me my markup looked like this:

<form action="/login" method="post" html="{:data-parsley-validate}">
    <!-- inputs -->
</form>

But by simply putting the data attribute directly in there as a symbol with an empty string as the corresponding value and it worked perfectly. This is the markup I received.

<form action="/login" method="post" data-parsley-validate>
    <!-- inputs -->
</form>

In other words its perfect. So thats how to use Rails 4 to get data attributes in your form_tag.

Fair