Hide the form once review is submitted

The confirmation message is loaded inside the form.

The only way to do this is to add your own custom javascript event listener and listen for a successful review submission. There you can add your own custom logic to hide the form fields.

For example:

document.addEventListener( "site-reviews/after/submission", function( ev ) {
    if( false !== ev.detail.errors )return;
    // This is the form element: ev.detail.form
    // Hide the form fields here
});

• This reply was modified 6 years ago by Gemini Labs.

Thanks,

Awesome plugin, awesome support !

Happy to help. Please do consider leaving a review for the plugin if you find it useful! ??

Sorry, where does that code go (which file, which line)?

@kuailelaowai The code is javascript, it is a javascript event that is triggered on a successful review form submission. In order to use it, you will need to add it to a javascript file that is loaded by your website.

Also, the code does not include the logic to hide the form fields, you will have to provide that yourself.

Hello
please anybody can help me with this code how to use it
Thank you

@mohamedtaman If you are not familiar with writing javascript, an easier solution might be to redirect the page on a successful review submission instead.

You can do this in the unreleased (but stable) v3.0 beta. Instructions on how to upgrade to the v3.0 here: https://pastebin.com/raw/Mgr28aJs

Once you are using v3.0, please go to the Site Reviews > Documentation > FAQ tab for instructions on how to redirect the page after a form has been submitted.

If you do not want to redirect and are set on hiding the form instead, here is some sample code to use to get you started.

CSS

.glsr-form {
    opacity: 1;
    transform: scaleY(1);
    transform-origin: top left;
}
.glsr-form-hidden {
    opacity: 0;
    height: 0px !important;
    transform: scaleY(0);
    transition: opacity 0.5s ease-in-out,
                transform 0.5s,
                height 0.5s;
}

Javascript

document.addEventListener( "site-reviews/after/submission", function( ev ) {
    if( false !== ev.detail.errors )return;
    ev.detail.form.parentNode.appendChild(
        ev.detail.form.querySelector( '.glsr-form-message' )
    );
    ev.detail.form.style.height = ev.detail.form.offsetHeight + 'px';
    window.requestAnimationFrame(function() {
        ev.detail.form.classList.add( 'glsr-form-hidden' );
    });
});

If you still need help after this with your custom code, I strongly suggest that you find a developer who can help you as it falls outside the scope of Site Reviews support.

• This reply was modified 5 years, 12 months ago by Gemini Labs.
• This reply was modified 5 years, 12 months ago by Gemini Labs.
• This reply was modified 5 years, 12 months ago by Gemini Labs.
• This reply was modified 5 years, 12 months ago by Gemini Labs.

Thank you for this code! Works great and the transition looks smooth ???????? @geminilabs