JamesonW

Thanks @jpeter - after your updated code and killing some other code elsewhere in the site - it seems to be working!!

Thanks @jpeter, I really appreciate all this help! Looks like that edit did have a positive effect! The form logic works! But for some reason, I'm only seeing it work through my Backend account. As in, at this time it doesn't seem to appear to function on the live version of the site? I tried clearing my cache but no luck. I also tested on Mobile and no luck. But we're getting somewhere! See video below https://www.leanagilesensei.com/contact Form Logic Test.mov

Thank you, but still no luck. I replaced the code in the FOOTER section within the Code Injection section of the site and nothing changed 😞

Thank you so much! I hoped/thought as much

Hi there, For some reason, my conditional logic coding randomly stopped working a couple of weeks ago. I am attempting to do the same idea as this thread: Within the How did you hear about us? field, if a user selects the "Referral" radio button, a Name (first and last), should appear. If a user selects "Other", then a field "Specify" a text field appears. Again this was working up until a month ago or so (the client believes). I've attempted a couple of different fixes and code changes, and I've successfully hidden the fields, but now cannot get the conditional logic to fire. Hoping for some help from the Squarespace crew! Webpage: https://www.leanagilesensei.com/contact In the Code Injection section of the site, I have: In HEADER: <style> #name-yui_3_17_2_1_1600810502501_7975, #text-yui_3_17_2_1_1603146836044_49833 { display: none; } </style> FOOTER: <script (function(){ // The value of the "id" HTML attribute of the parent HTML element var PARENT_ID = 'radio-yui_3_17_2_1_1603146836044_50638'; // The value which will determine the visibility of the DEPENDENT_ID element var PARENT_VALUE = ['Referral', 'Other']; // The value of the "id" HTML attribute of the child HTML element. // This field will hide/show depending on the PARENT_VALUE var DEPENDENT_IDS = [ 'name-yui_3_17_2_1_1600810502501_7975', 'text-yui_3_17_2_1_1603146836044_49833' ]; /********************************************************************* * DO NOT ALTER BELOW THIS LINE UNLESS YOU KNOW WHAT YOU'RE DOING *********************************************************************/ // Initialize after the page has been loaded if (document.readyState === 'complete') { init(); } else { document.addEventListener("DOMContentLoaded", init, false); } function init() { // Load jQuery if not loaded if(!window.jQuery) { return loadJquery(init) } // Assign jQuery to a variable var $ = jQuery; // Get the parent element var $parentField = $('#' + PARENT_ID); // Create ID CSS selectors based on the DEPENDENT_ID. var ids = DEPENDENT_IDS.map(id => '#' + id); ids.forEach(id => { // Get the dependent element var $dependentField = $(id); // Hide the text field on page load $dependentField.hide(); }); // Show or hide the dependent field based on the PARENT_VALUE $parentField.on('change', function(evt){ if(PARENT_VALUE.includes(evt.target.value)) { $(ids.join(',')).slideDown(); } else { $(ids.join(',')).slideUp(); } }); } function loadJquery(init) { var s = document.createElement('script'); s.src = 'https://code.jquery.com/jquery-3.6.0.min.js'; s.integrity = 'sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4='; s.crossorigin = 'anonymous'; s.onload = init; document.body.appendChild(s); }; })(); </script>

Was having the same issue with a Flash of colour between page movement/page loading. Found a solution: Under Site Styles, Colours, I selected the Theme that was seemingly "Flashing" whenever moving around the site from page. I then changed the Theme's Section Background and Background Overlay to White, and Transparent. This solved my issue!! I actually did it to two themes as they were both the same light blue. Hope this helps!

Which part of the scrip is used to designate the field that requires validation? I have a client that wants to validate a text field to only have states/provinces in a two Capital letter format. <script> //Specific form button to disable/re-enable const buttonToDisable = document.querySelector('[data-form-id="5ecfda33f13530766af10f1d"] input[type="submit"]'); //Add 'disabled' attribute to the form button buttonToDisable.disabled = true; //Specific form input which needs custom validation let inputToValidate = document.querySelectorAll('[data-form-id="5ecfda33f13530766af10f1d"] input.text')[0]; //Listen for changes to our input inputToValidate.addEventListener('input', function(e) { //Do your validation on every keystroke. //A basic example below. You could use a JS library for more complex validate. if(this.value) { //A value has been entered, re-enable button and continue with standard Squarespace submission buttonToDisable.disabled = false; } }); </script>