index.html

<div ng-controller="myController">
  <!-- multistep form -->
<div id="msdiv">
    <!-- progressbar -->
    <ul id="progressbar">
           <li class="active">General</li>
           <li>   Courses</li>
           <li>Final Submit</li>
            <li>Payment</li>
    </ul>
    <!-- fieldsets -->
    <fieldset>
        <h2 class="fs-title">General Information</h2>
         
        <input type="text" name="name" ng-model="name" placeholder="Name">
        <input type="text" name="email" ng-model="email" placeholder="E-mail">
        <input type="text" name="mobile" ng-model="mobile"  placeholder="Mobile No">
        <select ng-model="country">
  <option  value=" ">Please select your Country</option>
              <option>United States</option>
              <option>European union</option>
              <option>China</option>
              <option>Japan</option>
              <option>Germany</option>
              <option>United Kingdom</option>
              <option>France</option>
              <option>India</option>
              <option>Italy</option>
              <option>Brazil</option>
              <option>Canada</option>
              <option>South Corea</option>
              <option>Russia</option>
              <option>Australia</option>
              <option>Spain</option>
              <option>Mexico</option>
              <option>Indonesia</option>
              <option>Netherlands</option>
              <option>Turkey</option>
              <option>Switzerland</option>
              <option>Saudi Arabia</option>
              <option>Others (Please Fill in the Below Box)</option>
</select>
<input type="button" name="next" class="next action-button" value="Next" />
    </fieldset>
    <fieldset>
        <h2 class="fs-title">Courses</h2>
        <input type="text" name="name" ng-model="name"  placeholder="Name" readonly>
        <input type="text" name="email" ng-model="email"  placeholder="E-mail" readonly>
        <input type="text" name="mobile" ng-model="mobile" placeholder="Mobile No" readonly>
        <input type="text" name="country" ng-model="country"  placeholder="Country" readonly>
        <h3 class="fs-subtitle">Do you like to have classroom or online training??</h3>
        <table width="80%"><tr><td style="width:50%; text-align:left">
        Online Training<input type="radio"  name="rad1" onclick="txt(0)"> </td><td style="width:50%; text-align:right">Classroom Training<input type="radio" name="rad1" onclick="txt(1)"></td></tr></table>
        <select ng-model="course"  id="online" style="display:none">
  
              <option value=" ">Choose Your Course</option>
        <optgroup label="Popular Courses">
            <option>Devops</option>
            <option>Build & Release - Java</option>
            <option>Build & Release - DOT NET </option>
            <option>Continuous Integration</option>
            <option>Continuous Delivery</option>
        </optgroup>
         
        <optgroup label="Configuration Management">
            <option>Chef</option>
            <option>Puppet</option>
            <option>Ansible</option>
        </optgroup>
         
        <optgroup label="Continuous Integration">
            <option>Jenkins</option>
            <option>TeamCity</option>
            <option>Bamboo</option>
            <option>Team Foundation Server</option>
        </optgroup>
         
        <optgroup label="Virtualization & Container">
            <option>Docker</option>
            <option>Vagrant</option>
            <option>Amazon AWS</option>
        </optgroup>
         
        <optgroup label="Build Automation">
            <option>Maven</option>
            <option>Gradle</option>
            <option>Ms Build</option>
        </optgroup>   
 
        <optgroup label="Scripting">
            <option>Perl</option>
            <option>Python</option>
            <option>Bash Scripting</option>
            <option>Ruby Scripting</option>
        </optgroup>   
     
        <optgroup label="Others">
            <option>Jira</option>
            <option>Sonar Qube</option>
            <option>Nagios</option>
            <option>Jacoco</option>
            <option>Application Packaging</option>
        </optgroup>   
</select>
<select ng-model="course"  id="classroom" style="display:none">
  
             <option value=" "><option>Choose Your Course</option>
             
            <option>Puppet Training & Workshop (Fundamental + Advance)</option>
            <option>Chef Training & Workshop (Fundamental + Advance)</option>
            <option>Devops Using Git, Maven, Nexus, Jenkins & Chef</option>
            <option>Devops Using Git, Maven, Nexus, Jenkins & Puppet</option>
            <option>Advance Docker Training & Workshop</option>
             
</select>
  </br>
        <input type="button" name="previous" class="previous action-button" value="Previous" />
        <input type="button" name="next" class="next action-button" value="Next" />
    </fieldset>
<fieldset>
        <h2 class="fs-title">Final Submit</h2>
        <form id="form1" method="post" action="/paymentOnline">
        <input type="text" name="name" ng-model="name"  placeholder="Name" readonly>
        <input type="text" name="email" ng-model="email"  placeholder="E-mail" readonly>
        <input type="text" name="mobile" ng-model="mobile" placeholder="Mobile No" readonly>
        <input type="text" name="country" ng-model="country"  placeholder="Country" readonly>
        <input type="text" name="course" ng-model="course"  placeholder="Courses" readonly>
  </br>
        <input type="button" name="previous" class="previous action-button" value="Previous" />
        <input type="submit" name="submit" class="submit action-button" id="adduser" value="Submit" />
        </form>
        <form id="form2" method="post" action="/paymentClassroom" style="display:none">
        <input type="text" name="name" ng-model="name"  placeholder="Name" readonly>
        <input type="text" name="email" ng-model="email"  placeholder="E-mail" readonly>
        <input type="text" name="mobile" ng-model="mobile" placeholder="Mobile No" readonly>
        <input type="text" name="country" ng-model="country"  placeholder="Country" readonly>
        <input type="text" name="course" ng-model="course"  placeholder="Courses" readonly>
  </br>
        <input type="button" name="previous" class="previous action-button" value="Previous" />
        <input type="submit" name="submit" class="submit action-button" id="adduser" value="Submit" />
        </form>
    </fieldset>
 
     
</div>
</div>