Input value to a reference field

Ask the community
, , ,
1

Hi all! I am new to wix code and I’m having a hard time trying to figure this one out. Basically, I have two databases: one “members” (member details such as name, age, contact info, etc.) and one “memberships”. Once a member logs in to their account, they have to select which membership they are interested in. I have created a dropdown list input connected to “memberships” database, so that all of the memberships available pop up. Now, here is the problem: I want the membership selected by the member to be stored in the “members” colection, where I have a value called “membership”, which is a reference field (connected to the membership database).
Because of this being a reference field, I am not able to conect the input field to “membership” collumn on “members” collection.

Any work around?

Below is a screenshot of the input:

1127×589 98.9 KB

Many thanks! :slight_smile:

2

Hi there,

You will need to write a bit of code to handle this scenario, basic idea being:

  1. Adding an appropriate event handler to the dropdown (or form submit button if the dropdown is a part of a form).
  2. Getting currently selected value.
  3. Inserting a reference to the selected membership into “membership” field for a certain member.

Here is a rough example of how it may look like:

import wixData from 'wix-data';

$w.onReady(function () {
  $w('#dropdown4').onChange(function(e) {
    const dropdown = e.target;
    const membershipId = dropdown.options[dropdown.selectedIndex].value;
    wixData.update('members', { _id: memberId, membership: membershipId })
      .catch(err => {
        let errorMsg = err;
      });
  })
});

This example assumes that each item of dropdown looks like this:

{label: 'Some Membership', value: membershipId}

You can find more info about working with data api here:

3

Hi Simonas, thank you so much fro your answer! I have been reading through about wixdata and hooks, and I still have along way to go!
I am still confused about certain aspects:

  • I cannot just copy and past what you wrote, right? As you said that this is a rough example. However, I don’t really know what to change in there.
  • When I paste the code on my page, it says that “memberID is undefined”.
  • Also, I’m not sure where should I write the key of the item in the collection that has the membership type.
4

Hi and sorry for the long gap between responses.
Yes, my code was just an example but it shouldn’t be far from what it should actually look like.

When I paste the code on my page, it says that “memberID is undefined”.
You should use WixUsers API to get the id of the current user (the one, that is filling the form) and then update appropriate row in Members collection. It’s similar to the problem described in this thread:
Capturing current user id - Ask a question - Wix Studio Community forum

  • Also, I’m not sure where should I write the key of the item in the collection that has the membership type.
    Can you elaborate? Though, if I understood the question correctly, then the piece of code I pasted does exactly that - grabs id of selected membership and assigns it to appropriate member (aka current user) in Members collection.
5

Hi Simonas. Like I mentioned before, I am very new to wix code, and I am trying to put everything together. As you see below, it is still giving that “memberID is undefined” message.
The “clientType” is the key to the membership column in my collection.
It is still not saving the selected membership in the collection.

What am I missing?

This is the coding I have on my page at the moment:

import wixData from ‘wix-data’;
import wixUsers from ‘wix-users’;

$w.onReady( function () {
//TODO: write your page related code here…
$w(“#wixVisitors1”).hide();
$w(“#columnStrip7”).hide();
$w(“#socialBar2”).hide();
$w(“#mobileMenu1”).hide();

let user = wixUsers.currentUser;

$w(‘#dropdown4’).onChange( function (e) {
const dropdown = e.target;
const membershipId = dropdown.options[dropdown.selectedIndex].value;
wixData.update(‘Members’, { _id: memberId, clientType: membershipId })
. catch (err => {
let errorMsg = err;
});
})
});