Jotform Anywhere.

Jotform Anywhere is a small JavaScript SDK that brings the capabilities of Jotform Form Builder to all web apps.

Jotform Anywhere provides a set of client side functionality to let you add a Form Builder inside your web app.Your users can create/edit and embed forms without leaving your site.

7500+ Ready-to-use Form Templates

Users can directly embed forms from over 7500 beautiful form templates with just a few clicks.

Form Builder

Let your users create any kind of web forms with 25+ form question types and 350+ widgetss.

Copy and paste this code in order to initialize javascript library:

  <script type="text/javascript" src="//js.jotform.com/JotFormAnywhere.js"></script>

Copy and paste html code below to add a button that launches a form builder

  <button onclick="JotFormAnywhere.launchFormBuilder({});">Add Form</button>

Clicking that button will launch Jotform iframe (embeddable form builder) and created/selected form will be appended to body by default. Check out documentation for further customization options.

• How Breezi uses Jotform Anywhere on their website builder as a form builder.
• Sidengo uses Jotform Anywhere to let users Create Personalized Forms.

What is Jotform Anywhere?

Jotform is an online form builder. By using Jotform's drag & drop form editor and its 7500+ ready-to-use form templates, creating forms is quick, easy, and fun.

Jotform Anywhere is a small JavaScript SDK that brings the capabilities of Jotform Form Builder to all web apps. You can embed Jotform Form Builder to your app easily, and your users will be able launch the form builder as a lightbox wizard, create their forms and add them to their web pages.

Who is Jotform Anywhere for?

Jotform Anywhere is especially useful for website builders and blog providers.But, any kind of web app that needs to let users create web forms can use it.

What capabilities does Jotform Anywhere currently have?

1. Add Form
Your users can add a form to anywhere on the page. Adding a form will launch a wizard in a modal box.Your users can select from one of the 7500+ ready made form templates or use form builder to create their form.

2. Edit/Delete Form
Once a form is added on your editor, user can hover over the form and click on Edit button to re-launch the form builder wizard.

3. Get Form Code
JotformAnywhere javaScript library returns a form code so that you can place it on the live version of the site.You can also get additional data such as the width/height of the form from JotformAnywhere.

If you have other needs please contact us.We'd be happy to implement additional functionality to support a tighter integration.

Are there any requirements or restrictions?

You can use Jotform Anywhere without permission. We do not require you to get an API key or fill an application. Simply copy and paste the code samples and you are ready to go.

There is no restrictions on the amount of use. You can place it on any page on your web app.

Do My Users Need to Create a Jotform Account?

No, they do not need to have a Jotform account to create forms or get their form submissions emailed. Since they will enter an email address to get their form submissions we accept the email address as a registration and we create guest accounts in the background.

Why Should I use Jotform Anywhere?

If you have a platform where users asks to be able to create forms to their pages Jotform Anywhere is a great way to provide them this functionality.

What I Should Do If I have Further Questions?

Please feel free to contact us.We will be happy to help you with your questions and if you need further help we will assign a developer to you to help with integration.

Load JotformAnywhere javascript library

  <script type="text/javascript" src="//js.jotform.com/JotFormAnywhere.js"></script>

After loading the script above you can use JotformAnyhere object. This JS object provides neccessary methods to enable web sites to create and embed forms through Jotform.

Methods

JotFormAnywhere.launchFormBuilder

If no option is provided JotFormAnywhere.launchFormBuilder will open a modalbox including iframe provided by Jotform. All form creation/edit process is done inside this iframe.

Most probably you will call this method as callback of a click event.

Example

JotFormAnywhere.launchFormBuilder({
builderMaskColor: "#FFFFFF"
})

Parameters

Options

JotFormAnywhere.insertForm

JotFormAnywhere.insertForm creates a div with id "jotform_form_container_{formID}" and embeds the form inside.

Using this method to put form inside your web page is strongly recommended on both edit and live stages

Example

JotFormAnywhere.insertForm({
formID: "30647084188965",
insertTo: "#formHere",
putEditButton: false,
putDeleteButton: false
})

Parameters

Options

JotFormAnywhere.createInstantForm

Using JotFormAnywhere.createInstantForm method you can instruct JotformAnywhere library to create a form immediately after loading javascript file. Note that calling this method will publish jotform.formCreated event which you can subscribe to.

Example

JotFormAnywhere.createInstantForm({
email: "me@example.com",
templateName: "contact-us"
})

Parameters

Options

JotFormAnywhere.editForm

You can open edit screen of inserted forms with this method so users do not have to edit their forms through "Edit Form" button.

Example

JotFormAnywhere.editForm(
"31343042093342"
)

Parameters

This method takes only one required parameter as form-id

JotFormAnywhere.deleteForm

You can delete inserted forms with this method so users do not have to delete their forms through "Delete Form" button.

Example

JotFormAnywhere.deleteForm(
"31343042093342"
)

Parameters

This method takes only one required parameter as form-id

JotFormAnywhere.subscribe

JotFormAnywhere.subscribe method attaches handler to an event defined by JS library and invokes your callback when the event fires.

Example

You will probably want to be notified with related data when the form is successfully created on Jotform.

JotFormAnywhere.subscribe("jotform.formCreated", 
function(response){
console.log("Form is created with properties:", response)
}
)

Or when form was updated

JotFormAnywhere.subscribe("jotform.formUpdated", 
function(response){
console.log("Form is updated with properties:", response)
}
)

Events

Global events you can subscribe:

• jotform.formCreated - fired when form created on Jotform
• jotform.formUpdated - fired when form edited and saved on Jotform
• jotform.formDeleted - fired when form deleted
• jotform.formLoaded - fired when form iframe fully loaded

The response object passed into the callback function for formCreated and formUpdated events looks like the following:

{
formEmbedUrl:"https://form.jotformpro.com/jsform/30654794751967">", 
height:465, 
width:320, 
formID:"30654794751967", 
}

The response object passed into the callback function for formDeleted and formLoaded event looks like the following:

{
formID:"30654794751967", 
}

JotFormAnywhere.customize

With JotFormAnywhere.customize method you can customize default colors of the Jotform iframe

Example

JotFormAnywhere.customize({
formBuilderBarColor: "#FFFFFF",
primaryButtonColor: "#FF00FF",
primaryButtonHoverColor: "blue"
})

Parameters

Options