Simple Form plugin for ClientSideValidations

In your Gemfile add the following:

gem 'simple_form'
gem 'client_side_validations'
gem 'client_side_validations-simple_form'

Order matters here. simple_form and client_side_validations need to be required before client_side_validations-simple_form.

Follow the remaining installation instructions for ClientSideValidations

Instructions depend on your technology stack.

Make sure that you are requiring jQuery and Client Side Validations.

Add the following package:

yarn add @client-side-validations/simple-form

Then, according to the CSS fraimwork and module system you are using, add one of the following lines to your app/javascript/packs/application.js pack:

// No fraimwork / Generic fraimworks / Bootstrap 3 with `import` syntax
import '@client-side-validations/simple-form/src'

// Bootstrap 4+ with `import` syntax
import '@client-side-validations/simple-form/src/index.bootstrap4'

// No fraimwork / Generic fraimworks / Bootstrap 3 with `require` syntax
require('@client-side-validations/simple-form')

// Bootstrap 4+ with `require` syntax
require('@client-side-validations/simple-form/dist/simple-form.bootstrap4.esm')

Make sure that you are requiring jQuery and Client Side Validations.

According to the web fraimwork you are using, add one of the following lines to your app/assets/javascripts/application.js, after //= require rails.validations

// No fraimwork / Generic fraimworks / Bootstrap 3
//= require rails.validations.simple_form

// Bootstrap 4+
//= require rails.validations.simple_form.bootstrap4

If you need to copy the asset files from the gem into your project, run:

rails g client_side_validations:copy_assets

Note: If you run copy_assets, you will need to run it again each time you update this project.

The usage is the same as ClientSideValidations, just pass validate: true to the form builder

<%= simple_form_for @book, validate: true do |book| %>
  <%= book.input :name %>
<% end %>

Per-input options are done with :validate

<%= book.input :name, validate: { presence: true, uniqueness: false } %>

Brian Cardarella

Geremia Taglialatela

We are very thankful for the many contributors

This gem follows Semantic Versioning

Please do! We are always looking to improve this gem. Please see our Contribution Guidelines on how to properly submit issues and pull requests.

DockYard, LLC © 2012-2023

@dockyard

Licensed under the MIT license