davyjoneslocker / client_side_validations-simple_form Goto Github PK

View Code? Open in Web Editor NEW

253.0 253.0 102.0 615 KB

Simple Form plugin for ClientSideValidations

License: MIT License

Ruby 41.86% JavaScript 56.20% HTML 1.94%

clientsidevalidations rails simpleform

client_side_validations-simple_form's People

Contributors

Stargazers

Watchers

Forkers

fleadope ndemoreau patelsan mbhnyc livelyfeed escobera zapo fgrehm vikewoods iliaform diogomafra davekrupinski supershijia mariochavez gabrieltomescu stembolthq jordanbrock aaronsakowski davidakachaos sweo raeno capitalthought qingping roo joshweinstein trooster gmcintire trongrg saveritemedical thunderboltlabs billgloff fny zhifeilu jscottsf voodoorai2000 yonahforst malagoli loqman brunocavalcante catapultcentral lunks rogeriochaves simonc fernandomm lordnibbler lampo blackkot merhard hau tboeckmann byus-inc dexion holdsport eoy tuliang demelziraptor rolandoalvarado liooo pedrogrande viniciusnz mrtime voroninnick spidie mileer asartalo free1 happyming1986 sshere ihara2525 lunalium jobinthepast tayfunoziserikan yuvrajchouhan tretti sebde koss-lebedev ravwar tewu yawlerman wazehq anhtai87-zz jasonivers abeltoy amj133 michalremis sachiotomita harrylewis

client_side_validations-simple_form's Issues

Form wrongly submitted

Hi,

Thanks for the great plugin to support simple_form !

I have a form with a few fields in it. When i try to submit the form it's actually submitted and the response from the server holds the invalid fields. I thought this should happen on the client side and the form shouldn't be submitted.

What am i missing ?

Force validation

I have this issue as described on SO:
http://stackoverflow.com/questions/15062978/force-client-side-validation-of-a-certain-attribute-conditionally

Do you have any solution to this issue?

wrong number of arguments (3 for 2) with Rails 4.0.0, client_side_validations 3.2.5, and simple_form 3.1.0

As mentioned on this client_side_validations issue, using this combination of gems results in an error about arguments:

wrong number of arguments (3 for 2) in app/views/foo/bar.html.erb

The original (partial) stack reported was:

(gem) actionpack-4.0.0.rc1/lib/action_view/helpers/form_helper.rb, line 426
(gem) client_side_validations-3.2.5/lib/client_side_validations/action_view/form_helper.rb, line 25

I ran into a similar error yesterday. I can't provide a new stack, since I switched to using a different plugin.

Bundler could not find compatible versions for gem "simple_form"

Hello there.
I'm having hard time trying to install the gem. My Gemfile looks like

gem 'rails', '3.2.12'
gem 'turbolinks', '1.0.0'
gem 'simple_form', '2.1.0'

gem 'client_side_validations', '3.2.5'
gem "client_side_validations-simple_form", '2.0.1'
gem 'client_side_validations-turbolinks', '1.0.0'

When I run Bundle install I get

Bundler could not find compatible versions for gem "simple_form":
  In Gemfile:
    client_side_validations-simple_form (= 2.0.1) ruby depends on
      simple_form (~> 2.0.3) ruby

    simple_form (2.1.0)

Am I missing something here?

Thanks.

Can not 'bundle install'

I am my application from rails 4 to rails 5. As per the ReadMe, the following is the piece required for client_side_validations-simple_form :

gem 'rails', '~> 5.1.0'
gem 'simple_form'
gem 'client_side_validations'
gem 'client_side_validations-simple_form', 
    github: 'DavyJonesLocker/client_side_validations-simple_form', 
    branch: 'rails5'

But I am getting the following issue:

Bundler could not find compatible versions for gem "client_side_validations":
  In snapshot (Gemfile.lock):
    client_side_validations (= 9.3.1)

  In Gemfile:
    client_side_validations

    client_side_validations-simple_form was resolved to 3.4.0, which depends on
      client_side_validations (~> 5.0.0)

Running `bundle update` will rebuild your snapshot from scratch, using only
the gems in your Gemfile, which may resolve the conflict.

ActionController::RoutingError (No route matches [GET] "/validators/uniqueness")

Hello, I don't know why I got this error ActionController::RoutingError (No route matches [GET] "/validators/uniqueness") please could you help me ?

Here is my gemfile.lock
client_side_validations (3.2.5)
client_side_validations-simple_form (2.0.1)
client_side_validations (> 3.2.0)
simple_form (> 2.0.3)
rails (3.2.13)

I don't see the routes with the command rake routes, is it normal?

Thanks you,
David

Cannot disable validation on a certain field

I have a checkbox on which it makes little sense to have a form validation. In my form partial, I have the code

<%= f.input :public, validate: :false %>

However, the public field still gives client-side errors. Am I missing something?

inputs with :as => :radio_buttons are being skipped in validation

In a form I'm building using ClientSideValidations + SimpleForm (with the gem plugin) the client side validation works for all fields except the :radio_buttons. The HTML that is produced for this group is similar to the other working ones:

...

Yet when the submit button is clicked, all the other inputs get the 'error' class but the radio_buttons input does not. If I remove the :as => :radio_buttons, the client side validations works just fine.

Any idea what is causing this? Thanks!

validations are not working in fancybox

when i kept :validate => true in simple form, it is working perfectly fine without fancybox.

But it is not working in a fancybox. I need to work in a fancybox.

Bootstrap v4

Some random stuff useful for Bootstrap v4

Simple Form configuration:

# frozen_string_literal: true

# Use this setup block to configure all options available in SimpleForm.
SimpleForm.setup do |config|
  config.error_notification_class = 'alert alert-danger'
  config.button_class = 'btn btn-primary'
  config.boolean_label_class = nil

  config.wrappers :vertical_form, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.use :placeholder
    b.optional :maxlength
    b.optional :pattern
    b.optional :min_max
    b.optional :readonly
    b.use :label, class: 'form-control-label'

    b.use :input, class: 'form-control'
    b.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
    b.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
  end

  config.wrappers :vertical_file_input, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.use :placeholder
    b.optional :maxlength
    b.optional :readonly
    b.use :label, class: 'form-control-label'

    b.use :input
    b.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
    b.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
  end

  #   config.wrappers :vertical_boolean, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
  #     b.use :html5
  #     b.optional :readonly
  #
  #     b.wrapper tag: 'div', class: 'checkbox' do |ba|
  #       ba.use :label_input
  #     end
  #
  #     b.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
  #     b.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
  #   end

  config.wrappers :vertical_boolean, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.optional :readonly

    b.wrapper tag: 'label', class: 'custom-control custom-checkbox' do |ba|
      ba.use :input, class: 'custom-control-input'
      ba.wrapper tag: 'span', class: 'custom-control-label' do |bb|
        bb.use :label_text
      end
    end

    b.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
    b.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
  end

  config.wrappers :vertical_radio_and_checkboxes, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.optional :readonly
    b.use :label, class: 'form-control-label'
    b.use :input
    b.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
    b.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
  end

  config.wrappers :horizontal_form, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.use :placeholder
    b.optional :maxlength
    b.optional :pattern
    b.optional :min_max
    b.optional :readonly
    b.use :label, class: 'col-sm-3 control-label'

    b.wrapper tag: 'div', class: 'col-sm-9' do |ba|
      ba.use :input, class: 'form-control'
      ba.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
      ba.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
    end
  end

  config.wrappers :horizontal_file_input, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.use :placeholder
    b.optional :maxlength
    b.optional :readonly
    b.use :label, class: 'col-sm-3 control-label'

    b.wrapper tag: 'div', class: 'col-sm-9' do |ba|
      ba.use :input
      ba.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
      ba.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
    end
  end

  config.wrappers :horizontal_boolean, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.optional :readonly

    b.wrapper tag: 'div', class: 'col-sm-offset-3 col-sm-9' do |wr|
      wr.wrapper tag: 'div', class: 'checkbox' do |ba|
        ba.use :label_input
      end

      wr.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
      wr.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
    end
  end

  config.wrappers :horizontal_radio_and_checkboxes, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.optional :readonly

    b.use :label, class: 'col-sm-3 control-label'

    b.wrapper tag: 'div', class: 'col-sm-9' do |ba|
      ba.use :input
      ba.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
      ba.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
    end
  end

  config.wrappers :inline_form, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.use :placeholder
    b.optional :maxlength
    b.optional :pattern
    b.optional :min_max
    b.optional :readonly
    b.use :label, class: 'sr-only'

    b.use :input, class: 'form-control'
    b.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
    b.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
  end

  config.wrappers :multi_select, tag: 'div', class: 'form-group', error_class: 'has-danger' do |b|
    b.use :html5
    b.optional :readonly
    b.use :label, class: 'form-control-label'
    b.wrapper tag: 'div', class: 'form-inline' do |ba|
      ba.use :input, class: 'form-control'
      ba.use :error, wrap_with: { tag: 'div', class: 'form-control-feedback' }
      ba.use :hint,  wrap_with: { tag: 'small', class: 'form-text text-muted' }
    end
  end
  # Wrappers for forms and inputs using the Bootstrap toolkit.
  # Check the Bootstrap docs (http://getbootstrap.com)
  # to learn about the different styles for forms and inputs,
  # buttons and other elements.
  config.default_wrapper = :vertical_form
  config.wrapper_mappings = {
    check_boxes: :vertical_radio_and_checkboxes,
    radio_buttons: :vertical_radio_and_checkboxes,
    file: :vertical_file_input,
    boolean: :vertical_boolean,
    datetime: :multi_select,
    date: :multi_select,
    time: :multi_select
  }
end
# rubocop:enable Metrics/BlockLength

Javascript file for horizontal form:

ClientSideValidations.formBuilders['SimpleForm::FormBuilder'].wrappers.horizontal_form =
  add: (element, settings, message) ->
    wrapper = element.closest("#{settings.wrapper_tag}.#{settings.wrapper_class.replace(/\ /g, '.')}")
    errorWrapper = element.closest("#{settings.wrapper_tag}[class^=\"col-\"]")
    errorElement = wrapper.find("#{settings.error_tag}.#{settings.error_class.replace(/\ /g, '.')}")
    unless errorElement.length
      errorElement = $("<#{settings.error_tag}/>", { class: settings.error_class, text: message })
      errorWrapper.append(errorElement)
    element.addClass(settings.wrapper_error_class)
    errorElement.text(message)
  remove: (element, settings) ->
    wrapper = element.closest("#{settings.wrapper_tag}.#{settings.wrapper_class.replace(/\ /g, '.')}")
    errorWrapper = element.closest("#{settings.wrapper_tag}[class^=\"col-\"]")
    errorElement = errorWrapper.find("#{settings.error_tag}.#{settings.error_class.replace(/\ /g, '.')}")
    element.removeClass(settings.wrapper_error_class)
    errorElement.remove()

Gem not working with ckeditor.

Hello there. Just now I have installed ckeditor and client_side_validations is not working with ckeditor. Help needed asap. Thanks.

Errors are stacking up and are deleting only the error class, not the error span element

My error case

I have a unique username field with a blacklist - so i tested "admin" as username

as expected - it is not valid

So i changed it to an valid name:

but the span with the error is still there, only the error class is gone.

so i try "admin" again:

a second span shows up and both now have the error class.

This happens every time on every field where i do following steps:

enter non-valid value -> tab out -> (error shows up)
2a. back in field -> change to valid value -> tab out ( error class of span gets deleted, span itself stays)
OR
2b. back in field -> add or delete a letter/number (but still invalid) ->tab out -> another span gets added, both with error class
rinse and repeat

if i do this on a password field, it even stacks spans to it when i'm not in the form anymore and press some keys.

My setup

client_side_validations (3.2.2)
client_side_validations-simple_form (2.0.1)
simple_form (2.0.4)
zurb-foundation (4.0.0)
rails (3.2.12)

Snippet of Model (is a Devise User Model)

before_validation :strip_and_downcase_username
  validates :username, :presence => true, :uniqueness => true
  validates_format_of :username, :with => /\A[A-Za-z0-9_]+\z/
  validates_length_of :username, :maximum => 32
  validates_exclusion_of :username, :in => USERNAME_BLACKLIST
  validate :freeze_username, :on => :update

  # Setup accessible (or protected) attributes for your model
  attr_accessor :login, :admin_action
  attr_accessible :firstname, :lastname, :login, :email, :password, :password_confirmation, :remember_me, :username

  def strip_and_downcase_username
      if username.present?
        username.strip!
        username.downcase!
      end
    end

Code for the form

= simple_form_for(resource, :as => resource_name, :url => registration_path(resource_name),:validate => true, :html => {:class => 'custom' }) do |f|
  = f.input :username, placeholder:"Dein Name"
  = f.input :email, placeholder:"E-Mail"
  = f.input :password, placeholder:"Passwort", :validate => false
  = f.input :password_confirmation, placeholder:"Passwort bestätigen", :validate => false
  = f.button :submit, "Anmelden", :class => 'button success radius'

HTML Output as shown in screenshots

<form accept-charset="UTF-8" action="/users" class="nice custom" data-validate="true" id="new_user" method="post" novalidate="novalidate">
<div style="margin:0;padding:0;display:inline">
  <input name="utf8" type="hidden" value="✓">
  <input name="authenticity_token" type="hidden" value="---removed---=">
</div>
  <div class="input string required error">
   <label class="string required control-label" for="user_username">
      <abbr title="erfordert">*</abbr> Username</label>
<input class="string required" id="user_username" name="user[username]" placeholder="Dein Name" size="50" type="text" data-validate="true">
<small>ist nicht verfügbar</small>
<small>ist nicht verfügbar</small>
</div>

<input class="button button success radius" name="commit" type="submit" value="Anmelden">
</form>

For clarifiying: "ist nicht verfügbar" means "is not available"

Rails 4 compatibility

Any plans of making the gem rails 4 compatible?

Bundler could not find compatible versions for gem "actionpack":
  In Gemfile:
    client_side_validations-simple_form (>= 0) ruby depends on
      actionpack (~> 3.0) ruby

    rails (= 4.0.0) ruby depends on
      actionpack (4.0.0)

simple_form 4.0 support

There is a new major version of simple_form out (4.0), and the version currently required by this gem (3.5.1) does not support the most recent version of Rails (5.2.0). Just to test, I forked and changed the requirement to 4.0, and while I don't see any obvious errors (I haven't really had time to do any thorough testing), it no longer seems to have any effect (i.e. there isn't any actual validation).

server side

hi
if i use client_side_validations-simple_form the server side validation still work ?
i mean is it possible to use double check validation in server side ?

tanks

date attribute rendered as :date in simple_form does not get client validations

I have a model with a date attribute. There is a validates_presence_of validation on this attribute. I used simple_form to build a form for this class of object:

<%= f.input :date_field, as: :date %>

added validate: true to the simple_form_for call. Other string input fields have client side validations, but this date field (rendered as 3 dropdown lists by SimpleForm) does not get validation. When I do not choose any value for year or month or date, nothing happens.

Simple Form 3.0.0.rc is here

Update the gemspec to support simpleform 3.0.0.rc

error message always shows outside of my settings

I set up a :horizontal-password wrapper that is inherited from :horizontal-form. It is the same with a minor twist that error message is contained along side with a progress bar.

config.wrappers :horizontal_password, tag: 'div', class: 'form-group row', error_class: 'has-error', success_class: 'has-success' do |b|
    b.use :html5
    b.use :placeholder
    b.optional :maxlength
    b.optional :pattern
    b.optional :min_max
    b.optional :readonly

    b.wrapper tag: 'div', class: 'col-md-6' do |bb|
      bb.use :label, class: 'col-sm-3 control-label'

      bb.wrapper tag: 'div', class: 'col-sm-9' do |bbb|
        bbb.use :input, class: 'form-control'
        bbb.use :hint,  wrap_with: { tag: 'p', class: 'help-block' }
      end
    end

    b.wrapper tag: 'div', class: 'col-md-3' do |bc|
      bc.wrapper tag: 'div', class: 'progress' do |bbc|
        bbc.wrapper tag: 'div', class: 'progress-bar strength-progress-bar' do |bbbc|
        end
      end
      bc.use :error, wrap_with: { tag: 'span', class: 'help-block' }
    end
  end

Supposedly, when I render the snippet.
<span class="help-block"> some error </span> should be inside <div class:'col-md-3'> progress bar {right_here}</div>

<div class:'col-md-3'> 
progress bar 
<span class="help-block"> enter password please. </span>
</div>

But instead, it is displayed at this:

<div class:'col-md-3'> 
progress bar 
</div>
<span class="help-block"> enter password please. </span>

In fact, it does not really matter if I commented out this line:

bc.use :error, wrap_with: { tag: 'span', class: 'help-block' }

It will always display an error in the end of the field. What if I don't want any error to display.. Where do I need to change?

I am using Simple Form to form builder.

Conditional validation not working

I'm passing a validate: true to a model with a conditional validator. The model includes ActiveModel::Validations and ActiveModel::Conversion and extends ActiveModel::Naming. It does not persist to the database.

The following code, nested inside a simple_form_for @record, :validate => true, :url => "/some_url" do |f|

Then, this line does not generate a validator for the field, and no required asterisk shows up:

%td= f.input :problem, validate: true, prompt: "Select a Problem", collection: boombot_problems

Inline error messages not showing up with Simple Form & Twitter Bootstrap

First, thanks for the great gem! There's just one thing that's not working.

For some reason, no error messages are appearing. I've tried the solution from this issue (#286) and even uncommenting the block from the initializer (even though I don't think it should be necessary with simple_form), but nothing so far has worked.

Version of ClientSideValidations (from Gemfile)
gem 'simple_form', '2.0.4'
gem 'client_side_validations', '3.2.1'
gem 'client_side_validations-simple_form', '2.0.1'

Version of Rails (fom Gemfile)
gem 'rails', '3.2.8'

Code snippet from your model of the validations
validates_format_of :url, :with =>
/^(http|https)://[a-z0-9]+([-.]{1}[a-z0-9]+).[a-z]{2,5}(([0-9]{1,5})?/.)?$/ix, :message => "Invalid URL"
validates_presence_of :title, :url, :message => "Can't be blank"

The form code from your template
<%= simple_form_for @resource, remote: true, :validate => true do |f| %>
<%= f.hidden_field :skill_id, :value => @resource.skill_id %>
<%= f.input :title %>
<%= f.input :url %>
<%= f.association :objectives, :collection => Skill.find("#{@resource.skill_id}").objectives, :as => :check_boxes, :label_method => lambda { |objective| "#{objective.content}" } %>
<%= f.submit %>
<% end %>

The resulting HTML along with the script tag

              <form accept-charset="UTF-8" action="/resources" class="simple_form new_resource" data-remote="true" data-validate="true" id="new_resource" method="post" novalidate="novalidate"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input name="authenticity_token" type="hidden" value="CPwGlzgTh29hZfEY2z5/TE+m0oAbqu0IBgRhvHuCxPM=" /></div>

               <input id="resource_skill_id" name="resource[skill_id]" type="hidden" value="1" />
                <div class="control-group string required"><label class="string required control-label" for="resource_title"><abbr title="required">*</abbr> Title</label><div class="controls"><input class="string required" id="resource_title" name="resource[title]" size="50" type="text" /></div></div>
                <div class="control-group url required"><label class="url required control-label" for="resource_url"><abbr title="required">*</abbr> Url</label><div class="controls"><input class="string url required" id="resource_url" name="resource[url]" size="50" type="url" /></div></div>
                <div class="control-group check_boxes optional"><label class="check_boxes optional control-label">Objectives</label><div class="controls"><label class="checkbox"><input class="check_boxes optional" id="resource_objective_ids_1" name="resource[objective_ids][]" type="checkbox" value="1" />Blah</label><label class="checkbox"><input class="check_boxes optional" id="resource_objective_ids_2" name="resource[objective_ids][]" type="checkbox" value="2" />Blah2</label><label class="checkbox"><input class="check_boxes optional" id="resource_objective_ids_3" name="resource[objective_ids][]" type="checkbox" value="3" />Blah3</label><input name="resource[objective_ids][]" type="hidden" value="" /></div></div>
                <div class="actions">
                  <input name="commit" type="submit" value="Create Resource" />
                </div>
</form><script>//<![CDATA[
if(window.ClientSideValidations==undefined)window.ClientSideValidations={};if(window.ClientSideValidations.forms==undefined)window.ClientSideValidations.forms={};window.ClientSideValidations.forms['new_resource'] = {"type":"SimpleForm::FormBuilder","error_class":"help-inline","error_tag":"span","wrapper_error_class":"error","wrapper_tag":"div","wrapper_class":"control-group","wrapper":"bootstrap","validators":{"resource[title]":{"presence":[{"message":"Can't be blank"}]},"resource[url]":{"format":[{"message":"Invalid URL","with":/^(http|https):\/\/[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(([0-9]{1,5})?\/.*)?$/i}],"presence":[{"message":"Can't be blank"}]}}};
//]]></script>

Not seeing errors messages with simple_form, but can see them with form_for (Rails5 / Devise)

form_for seems to be working completely fine for me, but with the simple_form plugin, I'm not seeing client side validations take effect.

Version of ClientSideValidations:

GIT
  remote: https://github.com/DavyJonesLocker/client_side_validations.git
  revision: 01a0b88d058080d60d6245711bbd6ff964663efe
  branch: rails5
  specs:
    client_side_validations (5.0.0)
      jquery-rails (~> 4.0, >= 4.0.1)
      js_regex (~> 1.0, >= 1.0.9)
      rails (>= 5.0.0.rc2, < 5.1.0)

Version of ClientSideValidations-SimpleForm

GIT
  remote: https://github.com/DavyJonesLocker/client_side_validations-simple_form
  revision: d7f4bdfe11b95d4e899f63cdf4ed78cf2c632100
  branch: rails5
  specs:
    client_side_validations-simple_form (3.3.0)
      client_side_validations (~> 5.0.0)
      simple_form (~> 3.3)

Version of Rails

rails (5.0.0.1)

Code snippet from your model of the validations

class AdminUser < ActiveRecord::Base

  validates :email, presence: true

  devise :confirmable, :database_authenticatable, :recoverable, :registerable,
         :rememberable, :trackable, :timeoutable, :lockable, :timeoutable, :validatable

end

The form code from your template

Sign up

<%= simple_form_for(resource, validate: true, as: resource_name, url: registration_path(resource_name)) do |f| %>
  <%= devise_error_messages! %>

  <div class="field">
    <%= f.label :email %><br />
    <%= f.email_field :email, autofocus: true %>
  </div>

  <div class="field">
    <%= f.label :password %>
    <% if @minimum_password_length %>
    <em>(<%= @minimum_password_length %> characters minimum)</em>
    <% end %><br />
    <%= f.password_field :password, autocomplete: "off" %>
  </div>

  <div class="field">
    <%= f.label :password_confirmation %><br />
    <%= f.password_field :password_confirmation, autocomplete: "off" %>
  </div>

  <div class="actions">
    <%= f.submit "Sign up" %>
  </div>
<% end %>

<%= render "admin_users/shared/links" %>

The resulting HTML along with the script tag


<!DOCTYPE html>
<html>
  <head>
    <title>RockThePatchv4</title>
    <meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="3lhhnNIfCPmrtANrza0MjiUFSuHTo836EPeM5QhnstOyTWJKplHUY1PoI295hDrcwfWXGmzWLsPzI8gLX1D1Og==" />

    <link rel="stylesheet" media="all" href="/assets/base/_colors.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/base/_fonts.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/base/_globals.self-88463f8a2cfcccbe6eaf06c0c01de27ba7532b188301ad3451c98bb5d9d2ff47.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/base/_mixins.self-e98949a9e163a2985d229801711b65bd78dae878894386ddd23c6023a4d677c8.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/base/_variables.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/bootstrap/_overrides.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/forms/base_form.self-be812009a8e681a653f9697fad8c6c6acc07d13db44eb03c6ec617820256da45.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/forms/forgot-password-form.self-ebf93e496b7b614a16d6c8a6cf4a72675dd06838514d5e6584060adfff773cef.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/forms/forgot-username-form.self-49ded2553544e535083b910890ab3d9a5ff1d179e3184028df5e1883fbd09c68.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/forms/login_form.self-1c96046a0a18604e8a6de66f7427741dfc96ae9283d04149a1b553a189122f0f.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/forms/password-reset-form.self-946eaad4444cad84fe50883d3fe936f813b3cc35402fe5c442db840df71a9ed2.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/forms/registration_form.self-90adc4d78623a7c3a123a804a0b10d2417ecd230b3b4243a60ca12ce134fc7a6.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/forms/resend-confirmation-form.self-ffa48f8472aea7d24ebbfd5de0905a316cfa816468c5c40b4b67d659b54def77.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/layouts/_container.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/layouts/_footer.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/layouts/_header.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/modules/flash.self-3613e68ebd86c235b5246a09e5829be3fe4f5483f78a0ee0dd772619e382aba7.css?body=1" data-turbolinks-track="reload" />
<link rel="stylesheet" media="all" href="/assets/application.self-5ba6c6379b450e21bcb99669ac7e99dd4ff1d2e813d05d3e0c08d971615b86b7.css?body=1" data-turbolinks-track="reload" />
    <script src="/assets/jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/jquery_ujs.self-784a997f6726036b1993eb2217c9cb558e1cbb801c6da88105588c56f13b466a.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/rails.validations.self-98c2768ab2a3093d0e5b8cb558b96a31dca03f2bbc82b6f8682d3830bebb720a.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/rails.validations.password_complexity.self-fe342f3d1e341c028bbeb1dd06173371eae2d8e0c93688c3b5020b02dae1c1a0.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/rails.validations.simple_form.self-e781a2ebba41b673c8d3f2e4b5c38504fca848d01bcf75fd6ec09fad2bb0dbee.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/transition.self-6ad2488465135ab731a045a8ebbe3ea2fc501aed286042496eda1664fdd07ba9.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/alert.self-742145c5bb847aafdadc6e339be795628f8bc25f177e851f03a8c42278eb0312.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/button.self-126ac9bf0e7f2d8568f8da3a00fd5f0fac6eae0946331003370161fbf8d7975e.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/carousel.self-e47323f363ceb3dc0bdbce05e36e709ed428e339833a41140a85cb0af24b8127.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/collapse.self-2eb697f62b587bb786ff940d82dd4be88cdeeaf13ca128e3da3850c5fcaec301.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/dropdown.self-561cca1cbaf67474e01e9536f106bad541594860a6df997004591c1c1957a147.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/modal.self-3e78617ade5663314b7ee0ea10375a5b34d59ffbade44939e3f2a4e4ef2019b3.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/tab.self-5bf7078b682f8b131332eefa46b45fa5eff2eca745fc0d03e2991450888f7c28.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/affix.self-6d6f1a7fc5c8aabf3547fa1b794fab6268f54bc55ad815e55873c71f52513517.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/scrollspy.self-969f3c5f48cdf1e439c7fa1154c13b948715f5c689f87837c0b64521d3b46ef6.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/tooltip.self-05afb177e08f98997ccfc84fa08a215e4b27d48d5fe4d049080675e9dffd8199.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap/popover.self-0aa93860b59fe7393f1dd490f54b3cb994f9d6155adffce034d4e14ae361b041.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/bootstrap-sprockets.self-fbfa5ad7d9aa0afe439ec4ff3883acc4cb92b62cb67c40d674320c9aa1d4642d.js?body=1" data-turbolinks-track="reload"></script>
<script src="/assets/application.self-4d37d7bcf4b0b32507438063ae47ba88dd0178863f7c7a2c7125b221eefea772.js?body=1" data-turbolinks-track="reload"></script>
  </head>

  <body>
    <div class="center-text">
</div>

    <h2>Sign up</h2>

<form data-validate="true" novalidate="novalidate" class="simple_form new_admin_user" id="new_admin_user" action="/authorized" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="yjZe9cj+MdB/HKwjfQNMQK7BIAKhd/LIbBp0PffulGK5UcDlQ0vX74uvtMbYSBzQ1adnUN2H4RQ2z9aQQXnKtg==" />


  <div class="field">
    <label class="email required" for="admin_user_email"><abbr title="required">*</abbr> Email</label><br />
    <input autofocus="autofocus" type="email" value="" name="admin_user[email]" id="admin_user_email" />
  </div>

  <div class="field">
    <label class="password optional" for="admin_user_password">Password</label>
    <em>(8 characters minimum)</em>
    <br />
    <input autocomplete="off" type="password" name="admin_user[password]" id="admin_user_password" />
  </div>

  <div class="field">
    <label class="password optional" for="admin_user_password_confirmation">Password confirmation</label><br />
    <input autocomplete="off" type="password" name="admin_user[password_confirmation]" id="admin_user_password_confirmation" />
  </div>

  <div class="actions">
    <input type="submit" name="commit" value="Sign up" data-disable-with="Sign up" />
  </div>
</form><script>
//<![CDATA[
if(window.ClientSideValidations===undefined)window.ClientSideValidations={};window.ClientSideValidations.disabled_validators=["uniqueness"];window.ClientSideValidations.number_format={"separator":".","delimiter":","};if(window.ClientSideValidations.patterns===undefined)window.ClientSideValidations.patterns = {};window.ClientSideValidations.patterns.numericality=/^(-|\+)?(?:\d+|\d{1,3}(?:\,\d{3})+)(?:\.\d*)?$/;if(window.ClientSideValidations.forms===undefined)window.ClientSideValidations.forms={};window.ClientSideValidations.forms['new_admin_user'] = {"type":"SimpleForm::FormBuilder","error_class":"error","error_tag":"span","wrapper_error_class":"field_with_errors","wrapper_tag":"div","wrapper_class":"input","wrapper":"default","validators":{"admin_user[email]":{"presence":[{"message":"can't be blank"}],"format":[{"message":"is invalid","with":{"source":"^[^@\\s]+@[^@\\s]+$","options":"g"},"allow_blank":true}]},"admin_user[password]":{"length":[{"messages":{"minimum":"is too short (minimum is 8 characters)","maximum":"is too long (maximum is 128 characters)"},"allow_blank":true,"minimum":8,"maximum":128}]}}};
//]]>
</script>
  <a href="/authorized/login">Log in</a><br />



  <a href="/authorized/confirmation/new">Didn&#39;t receive confirmation instructions?</a><br />

  <a href="/authorized/unlock/new">Didn&#39;t receive unlock instructions?</a><br />



  </body>
</html>

With simple form:

With form for:

Initializer:

ActionView::Base.field_error_proc = Proc.new do |html_tag, instance|
  unless html_tag =~ /^<label/
    %{<div class="form-error">#{html_tag}<label for="#{instance.send(:tag_id)}" class="message">#{instance.error_message.first}</label></div>}.html_safe
  else
    %{<div class="form-error">#{html_tag}</div>}.html_safe
  end
end

Custom wrapper at the form level

When creating an identical wrapper as the default simple_form wrapper but with an added class the form level wrapper assignment won't work.

simple_form_for @something, wrapper: :some_wrapper do |f|
end

however, when setting it directly on the element it does work

f.input :something, wrapper: :some_wrapper

it seems to only affect select elements.

The errors I'm getting is that client side validations is not able to find the elements

Uncaught TypeError: Cannot read property 'remove' of undefined

Uncaught TypeError: Cannot read property 'add' of undefined

ClientSideValidations.formBuilders.SimpleForm::FormBuilder.remove rails.validations.simple_form.js?body=1:20
form.ClientSideValidations.removeError rails.validations.js?body=1:178
(anonymous function) rails.validations.js?body=1:243
window.ClientSideValidations.callbacks.element.pass rails.validations.js?body=1:632
_ref.element:validate:pass.ClientSideValidations

date_field not validating

Is there a way to get it validate against the new rails date_field?

= f.date_field :purchase_date,  validate: { presence: true}

id not validating properly

validation of radio_button doesn't seem to work

Hi, the validation of radio_button doesn't seem to work
view.html.haml

- form
  = p.input :written_employment_contract, :as => :radio_buttons, :collection => [ ['Oui', true], ['Non', false] ], :validate => true

rendered view

<div class="control-group radio_buttons required">
  <label class="radio_buttons required control-label"><abbr title="requis"></abbr> Contrat de travail écrit *</label>
  <div class="controls">
    <label class="radio">
      <input class="radio_buttons required" id="procedure_written_employment_contract_true" name="procedure[written_employment_contract]" type="radio" value="true">Oui
    </label>
    <label class="radio">
      <input class="radio_buttons required" id="procedure_written_employment_contract_false" name="procedure[written_employment_contract]" type="radio" value="false">Non
    </label>
  </div>
</div>

model.rb

validates :written_employment_contract, presence: :true, if: lambda { |procedure| procedure.current_form_step == 4}

rails (3.2.10)
client_side_validations (3.2.1)
client_side_validations-simple_form (2.0.1)
simple_form (2.0.4)

I don't get the data-validate="true" on the inputs
No validation is triggered :s

Please, can you help me

DEPRECATION WARNING: input method now accepts a `wrapper_options` argument.

from /lib/client_side_validations/simple_form/form_builder.rb:29

DEPRECATION WARNING: input method now accepts a wrapper_options argument. The method definition without the argument is deprecated and will be removed in the next Simple Form version. Change your code from:

    def input

    def input(wrapper_options)

Bootstrap support

First of all great work on making this work with simple_form 2.0.

When using twitter bootstrap though it doesn't seem to be working as intended.

This is the wrapper that I'm using for bootstrap.

config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
    b.use :html5
    b.use :placeholder
    b.use :label
    b.wrapper :tag => 'div', :class => 'controls' do |ba|
      ba.use :input
      ba.use :error, :wrap_with => { :tag => 'span', :class => 'help-inline' }
      ba.use :hint,  :wrap_with => { :tag => 'p', :class => 'help-block' }
    end
  end

As you can see it hast 2 divs, the error class is being added to the inner one, altough it only works on the outter one. To remedy this I changes the lines 17 and 18 on the rails.validations.simple_form.js from:

wrapper = element.closest(settings.wrapper_tag);
wrapper.addClass(settings.wrapper_error_class);

to:

wrapper = element.closest(settings.wrapper_tag + " .controls");
wrapper.parent().addClass(settings.wrapper_error_class);

Is this the intended behavior?

While using the :autofocus => true option, validation is too eagerly triggered.

The validation is triggered if I click anywhere on the page. In fact, if I click on a link it tries to validate the auto focused field first. Then a second click will work. If I take the autofocus option out, then everything works as expected. What is going on here? Any ideas?

Thanks!!

client_side_validations (at master) is not yet checked out. Run `bundle install` first.

after running bundle update and try to run rails console i have this error
(rails server working fine)

git://github.com/DavyJonesLocker/client_side_validations.git (at master) is not yet checked out. Run `bundle install` first.

and bundle install don't change nothing
-----gemfile-----

gem 'client_side_validations', github: 'DavyJonesLocker/client_side_validations'
gem 'client_side_validations-simple_form', github: 'DavyJonesLocker/client_side_validations-simple_form'

simple_nested_form_for

I managed to get client side validations working with the following gems.

client_side_validations (3.2.0.beta.6)
client_side_validations-simple_form (2.0.0.beta.1)
simple_form (2.0.3)

Next I added nested_form to the mix.

nested_form (0.2.3)

To use nested_form, I had to use simple_nested_form_for instead of simple_form_for. However, once I did that, the client side validations stopped working for the parent object. I get errors like:

Uncaught TypeError: Cannot call method 'add' of undefined    rails.validations.js:13

Line 13 in rails.validations.js is this:

return ClientSideValidations.formBuilders[settings.type].add(element, settings, message);

So it seems ClientSideValidations.formBuilders[settings.type] is now undefined.

After some digging around and just to try my luck, I duplicated this block in my `app/assets/javascripts/rails.validations.simple_form.js':

ClientSideValidations.formBuilders['SimpleForm::FormBuilder'] = {...};

and changed only the first line to:

ClientSideValidations.formBuilders['NestedForm::SimpleBuilder'] = {...};

Now client side validations work for the parent object. Client side validation for the child object does not work but that is fine for me at the moment.

Obviously this is a hack, so I guess I'll submit this to you in hopes of getting a proper fix.

Simpleform 2.0

Simpleform is approaching its 2.0 final release, I guess we should put some effort into supporting it. This guy got it working with some simple hacks, can we continue from there?

Add a initializer/config to apply :validate => true to all simple_form.

Bundler could not find compatible versions for gem "simple_form"

I'm seeing the following issue when I attempt to bundle:

Fetching git://github.com/DavyJonesLocker/client_side_validations.git
Fetching git://github.com/DavyJonesLocker/client_side_validations-simple_form.git
Fetching gem metadata from https://rubygems.org/.........
Resolving dependencies...
Bundler could not find compatible versions for gem "simple_form":
  In Gemfile:
    client_side_validations-simple_form (>= 0) ruby depends on
      simple_form (~> 3.1) ruby

    simple_form (3.1.0.rc2)

Next, I have following within my Gemfile:

gem 'simple_form',              '~> 3.1.0.rc2'
gem 'client_side_validations', github: 'DavyJonesLocker/client_side_validations'
gem 'client_side_validations-simple_form', github: 'DavyJonesLocker/client_side_validations-simple_form'

Validations on select input are not working

Hello. Thanks for the great gem.
I have a country select input with include_blank: true. In my model, I have validates :country, presence: true, allow_blank: false
But client side validations are being skipped for this select input.
Am I missing something?

validations coming from server may result in double error messages

CSV version: 3.2.1
CSV simple form plugin version: 2.0.0
rails version: 3.2.6
bootstrap version: 2.1.0

Scenario: A form with some client-side validations, and some server-only validations. Using lastest CSV, with bootstrap and SimpleForm plugin.

Model:

class User < ActiveRecord::Base

  attr_accessor :current_password
  validate :some_inline_validation
  validate_presence_of :current_password

  def some_inline_validation
    errors[:current_password] << "fail"
  end
end

Template

<%= simple_form_for @user, validate: true, :html => { :class => 'form-vertical' } do |f| %>
  <%= f.input :current_password , validate: true%>
<% end %>

Fill in fields to pass all client side validations.
submit
page is re-rendered with some validation errors that come from the server
choose one of the fields showing a server-side validation error, and enter another invalid value
Result: there will be two error message elements, one that was rendered by the server, and a second one inserted by CSV.

The issue appears to be in the form builder add function:

        add: function(element, settings, message) {
          var errorElement, wrapper_class_element, wrapper_tag_element;
          if (element.data('valid') !== false) {
            wrapper_class_element = element.closest("." + settings.wrapper_class);
            wrapper_tag_element = element.closest(settings.wrapper_tag);
            wrapper_class_element.addClass(settings.wrapper_error_class);
            errorElement = $("<" + settings.error_tag + "/>", {
              "class": settings.error_class,
              text: message
            });
            return wrapper_tag_element.append(errorElement);
          } else {
            return element.parent().find("" + settings.error_tag + "." + settings.error_class).text(message);
          }
        },

The error element is added iff element.data('valid') is true. It doesn't check whether the element already exists in the from even if data('valid') is false.

Working on a pull request which gets rid of the element.data() test. I'm not sure I understand why that test is needed. In the default form build from the main project, you do this data check, but you also check that the error element doesn't exist. Then the error text is set in either case, not in the else {} block as here. That logic is safer, though I'm not sure why it should bother looking at the data['valid'] flag at all in that case, since it does the find() any way. Thinking this is cleaner:

errorElement = find(...)
if( errorElement is null) {
  errorElement = create errorElement
  form.insert errorElement
}
errorElement.text = errorMessage

ActionView::Template::Error (undefined method `client_side_form_settings' for nil:NilClass)

Hi there
i just updated to client_side_validations (3.2.0) and now i get this error:
undefined method `client_side_form_settings' for nil:NilClass

it occurs in the method client_side_form_settings() (in the form_helper-module)
this seem to happen because the options-hash does not contain a :parent_builder-key so in line 91 (builder = options[:parent_builder]) builder is set to nil. Then it's all downhill from there on.

i'm using simple_form 2.0.4 and rails 3.0.13

thanx a lot for giving a hint, what maybe wrong here

Devise

I can't got it work with Devise. There is any special configuration to get it work with Devise?

Simple form association is not being validated by rails clientside validation

My version of rails is 3.2.9
client_side_validations (3.2.1)
client_side_validations-simple_form (2.0.1)
client_side_validations (> 3.2.0)
simple_form (> 2.0.3)

I have a model User

class User < ActiveRecord::Base
  validates :goal, :presence => true, :on => :update
  belongs_to :goal, :class_name => Goal, :foreign_key => "goal_id"
  ...
end

and on the form i have

<%= simple_form_for @users,:remote => true, :url => registration_path(resource_name), :html => { :method => :put, :multipart => true }, :validate => true do |f| %>
 <%= f.association :goal,:label => "My overall goal is clearing", :input_html => {:class => 'goals'},:include_blank => true %>

But the rails client side validation does not pick up the validation on the association, it lets me fill in blank for goal.

Does rails client side validation gem work for simple form association?

The html page is

<div class="input select required"><label class="select required control-label" for="user_goal_id"><abbr title="required">*</abbr> My overall goal is clearing</label><select class="select required goals" id="user_goal_id" name="user[goal_id]" data-validate="true"><option value=""></option>
<option value="1">JEE Main</option>
<option value="2">JEE Advanced</option>
<option value="3">NEET</option>
<option value="4">CBSE 11 PCM</option>
<option value="5">CBSE 11 PCB</option>
<option value="6">CBSE 12 PCM</option>
<option value="7">CBSE 12 PCB</option></select></div>

I am getting the below script on my html page

if (window.ClientSideValidations == undefined) window.ClientSideValidations = {};
if (window.ClientSideValidations.forms == undefined) window.ClientSideValidations.forms = {};
window.ClientSideValidations.forms['edit_user_14'] = {
    "type": "SimpleForm::FormBuilder",
    "error_class": "error",
    "error_tag": "span",
    "wrapper_error_class": "field_with_errors",
    "wrapper_tag": "div",
    "wrapper_class": "input",
    "wrapper": "default",
    "validators": {
        "user[mobile_number]": {
            "format": [{
                "message": "should be 10 digits",
                "with": /^\d{10}$/i
            }]
        },
        "user[profile_pic]": {
            "integrity": [{
                "message": "translation missing: en.activerecord.errors.models.user.attributes.profile_pic.integrity"
            }],
            "processing": [{
                "message": "translation missing: en.activerecord.errors.models.user.attributes.profile_pic.processing"
            }],
            "download": [{
                "message": "translation missing: en.activerecord.errors.models.user.attributes.profile_pic.download"
            }],
            "format": [{
                "message": "Wrong file format",
                "with": /\.(gif|jpeg|jpg|png)$/i,
                "allow_blank": true
            }]
        }
    }
};

uniqueness validation not working rails 4

I am using this gem and all works fine but the validation client with uniqueness in the model don't work, I don't know if I missed something. In the model

class Category < ActiveRecord::Base
    has_many :has_categories
    has_many :articles, through: :has_categories
    validates :name, presence: true, uniqueness: true, length: { minimum: 2 }  

end

my form:

<%= form_for(@category, validate: true) do |f| %>
  <% if @category.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@category.errors.count, "error") %> prohibited this category from being saved:</h2>

      <ul>
      <% @category.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :name %><br>
    <%= f.text_field :name  %>

  </div>
  <div class="field">
    <%= f.label :color %><br>
    <%= f.color_field :color %>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

Simple form + Bootstrap + Rails 5 support not available

Hi,
Client side validation not working here I used following gems
gem 'bootstrap-sass', '> 3.3', '>= 3.3.6'
gem 'simple_form', '> 3.2', '>= 3.2.1'
gem 'client_side_validations', github: 'DavyJonesLocker/client_side_validations', branch: 'rails5'

Please provide the support of Rails 5
If I only used gem 'client_side_validations', github: 'DavyJonesLocker/client_side_validations', branch: 'rails5' but still I got error Cannot read property 'add' of undefined and Cannot read property 'remove' of undefined

Bundling issues with Rails 5.0.0.1

I have this in my gemfile:

gem 'rails', '> 5.0.0', '>= 5.0.0.1'
...
gem 'simple_form', '> 3.3.1'
gem 'client_side_validations'
gem 'client_side_validations-simple_form'

I have this error:

client_side_validations (= 4.2.7) was resolved to 4.2.7, which depends on
rails (< 4.3.0, >= 4.0.0)

Do you have any plan to support 5.0.0 soon?

Client side validation prevented the submit but no error turns up.

I have a check boxes validation problem

here is my html code

<div class="control-group check_boxes required"><div class="controls"><label class="checkbox"><input class="check_boxes required" id="questionnaire_session_answers_attributes_1_content_555" name="questionnaire_session[answers_attributes][1][content][]" type="checkbox" value="555" data-validate="true">555</label><label class="checkbox odd"><input class="check_boxes required" id="questionnaire_session_answers_attributes_1_content_444" name="questionnaire_session[answers_attributes][1][content][]" type="checkbox" value="444" data-validate="true">444</label><label class="checkbox"><input class="check_boxes required" id="questionnaire_session_answers_attributes_1_content_333" name="questionnaire_session[answers_attributes][1][content][]" type="checkbox" value="333" data-validate="true">333</label><label class="checkbox odd"><input class="check_boxes required" id="questionnaire_session_answers_attributes_1_content_222" name="questionnaire_session[answers_attributes][1][content][]" type="checkbox" value="222" data-validate="true">222</label><label class="checkbox"><input class="check_boxes required" id="questionnaire_session_answers_attributes_1_content_111" name="questionnaire_session[answers_attributes][1][content][]" type="checkbox" value="111" data-validate="true">111</label><input name="questionnaire_session[answers_attributes][1][content][]" type="hidden" value=""></div></div>

Client side validation prevented the submit but no error turns up.

Doesn't work with some default wrappers

DavyJonesLocker/client_side_validations#594

The problem is that apparently simple_form moved from wrappers.bootstrap to wrappers.*

Apparently the default is :vertical_form but there are other wrappers

As a temporary workaround, I suggest to add this coffee file to the javascript asset pipeline (please note that your wrapper could be different from vertical_form)

ClientSideValidations.formBuilders['SimpleForm::FormBuilder'].wrappers.vertical_form =
  add: (element, settings, message) ->
    errorElement = element.parent().find "#{settings.error_tag}.#{settings.error_class}"
    if not errorElement[0]?
      wrapper_tag_element = element.closest(settings.wrapper_tag)
      errorElement = $("<#{settings.error_tag}/>", { class: settings.error_class, text: message })
      wrapper_tag_element.append(errorElement)
    wrapper_class_element = element.closest(".#{settings.wrapper_class}");
    wrapper_class_element.addClass(settings.wrapper_error_class)
    errorElement.text(message)
  remove: (element, settings) ->
    wrapper_class_element = element.closest(".#{settings.wrapper_class}.#{settings.wrapper_error_class}")
    wrapper_tag_element = element.closest(settings.wrapper_tag)
    wrapper_class_element.removeClass(settings.wrapper_error_class)
    errorElement = wrapper_tag_element.find("#{settings.error_tag}.#{settings.error_class}")
    errorElement.remove()

Probably this plugin needs some extra love

No settings

I’m using simple_form with Twitter bootstrap.

When I try to validate there’s an error on line 19 when settings.validators are passed as an argument. On line 11 settings are assigned window.ClientSideValidations.forms[form.attr('id')];. Unfortunately window.ClientSideValidations.forms is an empty object in my case, so the settings will be undefined. I also couldn't figure out where in the code the forms object is supposed to get populated.

Can you help me out?

Inline error not displaying with bootstrap appended/prepended input field

ClientSideValidations v. 3.2.1
Rails v. 3.2.10

Validation code in model:

validates :total_amount, presence: true

Form code:

<%= f.input :total_amount, wrapper: :prepend do %>
  <%= content_tag :span, "$", class: "add-on" %>
  <%= f.input_field :total_amount, class: "input-small" %>
<% end %>

The script tag:

<script>//<![CDATA[
if(window.ClientSideValidations==undefined)window.ClientSideValidations={};if(window.ClientSideValidations.forms==undefined)window.ClientSideValidations.forms={};window.ClientSideValidations.forms['edit_note_300'] = {"type":"SimpleForm::FormBuilder","error_class":"help-inline","error_tag":"span","wrapper_error_class":"error","wrapper_tag":"div","wrapper_class":"control-group","wrapper":"bootstrap","validators":{"note[total_amount]":{"presence":[{"message":"can't be blank"}]}}};
//]]></script>

The resulting HTML before error:

<div class="control-group decimal required">
  <label class="decimal required control-label" for="note_total_amount">
  <abbr title="required"></abbr> Total amount</label>
  <div class="controls">
    <div class="input-prepend">
      <span class="add-on">$</span>
      <input class="numeric decimal required input-small" id="note_total_amount" name="note[total_amount]" type="text" />
    </div>
  </div>
</div>

The resulting HTML after error:

<div class="control-group decimal required">
  <label class="decimal required control-label" for="note_total_amount">
  <abbr title="required"></abbr> Total amount</label>
  <div class="controls">
    <div class="input-prepend">
      <span class="add-on">$</span>
      <input class="numeric decimal required input-small" id="note_total_amount" name="note[total_amount]" type="text" />
      <span class="help-inline">can't be blank</span>
    </div>
  </div>
</div>

Notice how the help-inline span is placed within the input-prepend div and so it isn't displayed properly on the page.

However, if the help-inline span is placed after the input-prepend div, (within the controls div), it works as intended:

<div class="control-group decimal required">
  <label class="decimal required control-label" for="note_total_amount">
  <abbr title="required"></abbr> Total amount</label>
  <div class="controls">
    <div class="input-prepend">
      <span class="add-on">$</span>
      <input class="numeric decimal required input-small" id="note_total_amount" name="note[total_amount]" type="text" />
    </div>
    <span class="help-inline">can't be blank</span>
  </div>
</div>

As expected, the same problem occurs with an appended input field.

Error when wrapper class contains multiple classes

E.g.:

Simple form config

config.wrappers :vertical_form, tag: 'div', class: 'form-group form-group-lg', error_class: 'has-error' do |b|

Generated javascript

"wrapper_class":"form-group form-group-lg"

Wrong code

wrapper_class_element = element.closest(".#{settings.wrapper_class}");

Refers to: DavyJonesLocker/client_side_validations#609

this gem not compatible with - gem 'client_side_validations', github: 'DavyJonesLocker/client_side_validations', branch: 'rails5'

Get this error when doing bundle update with this gem:
Bundler could not find compatible versions for gem "client_side_validations":
In Gemfile:
client_side_validations
client_side_validations-simple_form was resolved to 1.5.0, which depends on
client_side_validations (~> 3.2.0)
When i use the standard gem of client_side_validations with rails 5.0.0.rc1 and ruby 2.3.1 it gives me "alias_method_chain is deprecated. Please, use Module#prepend instead." When I went to "gem 'client_side_validations', github: 'DavyJonesLocker/client_side_validations', branch: 'rails5' " it fixed my deprecation warning. But, then isn't compatible with this version of client_side_validations-simple_form. Using Macbook air 10.11.4. with gem 'devise', github: 'plataformatec/devise', branch: 'master'

Support for Rails 4 and Simple Form 3

Are there plans to update the dependencies of this gem?

unable to validate for "uniqueness: true"

Hi,

I need some advise, When I type some email that is already taken, somehow it didnt validate via AJAX. Only when I submit the form only it will work.

Below is my code:

In client model

validates :email, presence: false, uniqueness: true

not fully compatible with twitter bootstrap

For example, the red coloring of the error messages and label borders is missing. What needs to happen is an "error" class is added here:

<div class="control-group string required error">

Rails engine generator and loading issues

When running the generator inside an engine I get the following message

 bundle exec rails g client_side_validations:install

[WARNING] Could not load generator "generators/client_side_validations/install_generator". Error: undefined method `config' for nil:NilClass.
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/railties-4.2.5.1/lib/rails.rb:44:in `configuration'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/client_side_validations-4.2.1/lib/generators/client_side_validations/copy_assets_generator.rb:14:in `asset_directory'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/client_side_validations-4.2.1/lib/generators/client_side_validations/copy_assets_generator.rb:34:in `installation_message'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/client_side_validations-4.2.1/lib/generators/client_side_validations/copy_assets_generator.rb:37:in `<class:CopyAssetsGenerator>'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/client_side_validations-4.2.1/lib/generators/client_side_validations/copy_assets_generator.rb:3:in `<module:Generators>'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/client_side_validations-4.2.1/lib/generators/client_side_validations/copy_assets_generator.rb:2:in `<module:ClientSideValidations>'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/client_side_validations-4.2.1/lib/generators/client_side_validations/copy_assets_generator.rb:1:in `<top (required)>'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/activesupport-4.2.5.1/lib/active_support/dependencies.rb:274:in `require'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/activesupport-4.2.5.1/lib/active_support/dependencies.rb:274:in `block in require'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/activesupport-4.2.5.1/lib/active_support/dependencies.rb:240:in `load_dependency'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/activesupport-4.2.5.1/lib/active_support/dependencies.rb:274:in `require'
/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/client_side_validations-4.2.1/lib/generators/client_side_validations/install_generator.rb:1:in `<top (required)>'

Seems like this is blowing up here because a Rails application doesn't exist. A workaround I found was to return early from the installation_message method.

Now the issue I'm having (which is why I'm posting in this repo) is that I can't seem to load client_side_validations-simple_form gem from the engine. I've added it as a dependency in the gemspec and tried to require it within the Engine.

module MyEngine
  class Engine < ::Rails::Engine
    require 'simple_form'
    require 'client_side_validations'
    require 'client_side_validations-simple_form'

    isolate_namespace MyEngine

  end
end

rails g client_side_validations:copy_assets

/Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/activesupport-4.2.5.1/lib/active_support/dependencies.rb:274:in `require': cannot load such file -- client_side_validations-simple_form (LoadError)
    from /Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/activesupport-4.2.5.1/lib/active_support/dependencies.rb:274:in `block in require'
    from /Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/activesupport-4.2.5.1/lib/active_support/dependencies.rb:240:in `load_dependency'
    from /Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/activesupport-4.2.5.1/lib/active_support/dependencies.rb:274:in `require'
    from /Users/patrick/dev/integral/lib/integral/engine.rb:6:in `<class:Engine>'
    from /Users/patrick/dev/integral/lib/integral/engine.rb:2:in `<module:Integral>'
    from /Users/patrick/dev/integral/lib/integral/engine.rb:1:in `<top (required)>'
    from /Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/railties-4.2.5.1/lib/rails/engine/commands.rb:11:in `require'
    from /Users/patrick/.rbenv/versions/2.3.0/lib/ruby/gems/2.3.0/gems/railties-4.2.5.1/lib/rails/engine/commands.rb:11:in `<top (required)>'

Using rails 4.2.5.1
Using client_side_validations 4.2.1
Using client_side_validations-simple_form 3.2.1
Using simple_form 3.2.1

Thanks in advance!