Marketfaux
For when you want to use Marketo forms, but not its API.
Why not use Marketo's Forms API?
Marketo's Forms API is opinionated in terms of style and behavior. In some cases, those opinions are terrible and outdated. Additionally, sometimes you just want to break the mold and do something that would not normally be possible, such as utilizing a JavaScript framework like React.
What Marketfaux does (and what it doesn't do)
Marketfaux just provides functions to send data as if you've filled out a standard Marketo form. That way, you can implement the form the way you want and still have your form's results passed on to Marketo.
Marketfaux, however, is not a drop-in replacement for the Marketo Forms API. It does not generate the form's HTML or validate input—those bits will have to be implemented by you.
API
Return type
Marketfaux uses Wretch to send requests using the Fetch API. Please see their documentation to learn more about error handling and responses.
All functions return Wretch's ResponseChain
type.
Base URL, Munchkin ID, and form ID
The first three parameters for each function are the same as in Marketo's loadForm
function:
- Base URL (ex.
"//app-sjqe.marketo.com"
) - Munchkin ID (ex.
"718-GIV-198"
) - Form ID (ex.
621
)
Functions
sendForm(baseUrl: string, munchkinId: string, formId: string | number, form: HTMLFormElement | string): ResponseChain
Bundle up the data from a <form />
element and submit it. Accepts either the element itself or a query selector for the element.
Examples
Marketfaux
Marketfaux
sendData(baseUrl: string, munchkinId: string, formId: string | number, form: FormData | Record<string, any>): ResponseChain
Sends provided data which can either be a FormData
object or a standard key-value object.
Bracketization
Marketfaux will automatically bracketize keys with multiple values to conform to PHP's naming conventions. If those keys already have bracket notation, they will not be bracketized.
Input
Output
key[]: value1key[]: value2
Examples
Marketfaux
const data = datadata Marketfaux
send(baseUrl: string, munchkinId: string, formId: string | number, payload: HTMLFormElement | string | FormData | Record<string, any>): ResponseChain
Convenience method that will automatically use either sendForm
or sendData
based on the type of the provided payload.
Examples
On the page
...
In an app
const formData = // Key-value object
What type of errors should I expect?
Marketo is surprisingly loose when it comes to the data submitted to it.
It will throw errors if:
- your base URL, Munchkin ID, or form ID is invalid
- 400 Bad Request error
- there are connectivity issues such as user being offline or Marketo being unreachable
It will not throw errors if you submit:
- an incompatible value (such as a random string when something in date format is expected)
- The value for this field will stay as it was before submitting
- non-existent fields
- Nothing happens
- real fields that are not added to the form
- Populates that field with the provided value
- without required fields
- Skips those fields