Jump to content

How to remove a required attribute from form fields in custom code form element

Recommended Posts

Posted

Site URL: https://alphabrook.com/schedule-a-demo

Hello Circle Fam! 

I am trying to remove the required attribute for the last two fields of this form. I've inherited this project and believe the solution lies simply in this block. I have tried removing the "required" class from the "Phone number" & "Who did you hear about us?" field and got errors when I tried to submit. 

Should I be looking for some JS somewhere? 

thanks for your time. Code for form is below: 

<div class="form-wrapper">
  <div class="form-inner-wrapper">
    <form
      data-form-id="5d26158ec61afc0001f875c6"
      data-success-redirect=""
      autocomplete="on"
      method="POST"
      action="https://alphabrook.squarespace.com"
      novalidate=""
      onsubmit="return (function (form) {
  Y.use('squarespace-form-submit', 'node', function usingFormSubmit(Y) {
    (new Y.Squarespace.FormSubmit(form)).submit({
      formId: '5d26158ec61afc0001f875c6',
      collectionId: '5d26156bda9604000120a0e5',
      objectName: 'page-5d26156bda9604000120a0e5'
    });
  });
  return false;
})(this);"
    >
      <div class="field-list clear">
        <fieldset
          id="name-yui_3_17_2_1_1562776951836_3892"
          class="form-item fields name required"
        >
          <legend class="title">
            Name

            <span class="required" aria-hidden="true">*</span>
          </legend>

          <div class="field first-name">
            <label class="caption">
              <input
                class="field-element field-control"
                name="fname"
                x-autocompletetype="given-name"
                type="text"
                spellcheck="false"
                maxlength="30"
                data-title="First"
                aria-required="true"
              />
              <span class="caption-text">First Name</span>
            </label>
          </div>
          <div class="field last-name">
            <label class="caption">
              <input
                class="field-element field-control"
                name="lname"
                x-autocompletetype="surname"
                type="text"
                spellcheck="false"
                maxlength="30"
                data-title="Last"
                aria-required="true"
              />
              <span class="caption-text">Last Name</span>
            </label>
          </div>
        </fieldset>

        <div
          id="text-ff2ef86a-0073-4b3b-9944-055671e9b499"
          class="form-item field text required"
        >
          <label
            class="title"
            for="text-ff2ef86a-0073-4b3b-9944-055671e9b499-field"
          >
            Title

            <span class="required" aria-hidden="true">*</span>
          </label>

          <input
            class="field-element text"
            type="text"
            id="text-ff2ef86a-0073-4b3b-9944-055671e9b499-field"
            aria-required="true"
          />
        </div>

        <div
          id="email-yui_3_17_2_1_1562776951836_3893"
          class="form-item field email required"
        >
          <label
            class="title"
            for="email-yui_3_17_2_1_1562776951836_3893-field"
          >
            Business Email

            <span class="required" aria-hidden="true">*</span>
          </label>

          <input
            class="field-element"
            id="email-yui_3_17_2_1_1562776951836_3893-field"
            name="email"
            type="email"
            autocomplete="email"
            spellcheck="false"
            aria-required="true"
          />
        </div>

        <div
          id="text-yui_3_17_2_1_1591729600967_18937"
          class="form-item field text required"
        >
          <label
            class="title"
            for="text-yui_3_17_2_1_1591729600967_18937-field"
          >
            Company Name

            <span class="required" aria-hidden="true">*</span>
          </label>

          <input
            class="field-element text"
            type="text"
            id="text-yui_3_17_2_1_1591729600967_18937-field"
            aria-required="true"
          />
        </div>

        <fieldset
          id="phone-yui_3_17_2_1_1565015554970_113194"
          class="form-item fields phone"
        >
          <legend class="title">
            Phone Number

            <span class="" aria-hidden="true">*</span>
          </legend>

          <div class="field text three-digits">
            <label class="caption">
              <input
                class="field-element"
                x-autocompletetype="phone-area-code"
                type="text"
                maxlength="3"
                data-title="Areacode"
                aria-required="true"
              />
              <span class="caption-text">(###)</span>
            </label>
          </div>
          <div class="field text three-digits">
            <label class="caption">
              <input
                class="field-element"
                x-autocompletetype="phone-local-prefix"
                type="text"
                maxlength="3"
                data-title="Prefix"
                aria-required="true"
              />
              <span class="caption-text">###</span>
            </label>
          </div>
          <div class="field text four-digits">
            <label class="caption">
              <input
                class="field-element"
                x-autocompletetype="phone-local-suffix"
                type="text"
                maxlength="4"
                data-title="Line"
                aria-required="true"
              />
              <span class="caption-text">####</span>
            </label>
          </div>
        </fieldset>

        <div
          id="text-cf23249f-5a53-4826-bf76-769d3647fe29"
          class="form-item field text"
        >
          <label
            class="title"
            for="text-cf23249f-5a53-4826-bf76-769d3647fe29-field"
          >
            How did you hear about us?

            <span class="" aria-hidden="true">*</span>
          </label>

          <input
            class="field-element text"
            type="text"
            id="text-cf23249f-5a53-4826-bf76-769d3647fe29-field"
            aria-required="true"
          />
        </div>
      </div>

      <div
        data-animation-role="button"
        class="form-button-wrapper form-button-wrapper--align-left"
      >
        <input
          class="button sqs-system-button sqs-editable-button"
          onclick="gtag_report_conversion('https://alphabrook.squarespace.com')"
          type="submit"
          value="Submit"
        />
      </div>

      <div class="hidden form-submission-text">
        <p class="" style="white-space: pre-wrap">
          Thank you, your information has been successfully submitted to
          AlphaBrook. A member of our team will be in touch soon!
        </p>
      </div>
      <div class="hidden form-submission-html" data-submission-html=""></div>
    </form>
  </div>
</div>

 

  • Replies 1
  • Views 1.3k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

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.