Question

How to pass data from Webhook to run Javascript?


Userlevel 1

Hi all

Hoping someone with Javascript expertise can help me out. What I am trying to do is send the final output data into an Airtable field. I have done this in another Zap where the trigger is a webflow form and basically have tried to adjust the code to work with a webhook instead.

I have the following setup:

Trigger: Catch Hook

Action: Code by Zapier. In the input data I have the following;

 

Then I have the following code:

var hookBootcamps = inputData.bootcamp
var hookPrenatal = inputData.prenatal
var hookPostnatal = inputData.postnatal
var hookMentalHealth = inputData.mentalHealth
var hookLifestyle = inputData.lifestyle
var hookBodyTransformation = inputData.bodyTransformation
var hookBodybuilding = inputData.bodybuilding
var hookStrengthConditioning = inputData.strengthConditioning
var hookNutrition = inputData.nutrition

var bootcamp
var prenatal
var postnatal
var mentalHealth
var lifestyle
var bodyTransformation
var bodybuilding
var strengthConditioning
var nutrition

if (hookBootcamps == "true") {
bootcamp = "Bootcamp"
} else if (hookBootcamps == "false") {
bootcamp = ""
}

if (hookPrenatal == "true") {
prenatal = "Prenatal"
} else if (hookPrenatal == "false") {
prenatal = ""
}

if (hookPostnatal == "true") {
postnatal = "Postnatal"
} else if (hookPostnatal == "false") {
postnatal = ""
}

if (hookMentalHealth == "true") {
mentalHealth = "Mental Health"
} else if (hookMentalHealth == "false") {
mentalHealth = ""
}

if (hookLifestyle == "true") {
lifestyle = "Lifestyle"
} else if (hookLifestyle == "false") {
lifestyle = ""
}

if (hookBodyTransformation == "true") {
bodyTransformation = "Body Transformation"
} else if (hookBodyTransformation == "false") {
bodyTransformation = ""
}

if (hookBodybuilding == "true") {
bodybuilding = "Bodybuilding"
} else if (hookBodybuilding == "false") {
bodybuilding = ""
}

if (hookStrengthConditioning == "true") {
strengthConditioning = "Strength & Conditioning"
} else if (hookStrengthConditioning == "false") {
strengthConditioning = ""
}

if (hookNutrition == "true") {
nutrition = "Nutrition"
} else if (hookNutrition == "false") {
nutrition = ""
}

output = [{bootcamp, prenatal, postnatal, mentalHealth, mentalHealth, lifestyle, bodyTransformation, bodybuilding, strengthConditioning, nutrition}];

 

When I run the test though I’m not getting any Output:

 

Thanks in advance!


16 replies

Userlevel 7
Badge +12

Hi @Kev Lawrence 

Check your Javascript Code against a Javascript validator utility for possible formatting issues: https://beautifytools.com/javascript-validator.php

 

Example of returned formatting errors:

 

Check out this help article section about the proper use of semicolons in Javascript: https://www.w3schools.com/js/js_statements.asp

Userlevel 1

Hi @Troy Tessalone 

 

Thanks very much, I was able to rectify a lot of the errors with the tool.

Only one error at the end is:

Line Col Errors
75 1 ‘output’ is not defined

 

var hookBootcamps = 'inputData.bootcamp';
var hookPrenatal = 'inputData.prenatal';
var hookPostnatal = 'inputData.postnatal';
var hookMentalHealth = 'inputData.mentalHealth';
var hookLifestyle = 'inputData.lifestyle';
var hookBodyTransformation = 'inputData.bodyTransformation';
var hookBodybuilding = 'inputData.bodybuilding';
var hookStrengthConditioning = 'inputData.strengthConditioning';
var hookNutrition = 'inputData.nutrition';

var bootcamp;
var prenatal;
var postnatal;
var mentalHealth;
var lifestyle;
var bodyTransformation;
var bodybuilding;
var strengthConditioning;
var nutrition;

if (hookBootcamps == "true") {
bootcamp = "Bootcamp";
} else if (hookBootcamps == "false") {
bootcamp = "";
}

if (hookPrenatal == "true") {
prenatal = "Prenatal";
} else if (hookPrenatal == "false") {
prenatal = "";
}

if (hookPostnatal == "true") {
postnatal = "Postnatal";
} else if (hookPostnatal == "false") {
postnatal = "";
}

if (hookMentalHealth == "true") {
mentalHealth = "Mental Health";
} else if (hookMentalHealth == "false") {
mentalHealth = "";
}

if (hookLifestyle == "true") {
lifestyle = "Lifestyle";
} else if (hookLifestyle == "false") {
lifestyle = "";
}

if (hookBodyTransformation == "true") {
bodyTransformation = "Body Transformation";
} else if (hookBodyTransformation == "false") {
bodyTransformation = "";
}

if (hookBodybuilding == "true") {
bodybuilding = "Bodybuilding";
} else if (hookBodybuilding == "false") {
bodybuilding = "";
}

if (hookStrengthConditioning == "true") {
strengthConditioning = "Strength & Conditioning";
} else if (hookStrengthConditioning == "false") {
strengthConditioning = "";
}

if (hookNutrition == "true") {
nutrition = "Nutrition";
} else if (hookNutrition == "false") {
nutrition = "";
}

output = [{bootcamp, prenatal, postnatal, mentalHealth, lifestyle, bodyTransformation, bodybuilding, strengthConditioning, nutrition}];

 

What do you reckon?

Userlevel 7
Badge +12

@Kev Lawrence 

Try testing your Zap Code step now.

 

 

Userlevel 1

No luck I’m afraid @Troy Tessalone  still just the same as the first test. Just gives ID and runtime meta. No values...

Userlevel 7
Badge +12

@Kev Lawrence

 

Help article to reference for using the Javascript Code app: https://zapier.com/help/create/code-webhooks/javascript-code-examples-in-zaps

 

Remove the single quotes around these:

 

Userlevel 1

Hi @Troy Tessalone 

 

Thanks for the link to the help doc. 

 

Tried removing the single quotes as suggested but not working either.

 

Appreciate your help on this but I reckon I may need to hire someone to build for me as I really don’t know Javascript…

 

It is strange though the code is the same as another Zap I’m using but Webflow form is the trigger and it works perfectly so not sure where I’m going wrong with this. It’s obviously down to the difference in the input source being a webhook.

 

FYI here is the other Zap that works:

 

 

 

var webFlowBootcamps = inputData.bootcamp
var webFlowPrenatal = inputData.prenatal
var webFlowPostnatal = inputData.postnatal
var webFlowMentalHealth = inputData.mentalHealth
var webFlowLifestyle = inputData.lifestyle
var webFlowBodyTransformation = inputData.bodyTransformation
var webFlowBodybuilding = inputData.bodybuilding
var webFlowStrengthConditioning = inputData.strengthConditioning
var webFlowNutrition = inputData.nutrition

var bootcamp
var prenatal
var postnatal
var mentalHealth
var lifestyle
var bodyTransformation
var bodybuilding
var strengthConditioning
var nutrition

if (webFlowBootcamps == "true") {
bootcamp = "Bootcamp"
} else if (webFlowBootcamps == "false") {
bootcamp = ""
}

if (webFlowPrenatal == "true") {
prenatal = "Prenatal"
} else if (webFlowPrenatal == "false") {
prenatal = ""
}

if (webFlowPostnatal == "true") {
postnatal = "Postnatal"
} else if (webFlowPostnatal == "false") {
postnatal = ""
}

if (webFlowMentalHealth == "true") {
mentalHealth = "Mental Health"
} else if (webFlowMentalHealth == "false") {
mentalHealth = ""
}

if (webFlowLifestyle == "true") {
lifestyle = "Lifestyle"
} else if (webFlowLifestyle == "false") {
lifestyle = ""
}

if (webFlowBodyTransformation == "true") {
bodyTransformation = "Body Transformation"
} else if (webFlowBodyTransformation == "false") {
bodyTransformation = ""
}

if (webFlowBodybuilding == "true") {
bodybuilding = "Bodybuilding"
} else if (webFlowBodybuilding == "false") {
bodybuilding = ""
}

if (webFlowStrengthConditioning == "true") {
strengthConditioning = "Strength & Conditioning"
} else if (webFlowStrengthConditioning == "false") {
strengthConditioning = ""
}

if (webFlowNutrition == "true") {
nutrition = "Nutrition"
} else if (webFlowNutrition == "false") {
nutrition = ""
}

output = [{bootcamp, prenatal, postnatal, mentalHealth, lifestyle, bodyTransformation, bodybuilding, strengthConditioning, nutrition}];

 

Userlevel 7
Badge +12

@Kev Lawrence 

Try this cleaned up and simplified Javascript Code:

 

var webFlowBootcamps = inputData.bootcamp;
var webFlowPrenatal = inputData.prenatal;
var webFlowPostnatal = inputData.postnatal;
var webFlowMentalHealth = inputData.mentalHealth;
var webFlowLifestyle = inputData.lifestyle;
var webFlowBodyTransformation = inputData.bodyTransformation;
var webFlowBodybuilding = inputData.bodybuilding;
var webFlowStrengthConditioning = inputData.strengthConditioning;
var webFlowNutrition = inputData.nutrition;

var bootcamp = "";
var prenatal = "";
var postnatal = "";
var mentalHealth = "";
var lifestyle = "";
var bodyTransformation = "";
var bodybuilding = "";
var strengthConditioning = "";
var nutrition = "";

if (webFlowBootcamps == "true") {
bootcamp = "Bootcamp";
}

if (webFlowPrenatal == "true") {
prenatal = "Prenatal";
}

if (webFlowPostnatal == "true") {
postnatal = "Postnatal";
}

if (webFlowMentalHealth == "true") {
mentalHealth = "Mental Health";
}

if (webFlowLifestyle == "true") {
lifestyle = "Lifestyle";
}

if (webFlowBodyTransformation == "true") {
bodyTransformation = "Body Transformation";
}

if (webFlowBodybuilding == "true") {
bodybuilding = "Bodybuilding";
}

if (webFlowStrengthConditioning == "true") {
strengthConditioning = "Strength & Conditioning";
}

if (webFlowNutrition == "true") {
nutrition = "Nutrition";
}

output = [{bootcamp, prenatal, postnatal, mentalHealth, lifestyle, bodyTransformation, bodybuilding, strengthConditioning, nutrition}];

 

Userlevel 1

Ok so that pulled in the names but not the values. See screenshot of test:

 

 

So tried adding the else if statement back in but that gave same result. Names but not values being pulled from the input.

 

Userlevel 7
Badge +12

@Kev Lawrence 

Please post screenshots with how your Zap Code step is currently configured (inputs & code), thanks.

Userlevel 1

 

var webFlowBootcamps = inputData.bootcamp;
var webFlowPrenatal = inputData.prenatal;
var webFlowPostnatal = inputData.postnatal;
var webFlowMentalHealth = inputData.mentalHealth;
var webFlowLifestyle = inputData.lifestyle;
var webFlowBodyTransformation = inputData.bodyTransformation;
var webFlowBodybuilding = inputData.bodybuilding;
var webFlowStrengthConditioning = inputData.strengthConditioning;
var webFlowNutrition = inputData.nutrition;

var bootcamp = "";
var prenatal = "";
var postnatal = "";
var mentalHealth = "";
var lifestyle = "";
var bodyTransformation = "";
var bodybuilding = "";
var strengthConditioning = "";
var nutrition = "";

if (webFlowBootcamps == "true") {
bootcamp = "Bootcamp";
}

if (webFlowPrenatal == "true") {
prenatal = "Prenatal";
}

if (webFlowPostnatal == "true") {
postnatal = "Postnatal";
}

if (webFlowMentalHealth == "true") {
mentalHealth = "Mental Health";
}

if (webFlowLifestyle == "true") {
lifestyle = "Lifestyle";
}

if (webFlowBodyTransformation == "true") {
bodyTransformation = "Body Transformation";
}

if (webFlowBodybuilding == "true") {
bodybuilding = "Bodybuilding";
}

if (webFlowStrengthConditioning == "true") {
strengthConditioning = "Strength & Conditioning";
}

if (webFlowNutrition == "true") {
nutrition = "Nutrition";
}

output = [{bootcamp, prenatal, postnatal, mentalHealth, lifestyle, bodyTransformation, bodybuilding, strengthConditioning, nutrition}];

 

 

Userlevel 7
Badge +12

@Kev Lawrence 

It’s working for me when I replicate the Zap Code step in my Zapier account.

 

Make sure you don’t have any leading or trailing spaces for the mapped Input variables.

Also make sure those mapped variable values don’t have any leading/trailing spaces.

 

 

Userlevel 1

Hi @Troy Tessalone 

 

Checked all input and mapped data. There are no leading/trailing spaces...so not sure why its not working for me.

Userlevel 7
Badge +12

@Kev Lawrence 

Could be that the true/false are getting converted to a boolean or all UPPER case as TRUE/FALSE

 

You can try adjusting the code for each IF to this:

 

if (webFlowBodybuilding == "true" || webFlowBodybuilding == true || webFlowBodybuilding == "TRUE") {
bodybuilding = "Bodybuilding";
}
Userlevel 1

@Troy Tessalone  it was capatalising the first letter! True/False

 

I adjusted the code to this for each and has worked :)

 

if (webFlowBodybuilding == "true" || webFlowBodybuilding == true || webFlowBodybuilding == "True") {
bodybuilding = "Bodybuilding";
}

 

Userlevel 7
Badge +12

@Kev Lawrence 

If you want you can simplify the code back to this for each...

if (webFlowBodybuilding == "True") {
bodybuilding = "Bodybuilding";
}
Userlevel 1

@Troy Tessalone 

 

That’s great I will do that.

Thank you so much for your help. You have saved me a lot of time! :smiley:

Reply