I want to add a section to my form, just like the google forms, I don't know how to do it... this is so that each question in the form is separate.
can someone tell me how to do it without php. only with javascript or another language.
My form:
<div class="widget ContactForm" data-version="2" id="ContactForm1"><h3class="title">Formulario de contacto</h3><div class="contact-form-widget">
<div class="form">
<form name="contact-form">
<p></p>
Nombre<br><input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="">
<p></p>
Correo electrónico<span style="font-weight: bolder;">*</span><br><input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="">
<p></p>
Mensaje<span style="font-weight: bolder;">*</span><br>
<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<p></p>
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Enviar">
<p></p>
<div style="text-align: center; max-width: 222px; width: 100%">
<p class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></p>
<p class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></p>
</div>
</form>
</div>
You can do it in the following way:
Step 1: We will create the index.html file. Here we will include all the necessary HTML for our form to display. To do this we must include the Bootstrap and jQuery libraries. Without them, none of this will work.
Step 2: We implement the HTML code for all the steps of our multi-step form, and add it to the index.html file, as I mentioned before.
Step 3 : We will use jQuery to hide and show the HTML fieldset for navigation between steps. You must add the following code inside the footer of the index.html file
Example:
Cheers!