Rails client_side_validations inside a bootstrap modal - ruby-on-rails

I'm trying to add the gem client_side_validations to my application. It works pretty fine if I go to something like controller/new, but, inside a bootstrap modal, it simply does nothing.
I inspected the HTML and it does not add the data-validate attribute. What should I do to fix this?

I just figured it out. In my coffeescript call, I do something like:
$('.modal').on 'shown', ->
$(this).find('input:visible:first').focus().end().find('form').enableClientSideValidations()
This focus the first visible input, and enable the client side validations on the form.

The above solution did not work for me however the following did! Not sure why but if you find the same as me it might be your answer...
$(document).on('shown.bs.modal', function () { $(ClientSideValidations.selectors.forms).validate(); });

Related

Detecting onChange event of Select2 in EasyAdmin

I am using EasyAdmin Bundle, which seems to use Select2 for internal select form fields. I am trying to capture the onChange event, but I cannot figure out why the following code does not work:
$('#mySelect2Id').on('change', function () {
console.log($(this).value());
})
Unfortunately, I cannot see anything within the console when I change the value of a Select2. Has someone experienced similar issues? Thanks for your help.
I have fixed myself.
It looks like the problem appears if you import jquery in webpack, together with EasyAdminBundle.

Wicegrid pagination and filters not working after AJAX update

I have a wicegrid that I update via AJAX(based on the value selected by a drop down). Problem is that after the update, the filters and pagination stops working on left-mouse click(works on right click!). Does anyone have any idea why this is happening?
I have used wicegrid on a number of pages in the same project(without AJAX update), and this issue does not appear.
Try this (assuming you use jquery):
$( document ).ajaxComplete(function() {
put code you want to run;
});
probably your script is not working because it's in document.ready scope.
I had the same issue and found a straightforward workaround for this issue - call the initWiceGrid() function after you refresh the grid.

RoR sort/scope/filter via button

I came across this site:
https://tutorials.railsapps.org/rails-tutorial
And was wondering if someone could explain how the buttons would be set up to filter?
I guess I'm curious also - is an object being displayed and filtered? What is going on here?
What you're seeing is not Rails but Javascript.
When you click the 'Beginner' button, it has an attribute data-toggle="Beginner" and uses javascript to show only the elements below that have a class Beginner.
It would look something like this using jQuery in coffeescript:
$('.filters li[data-toggle]').on 'click', ->
toggle = $(this).data('toggle')
$("div.tutorial:not(.#{toggle})").hide()
$("div.tutorial.#{toggle}").show()
To serve up the html classes would be Rails' job.

document.ready(function(){ ... vs document.on('pagecreate', function(){

first of all I try to use proper "language" but I am not a programmer. That said...
I don't seem to be able to get jquery mobile to work properly.
When I try to change document.ready(function() { ... })
to
document.on('pagecreate', function(){ ... })
I do not get the same result; in fact I cannot even alert a simple message.
Furthermore I would like to use mousedown and mousedown events. The documentation of jquery mobile tells me that I could use vmousedown and vmouseup. Does not work either. Can someone enlighten me please. the jquery mobile.js is added lastly in my script structure of the dom.
Maybe relevant for others with a similar problem.
Linking to the jquery CDN instead of hosting the files myself solved my problem.

Override client_side_validations behavior to validate hidden fields

I am using the client_side_validations gem with Rails 3.1.0. I have been trying to use it to validate a hidden field that is set through a javascript widget. From what I have read on the gem's github page, the gem deliberately does not validate hidden fields because the user could not correct these fields. I have unsuccessfully tried to override this behavior.
Is there a way to override this behavior for a particular field without modifying the client_side_validations code (other than the init stuff that gets generated when you install the gem)?.
The way I've done it now is by making a slight modification to the validateForm function in the gem. When it looks for the fields to validate it only grabs the elements that are visible:
form.find(':input:enabled:visible[data-validate]').each(function()
So I changed that to this:
form.find(':input:enabled[data-validate]').each(function()
This seems to work. Is there a better way?
I haven't been able to re-validate the hidden field when the user corrects their mistakes.
If you want to validate hidden fields that is how to do it
#mushroom asked about client_side_validations version 3.1, but for anyone using version 3.2.x, this is now configurable.
This code on 3.2-stable branch shows how it's done.
You will need to override window.ClientSideValidations.selectors.validate_inputs and window.ClientSideValidations.selectors.inputs once the page loads. As for including validations for the hidden element in the hash, my recommendation is to load the page with the element visible, and immediately run $('#id_of_hidden_element').attr('type', 'hidden').
Alternatively, you can just make the input element type='text' and use opacity:0 in a CSS stylesheet to make it invisible. Note that this has other side-effects, such as making it focusable.
I think better way is validate it by adding 'id' or 'class'
<input type="hidden" id="validate_me">
then selector should be like this:
':input:enabled:visible[data-validate], #validate_me'

Resources