Custom data in Data Hooks

How to pass in custom data to the context object in a data hook setup?

[Wix Studio Editor]

What are you trying to achieve:
I have a drop down combo box that gives me a value. I need to use that value to retrieve a field from the database. and then I get an id that I would like to store as part of the item taht’s being inserted.

What have you already tried:
I have setup a data hook as follows

export async function CustomPhotos_beforeInsert(item, context) {
    //const selectedComboValue = context.customData.selectedComboValue; // Access custom data from the context

    console.log("THIS IS THE CONTEXT OBJECT ", context);
	//item.memberId = context.customData.memberId;
	item.orderNumber = 1500;
    item.memberId = context.userId;
return item;

And my data hook is connected to a submit button on a page. As part of my submit button I have the following

$w("#submitBtn").onClick(async () => {
const customData = {
                  selectedComboValue: $w('#studentDropDown').value.split(",")[0],
                  memberId: userId

            fetch('/account/_functions/CustomPhotos_beforeInsert', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                body: JSON.stringify(customData)
            .then( (httpResponse) => {
                if (httpResponse.ok) {
                  return httpResponse.json();
                } else {
                  return Promise.reject("Fetch did not succeed");
              } )
              .then( (json) => console.log(json.someKey) )
              .catch(err => console.log(err)); 
        } catch (error) {
            console.error("Error inserting data:", error);


My problem is, how to retrieve the selectedComboValue in my insert hook function.

Additional information:
[Include any other pertinent details or information that might be helpful for people to know when trying to answer your question.]

Hi there,

It seems you are attempting to fetch a data hook, or a http api that is named identical to it. What is your intended purpose with that line of code?

Data hooks are automatically triggered when you add a item through one of the following methods:

  • The insert() function is called.
  • An action is performed on a dataset that inserts a new item into the collection.
  • An item is inserted using the CMS.
  • An item is imported into the Sandbox or Live collection.

By intercepting the item (as you did by setting the order number to 1500) you can use this time to query whatever data you need and store it in the item that is being inserted.

As long as selectedComboValue is a part of the inserted object using one of the methods above you should be able to use it to retrieve any data you need.

the intention is the add some custom data to the context object and then retrieve it in the data hook. The value of that custom data, in this case, comes from a drop down combo box on the UI.

while the hook is not aware of the UI at all, and so I was putting it in the context object.

Does, context.customData. selectedComboValue resolve ?