Custom Forms using Weblegit


Creating a form


We can use any WYGSIG editor to create a HTMl form. Weblegit allows us the flexibility to add the input fields as per our business requirements and even change it in future when we need to. For example lets create a simple CONTACT US form where we are capturing user email, phone and feedback message. The HTML code for the form would be

<html>
<body>
<form>
Contact Us<br/>
Email: <input type="text" name="email"/><br/>
Phone Number: <input type="text" name="phone"/><br/>
Feedback: <textarea name="feedback"> </textarea>
</form>
</body>
</html>


Contact Us
Email:
Phone Number:
Feedback:

Integerating it with Weblegit


OK, we have done the hard part already. Let us power this form. Register with Weblegit to create an account if it does not exists already. Select the Form Manager from the left navigation panel.

Integeration Methods


A Simple form


It is the simplest method to save the data from your forms. There are four configurable fields which can be used for integration

We add a property for method and action for the form tag. After that the code looks like

	
       <form method="POST" action="https://app.weblegit.com/form/{FORM_KEY}" >
	

IMPORTANT: the FORM_KEY is unque for every form so make sure you replace with the correct form key which is part of the Path property that we copied from the form dashbaord.

Thats it !!! Our form is now ready for submissions.


B Integrate using Weblegit Plugin


The plugin integration is much more secure and prevents some one from abusing the form. To begin we first need to go to Website integration to generate a plugin for us (if we have not done so already). This would require us to add our domain name (Website) where we would be using the form. Using Weblegit Plugin for the forms have some additional advantages like total control on the form submission, displaying the form submission message on the same page as opposed to user begin redirected to a success page.

We add couple properties for the form tag after which the code looks like

	
       <form method="POST" class="weblegit-form" data-weblegit-formid="{FORM_KEY}" >
	

IMPORTANT: the FORM_KEY is unque for every form so make sure you replace with the correct form key which is part of the Path property that we copied from the form dashbaord.

Thats it !!! Our form is now ready for submissions.



Advanced Settings


We have additional options available for the forms under the advanced settings

a Email Validation


If we have any field on the form which stores email addresses then we have an option to validate the email address before the form is saved. This not only allows us to avoid storing invalid email addresses, it also gives an option to correct any typo mistake with their email address.


b Send Notification


This provides the capability to send notification to any given email address whenever a submission happens for the given form.


b Create Ticket


The forms provide us an option to create a support ticket upon the form submission. The ticket can be assigned to a particular category and individual team member which are available as a drop down. This is an important feature which enables to use the form as an input for the help desk ticket.



How Can We Help?