Member Registration Issues

Hello,

I’m wondering if someone could help look at my registration code. My website sends the information to the contacts page in the CRM and the form submission dataset, but it is not registering a member. My members setting is set to “anyone can join,” so the registration should go through automatically, but as of now, the only way I can register members is to do it manually through the contacts setting: set contact as members.

I also tried to do the registration on the back end, which is preferable because it is more secure, but I couldn’t get that to work either. So I tried to rely on the front-end code in good faith that the security is intact because of the “anyone can join” setting as noted in the documentation.

I am familiar with Java but haven’t worked with much JavaScript and the WIX / Velo API is new to me.

I’ve been all over the WIX API documentation for weeks and still cannot get it to work. I realize it’s probably a small error, but I can’t seem to find it.

I don’t have any acquaintances who do any sort of coding so I really have no one else to show my code.

I really, really appreciate any help!!

The code follows:

 $w.onReady(function () {

    $w('#submitButton').onClick(
        () => {
            let firstName = $w('#firstNameField').value;
            let lastName = $w('#lastNameField').value;
            let email = $w('#emailField').value;
            let dateOfBirth = $w('#dateOfBirthField').value;
            let country = "US-";
            let state = $w('#dlStateField').value;
            let dlNumber = $w('#dlNumberField').value;
            let password = $w('#passwordField').value;
            var applicationType =     findApplicationType($w('#newOrUpgrade').selectedIndex);
            let tprStateCode = country + state;
            let termsCheckbox = $w('#termsCheckbox').checked;
            emails.push(email);

            let radioIndex = $w('#newOrUpgrade').selectedIndex;

            console.log("Radio index is " + radioIndex);

            function findApplicationType(radioIndex) {

                if ((radioIndex === 0) || (radioIndex === 1)) {
                    applicationType = "new";
                    newOrUpgrade.push(applicationType);
                } else if (radioIndex === 2) {
                    applicationType = "upgrade";
                    newOrUpgrade.push(applicationType);
                } else if (radioIndex === 3) {
                    applicationType = null;
                    newOrUpgrade.push(applicationType);
                }

                console.log("valueAppType after the function is: " + applicationType);
                return applicationType;
            }

            console.log("application type outside the function is " + applicationType);

            let options = {
                contactInfo: {
                    "firstName": firstName,
                    "lastName": lastName,
                    "First name": firstName,
                    "Last name": lastName,
                    "Email": emails,
                    "dlState": state,
                    "dlNumber": dlNumber,
                    "applicationType": applicationType,
                    "dateOfBirth": dateOfBirth,
                    "tprStateCode": tprStateCode,
                },
                privacyStatus: 'PRIVATE'
            }

            console.log("Contact info was assigned" + options);

            /****************************
             * Page code - registration *
             ****************************/

            // ...

            authentication.register(email, password, options)
                .then((registrationResult) => {
                    const status = registrationResult.status;
                    console.log("Registration status: " + status)
                    if (status === "PENDING") {
                        // When the site is configured for manual approval,
                        // status is "PENDING" and approvalToken is returned.
                        const status = registrationResult.status;
                        console.log('Member registered and waiting for approval:', registrationResult);
                    } else {
                        // When the site is configured for automatic approval,
                        // status is "ACTIVE" and the member is approved and logged in.
                        // To prevent logging in the member automatically,
                        // use the backendend function: wix-members-backend.authentication.register()
                        console.log('Member registered and logged in:', registrationResult);
                    }
                    wixLocation.to('domain.com/profile')
                })
                .catch((error) => {
                    console.error(error);
                });

If it helps, here’s the error logs from the site preview:

The error logs from the live site follow, first the google logger and then the error from the firefox inspect window:

From what I can tell, I have two issues. The first is “i is undefined”. this might be caused by my radio buttons or maybe the email. From what I understand, the email needs to be passed as an array. However, both of these elements seem to be transferring to my contact and to the form submissions collection without any problems.

The other issue I see is “the current user does not have permission to read from the member collection”. However, I don’t see how I am trying to read from the member collection at all… is this referring to the registration promise?

My signup settings are shown below:

and here are screenshots from my contacts page:

I’ve been stuck for a while now so any help is much appreciated!!

*Edited to remove my company name from the code.

I was able to get assistance from the Wix Velo customer service team.

For the sake of other people who run into this same issue, I will leave this post up and copy their response below.

I think the biggest issue I had was that I was not using the correct keys for my options. This led me down a rabbit hole, causing me to try to fix the error with a new collection which also did not work and caused additional issues. Finally, the use of the built in “submit” button has a work flow attached to it, so I had to remove that button and just use a regular button.

It’s important to note that the keys are not the same as the column names and some of the keys are not visible in the contacts form.


Greetings!

This is Kateryna from Wix Team. Thank you for reaching out to us with your concern regarding the code functionality on your website.Â

Firstly, I am sorry to hear that you are experiencing this inconvenience.

I had a brief look at your CreateAccountForm lightbox setup, and could see4 that you have added onClick event handler to the built-in Wix Forms submit button.

Kindly note that Wix Forms default button already has its built-in click event flow, therefore, even if you add code, it would only be executed after the main flow runs.Â

The main flow of the custom sign up form, created with Wix Forms, is to take the values from the form fields (not including the regular input fields that you have added from the Add panel), register the new member and close the lightbox.

Once the lightbox is closed, its page code stops running, which means that your code might not be finished by the time registration is completed, and the code would be aborted.

To fix the flow, remove the built-in Submit button, replace it with the regular button from the Add panel, and apply code to it. Frontend register() API automatically logs the user in and closes the lightbox, if the approval is set to automatic.

Besides, your contactInfo object is not of the correct format. Please, make sure all properties are matching the ones, mentioned in the API documentation . If you are using custom fields, make sure you are using the correct keys (you can find custom fields’ keys with the queryExtendedFields () API.

Finally, the Members database permissions error is coming from the Read & Write dataset in your lightbox:

Deleting the connection to this collection removed the error “the current user does not have permission to read from this collection”. this collection was only made because I was having issues, so I didn’t need it anymore.


To obtain the correct keys, I ran the following code from a back end module using the little “play” button on the left:

Code:

import { contacts } from ‘wix-crm-backend’ ;

/* Sample options value:

  • {
  • suppressAuth: true
  • }
    */

const queryResults = contacts . queryExtendedFields (). find ();
// Handle the error

export function myqueryExtendedFieldsFunction () {

return contacts . queryExtendedFields ()
. find ({
suppressAuth : false
})
. then (( results ) => {
if ( results.items.length > 0 ) {
const items = results.items ;
const firstItem = items [ 0 ];
const pageSize = results.pageSize ;
const hasNext = results . hasNext ();
const hasPrev = results . hasPrev ();
const length = results.length ;
const query = results.query ;

    **return**  items ; 
  }  **else**  { 
    // Handle case where no matching items found 
  } 
}) 
. catch (( error ) => { 
  console . error ( error ); 
}) 

}

/* Returns items:

  • [
  • {
  • "_createdDate": "2021-03-30T12:41:13.000Z", 
    
  • "_updatedDate": "2021-03-30T12:41:13.000Z", 
    
  • "displayName": "Event we met at", 
    
  • "key": "custom.event-we-met-at", 
    
  • "dataType": "TEXT", 
    
  • "namespace": "custom", 
    
  • "fieldType": "USER_DEFINED" 
    
  • },
  • */

I had to do some modification to my custom collection names because my code didn’t like the keys with dashes in them. But once I go that all worked out and swapped out the buttons, the registration started working correctly.

hope this can help someone else experiencing what I did :slight_smile: