Jump to content

Add/Remove Required Attribute To Custom Code

Recommended Posts

Hello,

I'm hoping that someone out there may be able to assist me with getting this configured and working properly. I have a form with a couple of form fields that I have hidden and are coded to only appear based on certain answers from the previous question. For example:

"Lifetime Member?"

Yes = No Follow Up

No = Follow Up

My problem is that all of the information that we are asking requires an answer. I have Jquery installed and running but if I leave the required tag on the hidden fields then people will not be able to submit their answers. So I need to remove the required field from Squarespace but keep it required through Javascript and Jquery only if the questions are showing, if not then they would not be required and folks could submit their answers. I'm not sure if what I am trying to do is possible giving the limitations, but I'm hoping that someone out there may be able to assist me. Below is a copy of the code that I am using:
 

<script>
$('#radio-yui_3_17_2_1_1618750827688_273431 input').click(function() {
      selection = $(this).val();
      if (selection == 'No') {
        $('#date-yui_3_17_2_1_1618750827688_222457').show();
      }
      else {
        $('#date-yui_3_17_2_1_1618750827688_222457').hide();
      }
      });
$('#radio-yui_3_17_2_1_1618755633959_63568 input').click(function() {
      selection = $(this).val();
      if (selection == 'Yes') {
        $('#date-yui_3_17_2_1_1618755633959_64259').show();
      }
      else {
        $('#date-yui_3_17_2_1_1618755633959_64259').hide();
      }
    });
</script>

Link to comment
  • 1 year later...

Hey did you have any luck with this? I'm having the same issue.

 

I've tried using $('id').attr('required', true); and .prop('required, true) but neither of them seem to successfully change the field attributes as I'm still able to submit the form without providing information. 

Link to comment

In addition to adding the required to the field you must also remove the novalidate attribute from the form element.

1088692520_ScreenShot2022-06-07at12_07_40AM.png.fb825d70b12721be482b4b1f9271ea68.png

Use $( 'id' ).attr ( 'required', 'required' ) to set the attribute.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • 9 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.