Okay Community Velo Experts, I need some help this time.
I cant seem to find any post similar to my issue. I have tried multiple ways but nothing seems to work.
Question:
I have a custom members page with a form. I want code to restrict the submitting of the form based on the members paid plan. Each plan has a maximum submissions which is saved in a dataset planLimits. I have tried a few ways to get this to work, but each time it breaks the rest of the code on the page, either the conditional filtering or the submitting.
Any guidence will be greatly appreciated. Am I on the right track ? Happy to pay if it’s all to hard and needs additional work required.
Product:
Wix Members and Wix Paid Plans
What are you trying to achieve:
Restrict the member from submitting the form if they have reached thier plan limit for submissions
What have you already tried:
so many ways to code but keeps breaking
The below code is basically what I need, but cant find the ‘UserPlansCollection’ dataset that will query the members plan, so cant even test the code.
Additional information:
import wixData from 'wix-data';
import { authentication } from 'wix-members-frontend';
import { currentMember } from 'wix-members';
$w.onReady(async function () {
let mID = "";
const isLoggedIn = authentication.loggedIn();
if (isLoggedIn) {
console.log('Member is logged in');
currentMember.getMember()
.then((member) => {
console.log(member);
mID = member._id;
});
}
// some code here to append https:// to user input to submit as correct url field....it works, but not sure it should be placed here
$w('#submitButton').onClick(async function () {
categoryDropDown();
stateDropDown();
// Fetch the current user's plan (this is the code that I am having issues with)
const userPlan = await wixData.query("UserPlansCollection").eq("userId", mID).find();
// Fetch the plan limit from your CMS
const planLimit = await wixData.query("PlanLimits").eq("planId", userPlan.items[0].planId).find();
// Count the number of submissions the user has made
const userSubmissions = await wixData.query("SelfCareDirectory").eq("memberId", mID).count();
// Compare the number of submissions with the plan limit
if (userSubmissions >= planLimit.items[0].maxSubmissions) {
// If the limit is reached, disable the submit button and display a message
$w('#submitButton').disable();
$w('#msg').text = "You have reached your submission limit";
$w('#msg').expand();
} else {
if (mID !== "no") {
if ($w('#uploadButton1').value.length > 0) {
$w('#uploadButton1').startUpload()
.then((UploadFile) => {
let imgurl = UploadFile.url;
let toInsert = {
"categoryOfService": $w('#dropdown20').value,
"typeOfService": $w('#dropdown21').value,
//heaps more elements
};
wixData.insert("SelfCareDirectory", toInsert)
.then((results) => {
$w('#msg').text = "Data saved successfully";
$w('#msg').expand();
})
.catch((err) => {
$w('#msg').text = err;
$w('#msg').expand();
});
})
} else {
$w('#msg').text = "Please choose image";
$w('#msg').expand();
}
}
});
//some dropdown conditional filtering code below (that is very messy but works.
Hey @Dan_Suhr ,
In order to fetch the plan that the user is currently subscribed to, you will need to use the wix-pricing-plans-frontend API. If you want, I’ll provide a code snippet for this logic.
Thanks @Pratham a code snippet should help me sort it. If not I’ll message you and get you to sort it as a paid job
Hey Dan,
I’ve fixed your code, try it out.
I’d recommend that you use the export async function for the Submit button instead of onClickAsync.
You can do this by going to the Button Properties > Event Handlers > onClick()
Make sure that you set the name of the export function to submitButton_click
and not submitButton_click_1 or anything else.
This may add a blank export function to your code. If it does, simply cut it from the code.
import wixData from 'wix-data';
import { authentication, currentMember } from 'wix-members-frontend';
import { orders } from 'wix-pricing-plans-frontend';
var mID;
$w.onReady(async function () {
//checked if logged in, else show log in screen
const isLoggedIn = authentication.loggedIn();
if (isLoggedIn) {
console.log('Member is logged in');
//Get logged in member's ID
const member = await currentMember.getMember();
mID = member._id;
} else {
authentication.promptLogin();
}
});
export async function submitButton_click(event) {
// some code here to append https:// to user input to submit as correct url field.
categoryDropDown();
stateDropDown();
let filters = {
'orderStatuses': ['ACTIVE']
};
//Only show pricing plans that are ACTIVE and not PAUSED / CANCELLED / EXPIRED
const orderlist = await orders.listCurrentMemberOrders(filters);
if (orderlist.length > 0) {
const activePlanId = orderlist[0].planId;
const planLimit = await wixData.query("PlanLimits")
.eq("planId", activePlanId)
.find();
if (planLimit.items.length > 0) {
const maxSubmissions = planLimit.items[0].maxSubmissions
const userSubmissions = await wixData.query("SelfCareDirectory")
.eq("memberId", mID)
.count();
await Promise.all([orderlist, planLimit, userSubmissions]);
if (userSubmissions >= maxSubmissions) {
// If the limit is reached, disable the submit button and display a message
$w('#submitButton').disable();
$w('#msg').text = "You have reached your submission limit";
$w('#msg').expand();
} else {
if ($w('#uploadButton1').value.length > 0) {
$w('#uploadButton1').startUpload()
.then((UploadFile) => {
let imgurl = UploadFile.url;
let toInsert = {
"categoryOfService": $w('#dropdown20').value,
"typeOfService": $w('#dropdown21').value,
//heaps more elements
};
wixData.insert("SelfCareDirectory", toInsert)
.then((results) => {
$w('#msg').text = "Data saved successfully";
$w('#msg').expand();
})
.catch((err) => {
$w('#msg').text = err;
$w('#msg').expand();
});
}).catch((uploadError) => {
let errCode = uploadError.errorCode; // 7751
let errDesc = uploadError.errorDescription; // "Error description"
$w('#msg').text = "Error while uploading image - " + errDesc;
$w('#msg').expand();
});
} else {
$w('#msg').text = "Please choose image";
$w('#msg').expand();
}
}
} else {
$w('#msg').text = "Plan limit for plan ID " + activePlanId + " not found in the database.";
$w('#msg').expand();
}
} else {
$w('#msg').text = "You need to subscribe to an active plan in order to continue";
$w('#msg').expand();
}
}
//some dropdown conditional filtering code below (that is very messy but works.
Thanks so much. You’re a legend @Pratham . Will try this out tomorrow when back in front of the PC.
1 Like
Hi @Pratham just tested the code. It works nearly perfect, but it is not restricting the member based on their current plan. I signed up for a free plan (on a different email account) which allows for 1 listing, but I was able to create more listings.
I can’t find a way to set max listings in the actual plan so have created a dataset called PlanLimits which has the title , planId and listing limit (see screenshot)
I have implemented paid listings solutions before.
We focus on upselling and increasing revenue for the client.
For example, if the site has 3 paid plans then we create 3 members area only pages connected each to a different plan. Then we create a code to check how many listings exist by that Author based on the limit of that page.
On the users dashboard , we usually display the appropriate button based on their plan. Then we add the other buttons somewhere else on the page with some sort of call to action …. “Explore other plans”. “Add more listings” …… etc.
Hey @Dan_Suhr,
There is, in fact a way to set this in the pricing plans itself, by adding the max listings in the plan description. This can be fetched right along the ID of the active plan that the user is subscribed to. However the single biggest downside of this is that you cannot update the max listing count after a user has purchased a plan.
For example, if you have a Gold Plan that lets the user add 5 listings, you can write it in the description - i.e. Max Listings: 5 and the code will fetch this successfully. But if in case you want to update the max listings, to lets say 7 or 10 listings - you can do this by updating the plan description. However this will only apply to the users who have purchased the plan AFTER this update was made. Which means everyone who had initially subscribed to the Gold Plan will still be able to add 5 listings only.
This is why the above method is only recommend if you have fixed counts.
Now your creating a database and storing plan IDs method works well too, and I’ve implemented this before. And the code seems to be fine. So I’d recommend that you check the IDs of your CMS fields. You have two fields in the PlanLimits - maxListings and Listinglimit (so I’m guessing that the IDs should be the same too). But in the code you’ve provided, the id - i.e. maxSubmissions seems to be completely different from these two IDs. So I’d recommend that you do check all your IDs from the database side panel in Dev Mode.
If it still dosen’t work, the only way to make it work is to debug this on the site itself. Shoot me a DM here, we’ll work it out. (:
1 Like
i’m an idiot… forgot I changed the fields to test some other code.
I have lost sleep with the amount of ways I have tried this and gotten 95% of the way. Has been a great learning experiance for me in Velo.
Sometimes the best way to learn is to break stuff…haha
Have changed it back to maxSubmissions
and it all works now.
Can’t thank you enough @Pratham you are a valued community member
I marked your code as a solution.
also @codequeen I understand your reasoning for that set up. I have used that type of code/set up in the past before but wanted to try combine it all to reduce additional pages, because of the types of users that will be members.
Now to finish up the search code.
2 Likes
Ahh great, I’m glad to know it worked out.
And thanks for your kind words, appreciate it! 
1 Like