How can I add a specific data entry on a form submission?

Ask the community
,
1

Okay so what I’m trying to do should be pretty simple, but I’m getting stuck and can’t seem to find an answer. I have a custom form on my site, connected to a database, and one of the fields in that database needs to change to a very specific text input when the user submits the form. But I can’t seem to get it to work. I’m currently trying to use the beforeUpdate hook and manually telling it what the text input should be for that one field, but that didn’t seem to work.

The reason I need this is that I need the label on a button to change, after they submit the info (and update the database). And the label on the button is connected to a field in the same database. The button first will say “create event”, and after they click it, they go to the page where they can create their event (it’s kind of a social media thing, easiest way to explain without too much backstory). But then after they create their event, I want the button to change to “View Event”. And of course I’ll also be changing the link on the button using a data field as well, but for now I’m just trying to change the name on the button, to understand how this would work.

Here’s what I tried. I’m sure it’s totally wrong, so any help is appreciated. “hostPrompt” is the field name in my collection for what will be on the button label. I simply want to force that field to be updated to “View Event” when the user updates the collection, and in the same row that was updated.

I was going off of the example in this article: https://www.wix.com/velo/reference/wix-data/hooks/beforeupdate

export function Events_beforeUpdate(item, context) {
    let hookContext = context;

    item.hostPrompt = "View Event"

    return item;
}

P.S. I tried to find where I could specify this as a “question” and not a discussion (as I was advised to do on my previous post) but I didn’t see an option this time, just “create new post”. So I apologize if I’m posting in the wrong place again.

2

To change the label of the button , do something like this:

$w("#button").label = "View Event";

You can also change, the hostPrompt collection field so that next time the page is loaded it will have the button label that correctly reflects the current status.

3

Thanks for the advice! The only problem I would see with this is that it needs to be automatically done when the user submits the form. I have the button label connected to the collection field because I was hoping to be able to change the field in code after they submit the form, which would then change the button label.

Any suggestions on what code I would use (and where) to change that collection field to say “View Event” after they submit the form?

Thank you!

4

Also I should clarify the button is on a different page from the form.

The page with the button looks like this:

1035×569 14.6 KB

I have it in a repeater displaying their orders (a key aspect of each order is setting up an event to go along with it). The button is connected to my “Events” collection, specifically the hostPrompt collection field, which defaults to “create event”.

After they click it they go to another dynamic page where they “create” their event, by inputing information and clicking submit at the end. I would like to make it so that when they submit the information, the hostPrompt collection field in the same row that they submitted info to gets changed to “View Event”. That way when they go back to their orders page, it will say View Event next to any orders where they have already created an event.

Not sure if that context helps, but thought I’d throw it in.

5

@jbelt40 Aha - context always helps…

When the visitor goes back to the orders page from the dynamic page, the Repeater should refresh and display as you want.

Is the submission form connected to the collection with a dataset? To ensure that the hostPrompt field is updated, you should use setFieldValue() .

6

@yisrael-wix Yeah the submission form is connected to a data set. It’s just a custom page with some input fields and a submit button.

So for setFieldValue, would I trigger that with an “onClick” function for when the submit button is clicked? It feels like there should be a way to trigger it for when the form submission is successful, just in case there’s a failure. But I don’t know how I would set that up in the code. I also don’t know how to make sure it’s updating the same row that has all the info the user just submitted.

What do you think?

7

@jbelt40 What do I think? I think I need a beer. But it’s not even 8 in the morning so…

You can add a Dataset onBeforeSave() event handler in which you can set the hostPrompt field with setFieldValue() . Something like this:

$w("#dataset1").onBeforeSave( () => {
    $w("#dataset1").setFieldValue("hostPrompt", "View Event");
    console.log("Continuing save");
    return true;  // true means continue to save
} );

Now, to look forward to my liquid lunch.