How can I fix the confirm password field so it doesn't create an account if passwords don't match?

BB_Tech
Excursionist
106 1 6

I have successfully created a field for confirm password, and I get a pop up if the passwords to not match. The only problem is that it will still create an account if the passwords do not match.

 

My current code is 

    <!-- Added BTT Code to Check for password confirmation in shopify... Works but lets user create an account-->
    <script>
      $(function(){
        $('#create_customer').submit(function(e) {     
          if ( $('input[name="customer[password]"]').val() != $('input[name="customer[password_confirmation]"]').val()) {
            e.preventDefault();
            alert('Passwords do not match.');
          }
        });
      });
    </script>
            
    <!-- Added BTT Code to have confirm password -->
    <div class="field"> 
      <input 
        type="password" 
        name="customer[password_confirmation]" 
        id="confirm-password" 
        placeholder= "Confirm Password"
        class
      >
      <label for="confirm-password">
        Confirm Password
      </label>
    </div>
    <!-- Ended BTT Code-->
            
    {%- if form.errors contains 'password' -%}
      <span id="RegisterForm-password-error" class="form__message">
        <svg aria-hidden="true" focusable="false" role="presentation">
          <use href="#icon-error" />
        </svg>
        {{ form.errors.translated_fields['password'] | capitalize }} {{ form.errors.messages['password'] }}.
      </span>
    {%- endif -%}
    <button>
      {{ 'customer.register.submit' | t }}
    </button>
  {%- endform -%}
</div>

 

Is there any simple fix I can add to change this 

Replies 2 (2)

michael-helium
Shopify Expert
365 5 179

For the simplest no-code solution, check out the Customer Fields app. You can use the app's Lite plan to create a password confirmation field on your registration form. Other features on the Lite plan include:

  • Require email verification
  • Allow customers to edit their own name, email, etc.
  • Email notifications for staff for new or edited customers
Michael, COO @ Helium
- Customer Fields ✪✪✪✪✪ (346 reviews)
- Meteor Mega Menu ✪✪✪✪✪ (265 reviews)

becket
Tourist
10 0 2

I have the same problem. Any solutions? Thanks