Allow members to create private lists from existing database?

Ask the community
, ,
1

I have a non-dynamic page displaying a searchable database table with 2 dropdowns and a search bar. I would like to create the ability for each member to search that table, then export a row to their own private list in their profile i.e. Click on a row of the table to add it to their own “wish list”.

I was thinking something like have a read/write collection that is populated by a form, but instead of the form being filled in by the user, it is automatically filled in with the information from the table when the row is clicked, and the user submits it with a button to confirm. Then, in the member profile, display the data but only let users see their own inputs = private list.

I haven’t found anything like this so far, so not sure how to go about it. I don’t have “code” to share since I only have the searchable database right now.

Thanks!

2

I have created the following scenario that is working roughly but giving me a big problem:

  • Created a new Collection
  • DblClick the information in the original table, it is added to the new collection
  • The collection is read/write with members as authors, members can only read content that they author.
  • This populates a table in the profile

export function resultsTable_dblClick ( event ) {
let toInsert = $w ( “#dynamicDataset” ). getCurrentItem (); //gets the current item
wixData . insert ( “MemberWishList” , toInsert ) //inserts the item
. then ( ( results ) => {
console . log ( “done adding item” )
} )
. catch ( ( err ) => {
let errorMsg = err ;
} );

}

The dblClick event works to add the item, but if a member adds the item to the MemberWishList they are the only ones who can read it. If another member wanted to add that same item to the database, it doesn’t generate a second entry that they own or let them see the other entry etc. So essentially, if one person has the item in their wishlist, no one else can.

I have the database table generated on a dynamic page and a non-dynamic. That doesn’t seem to affect anything.

I have looked at all the wish list tutorials, including Code Queen and there has not been a good solution for this particular thing. I even found a post from 2019 about this exact issue with no resolution so I am hoping someone can take a look and see what’s going wrong.

3

Ok you mention a row-select-functionality, but i do not see that you use it!

So how to generate your wished function?

Your SETUP would/should be:

  1. 1xDatabase → Here you store your ITEMS/VALUES!
  2. 1xDataset —> connected to your DB & to your TABLE!
  3. 1x TABLE → this element is used to get the right data by —> CLICK!

Function:

  1. click on a ROW of the TABLE!
  2. getting DATA of the wished ROW out of the connected DB by a DATASET.
  3. The same way it also could be a REPEPERATER instead of a TABLE.
  4. Or you use the REPEATER as RESULT-OUTPUT, also possible!

EXAMPLE: (yes i have already a running example) :grin: take a look here…

https://russian-dima.wixsite.com/login-system/vnloginmgm

  1. Login by using one of the given predefined login-data.

989×53 4.71 KB

After you have logged in, you will be able to navigate to

  1. Navigate to BADGES…

452×712 70.1 KB

The Badge-Management-System will open…

1013×970 183 KB

  1. Click on → "Show Badge-Overview —> Badge-Overview will appear…

839×392 66.7 KB

Ok! Here we are! You have a table in front of you including some Badges generated by the BADGE-GENERATOR! But what does it has to do with your project?

  1. Click on one of the rows inside TABLE and take a look onto CONSOLE! You will find something like this one…

Do you already recognize similarity?

Now take a look onto the running CODE…

//--------------------------------------------------------------------------------
    $w('#table1').onRowSelect(async(event)=>{rowData=undefined;
        $w('#imgLoadingMembership, #grpMiniInfo').show('fade', {duration:350});
        let rowIndex = event.rowIndex; console.log("Row-Index: ", rowIndex); 
        let msbID = Number($w('#msbBadge').currentState.id); console.log("Current-State: ", msbID);
        rowData = event.rowData; console.log("Row-Data: ", rowData);
        badgeID = rowData.roleId; $w('#input0').value = badgeID;
        $w('#btnDeleteBadge, #btnEditBadge, #btnMembership').enable();  
        $w('#imgBadgeIcon'+msbID).show();
        $w('#imgPreview, #imgBadgeIcon'+msbID).src = rowData.icon.uri;
        $w('#boxBadgeColorWix, #boxBadgeEmblem'+msbID+', #boxBadgeIcon'+msbID).style.backgroundColor = rowData.backgroundColor;
        $w('#txtBadgeTitle, #txtBadgeTitle'+msbID).html=`<b><p style="color:${rowData.textColor};text-align:center; font-size:20px">${rowData.title}</p></b>`;
        //---------------------------------------
        generate_BadgeMemberlist(badgeID).then(async(memberlist)=>{console.log("Members: ", memberlist);
            $w('#txtMiniInfo').text = "loading data . . ."
            let memberListLength = await memberlist.badgeMembers.length;        console.log("Memberlist-Length: ", memberListLength);
            $w('#txtMemberships').text = String(memberListLength);
            $w('#imgLoadingMembership, #grpMiniInfo').hide('fade', {duration:350});
        });     
    });

Ok, surely not the best example → so let’s break the code down in pieces and inspect it a little bit…

$w.onReady(()=>{
	$w('#table1').onRowSelect((event)=>{console.log("EVENT: ", event);
		let rowIndex = event.rowIndex; console.log("Row-Index: ", rowIndex);
		let rowData = event.rowData; console.log("Row-Data: ", rowData); 
	});
});

With this 6-simple code-lines, you should be able to make your own project running!
Take a look onto CONSOLE and inspect the OUTPUT !
Do not forget to connect your TABLE with your wished DATABASE by a DATASET!
Paste the provided code onto your page and do some testings, while monitoring the OUTPUTS in CONSOLE!