Wishlist Code (Part 2, Dec. 2017)


Tutorial Video

Create a short list, wish list or even a favorite's list is very popular on different web apps. You can also create things like: vote for this item, collect an item, and more. Code Queen Nayeli reveals the code to create a private wix wishlist for your site members. Watch as she walks you step by step on how to modify the code to fit your website. This tutorial uses a custom database with items, but this method can be used for any of the other database collections, such as Wix Stores.



Follow Along #1

Tutorial Page

https://codequeen.wixsite.com/wishlistpart2


Good to Know #1

The Code to display Member saved Items on the Wish List Page


Be sure to watch the tutorial video above to understand the code and how to modify it.



import wixUsers from 'wix-users';
import wixData from 'wix-data';

$w.onReady(function () {
    getfilters();

});

function getfilters() {
 let user = wixUsers.currentUser;
 let userId = user.id;
    console.log(userId);
    wixData.query("wishlist")
        .eq("userId", userId)
        .find()
        .then((results) => {
 let items = results.items;
 let firstItem = items[0];
 var prod = [];
 var i = 0;
            console.log(results.length);
 var vf = results.length;
 while (i < vf) {
                console.log(i);
                prod[i] = items[i].productId;
                console.log(items[i].productId);
                i = i + 1;
                console.log(prod[i]);
            }
            console.log(prod);
            $w("#favorites").setFilter(wixData.filter()
                .hasSome("name", prod)
            );
        });
}
        


Good to Know #2

The Code for Dynamic Item Page


Be sure to watch the tutorial video above to understand the code and how to modify it.



import wixUsers from 'wix-users';
import wixData from 'wix-data';
let user;
var userID;
let itemObj;
var product_name;

$w.onReady(function () {
    $w("#Itemdetails").onReady(() => {
        product_name = $w("#text31").text;
    });

    user = wixUsers.currentUser;
    userID = user.id;
 let isLoggedIn = user.loggedIn;
 if (isLoggedIn === true) {
        $w("#Itemdetails").onReady(() => {
            testwish(product_name);
        });

    } else {
        wixUsers.promptLogin();
    }
});

function testwish() {
 let userId = user.id;
    wixData.query("wishlist")
        .eq("productId", product_name)
        .eq("userId", userId)
        .find()
        .then((results) => {
 let count = results.totalCount;
 if (count === 0) {
                $w("#addtowishlist").label = "ADD TO WISH LIST";
            } else {
                $w("#addtowishlist").label = "REMOVE FROM WISH LIST";
            }
        });
}

function dothewish() {
 let userId = user.id;
    wixData.query("wishlist")
        .eq("productId", product_name)
        .eq("userId", userId)
        .find()
        .then((results) => {
 let items = results.items;
 let firstItem = items[0];
 let count = results.totalCount;
 if (count === 0) {
 let toSave = {
 "productId": product_name,
 "userId": userId
                };
                wixData.save("wishlist", toSave);
                $w("#addtowishlist").label = "REMOVE FROM WISH LIST";
            } else {
                wixData.remove("wishlist", firstItem._id);
                $w("#addtowishlist").label = "ADD TO WISH LIST";
            }
        });
}

export function addtowishlist_onclick() {
    dothewish(product_name);
}
    

Author

by Code Queen


Stuck on a project? Hire Code Queen, LLC!

Schedule a phone call or video call directly online. In a different time zone? No problem! Code Queen currently has clients around the world.


Online Booking: Discovery Session

Contact Form: Send project details

286 views0 comments

disclaimer

a quick note about our website content

Our free and premium content is non-exclusive, meaning you are not the only one with access to the content. You can customize our content to fit your end product. Redistribution of our content is strictly prohibited. This means you cannot make our content available to others as-is, stand-alone products or stock products in ANY LANGUAGE, regardless if you offer our content for free or not.