Categories

JS Animated. How to make a contact form field not required

Norman Fisher April 25, 2014
Rating: 5.0/5. From 2 votes.
Please wait...

In templates based on forms.js script

This tutorial will show you how to make your contact form fields not required.

All the fields need to be filled by default. To fix that, find the index page with your contact form and open it in any php/text editor. Locate the following scripts related to your fields:

<label class="email">

Make it look like:

<label class="email notRequired">

Save the changes, and refresh your browser window. Now the ‘e-mail’ field is not required.

This is the end of the tutorial, let us know if you have any questions.

Feel free to check the detailed video tutorial below:

How to make a contact form field not required

In templates based on TMForm.js script

js_animated_tmform_contact_form_field_not_required_making_1
  1. Open the .html file that represents your “Contacts” page in Dreamweaver or any other HTML editor.

  2. Switch to the “Split” mode to divide your screen into “Code”/”Design” views.

    js_animated_tmform_contact_form_field_not_required_making_2
  3. In the “Design” view, select the field which you need to make not required (by default all of them are required). For example, the “Name” field.

  4. That will highlight the code in the “Code” view:

    <label class="name">
       <input type="text" placeholder="Name:" data-constraints="@Required @JustLetters" />
       <span class="empty-message">*This field is required.</span>
       <span class="error-message">*This is not a valid name.</span>
    </label>
    
  5. Delete @Required from the data-constraints attribute values list. So the result looks as follows:

    <label class="name">
       <input type="text" placeholder="Name:" data-constraints="@JustLetters" />
       <span class="empty-message">*This field is required.</span>
       <span class="error-message">*This is not a valid name.</span>
    </label>
    
  6. Save your changes to the file and upload your template to FTP to check how the field is now working.

    js_animated_tmform_contact_form_field_not_required_making_3
  7. The same goes for all other fields. To make a field not required, you will just need to delete @Required from the data-constraints attribute values list of the corresponding <input> tag.

Feel free to check the detailed video tutorial below:

JS Animated. How to make a contact form field not required (based on TMForm)
This entry was posted in JS Animated tutorials, Web Templates, Website Templates and tagged field, form, forms.js, not required, TMForm.js. Bookmark the permalink.

Submit a ticket

If you are still unable to find a sufficient tutorial regarding your issue please use the following link to submit a request to our technical support team. We'll provide you with our help and assistance within next 24 hours: Submit a ticket