No Description Available
0
This kind of registration and appointment booking form can be used on many places like on slider,banner and section.
FORM VALIDATIONS
This sidebar contact form is used to get user query form the same page.
Step by step form is smart way to collect data, where we collect data from user in steps.
This is an example of ionic 4 form , ionic is a Javascript framework used to build hybrid mobile app,desktop and pwa.
//alert('welcome')
<section class="sliderbox" id="menu-homepage"> <div class="container"> <div class="row"> <!-- slider --> <div class="col-sm-8 offset-sm-2"> <div class="banner-content"> <div class="text-center"> <h1><span>Insititute with</span> Best Placements</h1> <h4>Achieving the milestone in 5 years since Inception</h4> </div> <div class="fasttrackRegistrationForm"> <h2>Register Now!</h2> <h5>Apply Today & Be a Part of University with Best Placements</h5> <div> <form method="post" action="./mail/mailer.php"> <div class="row"> <div class="col-xs-12 col-sm-6"> <div class="fieldset"> <input name="name" type="text" required="" id="txtName" placeholder="ENTER FULL NAME"> <span id="RequiredFieldValidatorName" class="required" style="visibility:hidden;">*</span> </div> </div> <div class="col-xs-12 col-sm-6"> <div class="fieldset"> <input name="email" type="email" required="" placeholder="ENTER EMAIL ID"> </div> </div> <div class="col-xs-12 col-sm-6 mobileCity"> <div class="fieldset"> <input name="phone" type="tel" maxlength="10" required="" pattern="[0-9]{10}" title="Enter 10 digits mobile number" placeholder="ENTER MOBILE"> </div> <div class="fieldset"> <input type="text" name="city" required="" Placeholder="City"> </div> </div> <div class="col-xs-12 col-sm-6 dobFrom"> <div class="clearfix"> <div class="fieldset"> <select name="day" required=""> <option value="">DD</option> <option value="01">1</option> <option value="02">2</option> <option value="03">3</option> <option value="04">4</option> <option value="05">5</option> <option value="06">6</option> <option value="07">7</option> <option value="08">8</option> <option value="09">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> <option value="14">14</option> <option value="15">15</option> <option value="16">16</option> <option value="17">17</option> <option value="18">18</option> <option value="19">19</option> <option value="20">20</option> <option value="21">21</option> <option value="22">22</option> <option value="23">23</option> <option value="24">24</option> <option value="25">25</option> <option value="26">26</option> <option value="27">27</option> <option value="28">28</option> <option value="29">29</option> <option value="30">30</option> <option value="31">31</option> </select> </div> <div class="fieldset"> <select name="month" required=""> <option value="">MM</option> <option value="01">JANUARY</option> <option value="02">FEBRUARY</option> <option value="03">MARCH</option> <option value="04">APRIL</option> <option value="05">MAY</option> <option value="06">JUNE</option> <option value="07">JULY</option> <option value="08">AUGUST</option> <option value="09">SEPTEMBER</option> <option value="10">OCTOBER</option> <option value="11">NOVEMBER</option> <option value="12">DECEMBER</option> </select> </div> <div class="fieldset"> <select name="year" required=""> <option value="">YYYY</option> <option value="1980">1980</option> <option value="1981">1981</option> <option value="1982">1982</option> <option value="1983">1983</option> <option value="1984">1984</option> <option value="1985">1985</option> <option value="1986">1986</option> <option value="1987">1987</option> <option value="1988">1988</option> <option value="1989">1989</option> <option value="1990">1990</option> <option value="1991">1991</option> <option value="1992">1992</option> <option value="1993">1993</option> <option value="1994">1994</option> <option value="1995">1995</option> <option value="1996">1996</option> <option value="1997">1997</option> <option value="1998">1998</option> <option value="1999">1999</option> <option value="2000">2000</option> <option value="2001">2001</option> <option value="2002">2002</option> <option value="2003">2003</option> <option value="2004">2004</option> <option value="2005">2005</option> <option value="2006">2006</option> <option value="2007">2007</option> <option value="2008">2008</option> <option value="2009">2009</option> <option value="2010">2010</option> <option value="2011">2011</option> <option value="2012">2012</option> <option value="2013">2013</option> <option value="2014">2014</option> <option value="2015">2015</option> <option value="2016">2016</option> <option value="2017">2017</option> <option value="2018">2018</option> <option value="2019">2019</option> <option value="2020">2020</option> <option value="2021">2021</option> <option value="2022">2022</option> <option value="2023">2023</option> <option value="2024">2024</option> <option value="2025">2025</option> <option value="2026">2026</option> <option value="2027">2027</option> <option value="2028">2028</option> <option value="2029">2029</option> <option value="2030">2030</option> </select> </div> </div> </div> <div class="col-xs-12"> <div class="fieldset"> <select name="course" required=""> <option value="">SELECT COURSE</option> <option value="Computer Science Engineering">Computer Science Engineering</option> <option value="Electronics & Communication Engineering">Electronics & Communication Engineerings</option> <option value="Civil Engineering">Civil Engineering</option> <option value="Mechanical Engineering">Mechanical Engineering</option> <option value="Electrical Engineering">Electrical Engineering</option> <option value="M.Tech (Computer Science)">M.Tech (Computer Science)</option> <option value="BBA">BBA</option> <option value="BCA">BCA</option> </select> </div> </div> <div class="col-xs-12"> <div class="fieldset"> <input type="submit" name="register" value="Apply Now"> <div id="ValidationSummary2" style="display:none;"> </div> </div> </div> </div> </form> </div> </div> </div> </div> </div> </div> </section>