Contact form : alert messages position and dismissing the modal

1 reply · opened Nov 21, 2017

KKigenStudioNov 21, 2017

Hello,

I'm using the contact form in modal (contact-5-recaptcha) on my website and it works fine.
However :

  • the alert message for success or error shows for a few seconds only in a small box in the upper right corner of the screen. Is there a way to choose its position (for example it would be more visible centered on the screen), or maybe put the message directly inside the modal above the form ?
  • in case of success, when the alert success message fades out, is it possible to automatically dismiss the contact modal so that the user doesn't need to close the empty contact form by himself ?

Thank you,

Kevin

SSemicolon WebSTAFFDec 4, 2017

Hello,

Thanks for your Patience!

  1. Unfortunately, it is not possible to show the Alert in the center of the Screen due to CSS constraints. However, it is definitely possible to display the Message to appear above the Form. You can simply add the data-alert-type="inline" Attribute to the .contact-widget Element.

  2. This is Definitely Possible. Simply find the following code in the js/function.js File inside the contactForm: function() Function Block:

if( $(form).find('.g-recaptcha').children('div').length > 0 ) { grecaptcha.reset(); }
if( data.alert != 'error' ) { $(form).clearForm(); }

and replace it with:

if( $(form).find('.g-recaptcha').children('div').length > 0 ) { grecaptcha.reset(); }
if( data.alert != 'error' ) { $(form).clearForm(); }
$('#contactFormModal').modal('hide');

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard