Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Hi, is it possible to show something like a check when a user succesfully inputs a field? This is known to increase conversions. Thanks!
Comments
Comment #1
Jelle_SYou can achieve this like so:
my_module.module:
my_module.js:
I hope this helps :-)
Comment #2
remkovdz CreditAttribution: remkovdz commentedWow, seems to work indeed, thanks a lot!
If I may ask for a tiny favor: is it also possible to have the check appear instantly when the input is valid. Right now, it appears when moving out of the field. Also it would be great if this could be assigned to specific forms.
But thanks again, this works great already!
Comment #3
attiks CreditAttribution: attiks commentedTurning this into a feature request, so we can see if we can add it and allow override per form.
Comment #4
remkovdz CreditAttribution: remkovdz commentedGreat.
Comment #5
remkovdz CreditAttribution: remkovdz commentedGreat! In that case you might also be interested to know this particular approach (I just copied the above code) doesn't apply a red border to fields which could not be validated.
Comment #6
leanderl CreditAttribution: leanderl commentedHey! Thanks one million times for this! I've been working all day to get this to work and this solves it!
Comment #7
sandboxplYep, it's great, thanks a lot too ;)
I've added new lines to toggle classes of validated inputs,
in my case it helps to style elements for browser w/o css3 support:
Comment #8
remkovdz CreditAttribution: remkovdz commentedAre you planning on implementing this module-wide? I mean: this code works fine for simple input, but I think it should also consider email validation etc.? Also, please see #5 and config per form would be awesome.
I think this would be a great feature of this module.
Comment #9
attiks CreditAttribution: attiks commentedIf somebody can provide a patch, I'm more than happy to review or guide.
Comment #10
doxigo CreditAttribution: doxigo commentedso is there a possibility to have this as a feature in module itself ?
Comment #11
lamp5Now you have error class and valid class and you can style your form elements what you want.