Hi @Tom_Warfield.
This does not require Developer Mode, but you may need to upgrade your plan to enable Code Injection.
A basic example would be like this:
<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>
You would add this to your website's Footer by going to Settings > Advanced > Code Injection.
You would need to further develop this example for a good user experience as the form button would do nothing until the user had added content to our specific input. But in principle, this would be a good starting point.
No easy way for that from JS side - SS wrote code in manner you can't really access it or affect, and all masonry calculations goes in code.
But damn, that's a simple CSS, nothing complex:
Michael-Mashai got a reaction from MarlonA in Filtering in 7.1
Michael-Mashai reacted to summitdigitaluk in Custom form validation (intercepting the form submission)
Michael-Mashai got a reaction from BBLDN in How to Adjust to 2 columns in Masonry Grid in Mobile View in Squarespace 7.1
