FortWest

Site URL: https://www.joyrx.org/livestream-live I have added a very simple form block to a page of my site. The form only has one field — to enter a simple text message — with a "submit" button (see screenshot below). I'm looking for a solution that allows users to type a message, submit the form, and have the form auto-refresh without having to reload the page. Basically, I need users to be able to submit the form multiple times without reloading the page. Is there a solution for this? I have tried adding the following script to Website Tools > Code Injection > Footer: <script> $('button[type=submit]').on('click', function () { checkSubmitSuccess($(this).parent().parent()) }); function checkSubmitSuccess(formElement) { console.log(formElement) var i = 0; while (i < 10) { (function (i) { setTimeout(function () { if ($(formElement).hasClass("react-form-contents--submitted")) { console.log("Hereee") i = 10 window.location.reload() } }, 1000 * i) })(i++) } } </script> This script is not working for me. It looks like I'm getting a syntax error (see screenshot below). I'm not sure how to fix this to get it to work (refresh the form on "submit," not the page). Any help would be very much appreciated!

@tuanphan Wondering if you would be able to help? Thank you so much!

Thank you, @tuanphan! I've put this into the footer (see screenshot), but it doesn't appear to be working for me. Does this look right to you? Looks like there may be a syntax error, but I'm not sure how to fix it. Here is the live page: https://www.joyrx.org/livestream-live Thank you very much for your help!

Checking in @tuanphan. Do you think this is something you can help me with? Thank you!

Hi @tuanphan! Thank you for your response, and appologies for the slow reply (I didn't see a notification). Here is the page where the form is: https://joyrx.squarespace.com/livestream-live Thank you for your help!

@tuanphan You have been really helpful in the past. Are you aware of a solution to this problem? Thank you!

Thank you for the response, Ziggy — Unfortunately that wont work for me. There will be a live stream on the page (via embedded Vimeo), and we need to have a one-way submission form for the viewers to send notes to the live stream performer. So, we need a way for them to be able to submit multiple messages without the page reloading.

I have added a very simple form block to a page of my site. The form only has one field — to enter a simple text message — with a "submit" button. I'm looking for a solution that allows users to type a message, submit the form, and after submit the form auto-refreshes without having to reload the page. Basically, I need users to be able to submit the form multiple times without reloading the page. Is this possible? Thank you for your help!

Thank you, @tuanphan! This is amazing! I implemented this on the site, and it's almost exactly what I'm looking for. I adjusted the font sizes to match what I have on the home page. I think it looks great. I adjusted the left and bottom padding to put the title where I want it to be (to match the home page). However, when I did that, it starts to show the description copy. On the home page, the description copy fades in on hover (as the title moves up). Is that possible? When I adjusted the bottom padding (to get the title to match the home page example), on hover the padding on the bottom of the description text is more than I want (see screenshot). Is there a way to separate those? Lastly, is there a way to control the padding on the right side of the description text? Thank you SO much for your help! You are amazing!

Thank you @tuanphan! The portfolio page is located here: https://www.fortwest.com/work The effect (screen and text reveal) I'm trying to match is on the home page (from screen shot), here: https://www.fortwest.com/ Thank you very much for your help!

Hi @tuanphan I used your CSS to add a subtitle to my portfolio/case studies page– which worked great. It currently looks like this: I'm curious if there is a way to move the to move both the title and the subtext to display over the image on rollover, with a light screen over the image (which is a .gif, if that matters). Positioned like this: As a bonus, it would be amazing if the text could animate in from the bottom up on rollover, with the image zoom and a light screen over the bottom ⅓ of the image (to make the white text pop), but that might be asking too much. Thank you so much all the help and support you provide on this forum!