API tools faq
paste
Guest User

Untitled

a guest
Jul 6th, 2017
41
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 41.25 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="utf-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1">
  7.     <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  8.     <title>Registration Form</title>
  9.     <script type="text/javascript" src="//code.jquery.com/jquery-1.8.3.js"></script>
  10. <style type="text/css">
  11.                 .test{ display:none; }
  12.                 input[type="submit"]{ border: thin solid #333; }
  13. </style>
  14. <script type="text/javascript">
  15. $(window).load(function(){
  16.     $(':input').bind('keypress keydown keyup change',function(){
  17.                 var ssc_gp = parseFloat($(':input[name="ssc_gp"]').val(),10);
  18.                  var ssc=75;
  19.  
  20.              if(ssc_gp >= ssc){
  21.             $("input[name=submit]").removeClass("test");   
  22.             }else if(ssc_gp < ssc){
  23.             $("input[name=submit]").addClass("test");
  24.             }    
  25.         console.log(ssc,ssc_gp);
  26.  
  27.     });
  28.  
  29. });
  30. </script>
  31.  
  32.     <!-- Bootstrap -->
  33.      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  34.        
  35. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  36.  
  37.     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  38.     <link href="css/bootstrap.min.css" rel="stylesheet">
  39.     <link href="css/dcalendar.picker.css" rel="stylesheet">
  40.     <style type="text/css">
  41.                #deceased {
  42.                    background-color: #FFF3F5;
  43.                    padding-top: 10px;
  44.                    margin-bottom: 10px;
  45.                }
  46.  
  47.                .remove_field {
  48.                    float: right;
  49.                    cursor: pointer;
  50.                    position: absolute;
  51.                }
  52.  
  53.                    .remove_field:hover {
  54.                        text-decoration: none;
  55.                    }
  56.                /*css start */
  57.                /*!Don't remove this!
  58.         * jQuery DCalendar and DCalendar Picker plugin styles
  59.         *
  60.         * Author: Dionlee Uy
  61.         * Email: dionleeuy@gmail.com
  62.         *
  63.         * Date: Mon Mar 2 2013
  64.         */
  65.                .calendar {
  66.                    position: relative;
  67.                    font-family: 'Century Gothic','Segoe UI', Calibri, Arial;
  68.                    font-size: 12px;
  69.                    border-collapse: collapse;
  70.                    margin: 0;
  71.                    padding: 0;
  72.                    z-index: 4;
  73.                    border: 1px solid rgba(0,0,0,0.08);
  74.                    width: 250px;
  75.                    color: #000;
  76.                    text-align: center;
  77.                    background-color: #FFF;
  78.                }
  79.  
  80.                    .calendar th,
  81.                    .calendar td {
  82.                        text-align: center;
  83.                        -webki-ttransition: all 0.3s ease;
  84.                        -moz-transition: all 0.3s ease;
  85.                        transition: all 0.3s ease;
  86.                    }
  87.  
  88.                        .calendar th:first-child,
  89.                        .calendar td:first-child {
  90.                            margin-left: 5px;
  91.                        }
  92.  
  93.                    .calendar span {
  94.                        padding: 6px 4px;
  95.                        display: block;
  96.                    }
  97.  
  98.                    .calendar .month {
  99.                        padding: 15px;
  100.                    }
  101.  
  102.                    .calendar .pMDate, .calendar .nMDate {
  103.                        color: #AAA;
  104.                    }
  105.  
  106.                    .calendar .date, .calendar .pMDate, .calendar .nMDate, .calendar .month {
  107.                        cursor: pointer;
  108.                    }
  109.  
  110.                        .calendar .date:hover, .calendar .pMDate:hover, .calendar .nMDate:hover, .calendar .month:hover {
  111.                            background-color: #E2E2E2;
  112.                        }
  113.  
  114.                        .calendar .date:active, .calendar .pMDate:active, .calendar .nMDate:active, .calendar .month:active {
  115.                            background-color: #22A7F0;
  116.                            color: #FFF;
  117.                        }
  118.  
  119.                    .calendar .selected {
  120.                        background-color: #22A7F0 !important;
  121.                        color: #FFF !important;
  122.                    }
  123.  
  124.                    .calendar tr:first-child th {
  125.                        background-color: #FFF;
  126.                        padding: 4px;
  127.                        padding-top: 8px;
  128.                        font-size: 14px;
  129.                    }
  130.  
  131.                    .calendar tr:first-child th {
  132.                        cursor: pointer;
  133.                        color: #000;
  134.                    }
  135.  
  136.                        .calendar tr:first-child th:hover {
  137.                            color: #22A7F0;
  138.                        }
  139.  
  140.                        .calendar tr:first-child th:active {
  141.                            color: #22A7F0;
  142.                        }
  143.  
  144.                    .calendar thead tr:nth-child(2) th {
  145.                        color: #555;
  146.                        padding: 8px 3px;
  147.                    }
  148.  
  149.                    .calendar #prev, .calendar #next {
  150.                        font-family: 'Times New Roman';
  151.                        font-size: 20px;
  152.                        padding: 0;
  153.                    }
  154.  
  155.                    .calendar #today {
  156.                        text-align: center;
  157.                        cursor: pointer;
  158.                        color: #22A7F0;
  159.                        padding: 10px 6px;
  160.                    }
  161.  
  162.                        .calendar #today:hover {
  163.                            color: #80A7DD;
  164.                        }
  165.  
  166.                        .calendar #today:active {
  167.                            color: #000;
  168.                        }
  169.  
  170.                    .calendar #currDay {
  171.                        color: #22A7F0;
  172.                    }
  173.  
  174.                .datepicker {
  175.                    background: #ffffff url('https://cdn4.iconfinder.com/data/icons/small-n-flat/24/calendar-128.png') no-repeat right top;
  176.                    background-size: 30px 30px;
  177.                    ;
  178.                }
  179.  
  180.                .panel-primary {
  181.                    border-color: #33b7b7;
  182.                }
  183.  
  184.                    .panel-primary > .panel-heading {
  185.                        color: #fff;
  186.                        background-color: #33b7b7;
  187.                        border-color: #33b7b7;
  188.                    }
  189.  
  190.                    #input
  191.                    {
  192.                        width:120px;
  193.                    }
  194.                /*End css */
  195.     </style>
  196.     <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  197.     <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  198.     <!--[if lt IE 9]>
  199.      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
  200.      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  201.    <![endif]-->
  202.     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
  203.     <script src="js/jquery-1.12.4.js"></script>
  204.     <script src="js/dcalendar.picker.js"></script>
  205.     <!-- Include all compiled plugins (below), or include individual files as needed -->
  206.     <script src="js/bootstrap.min.js"></script>
  207.     <script type='text/javascript'>
  208.  
  209.     $(function() {
  210.         //calendar call function
  211.         $('.datepicker').dcalendar();
  212.         $('.datepicker').dcalendarpicker();
  213.  
  214.             var max_fields = 10; //maximum input boxes allowed
  215.             var x = 1; //initlal text box count
  216.  
  217.         $('#add').click(function () {
  218.             if(x < max_fields){ //max input box allowed
  219.                 x++; //text box increment
  220.                 $("#addblock").before('<div class="col-md-12 col-sm-12" id="deceased">  <a href="#" class="remove_field" title="Remove">X</a>   <div class="form-group col-md-3 col-sm-3">            <label for="name">Name*</label>            <input type="text" class="form-control input-sm" id="name" placeholder="">        </div>   <div class="form-group col-md-3 col-sm-3">            <label for="gender">Gender*</label>            <input type="text" class="form-control input-sm" id="gender" placeholder="">        </div> <div class="form-group col-md-3 col-sm-3">            <label for="age">Age*</label>            <input type="text" class="form-control input-sm" id="age" placeholder="">        </div>  <div class="form-group col-md-3 col-sm-3">            <label for="DOB">Date of Birth or Exact Birth Year*</label>            <input type="text" class="form-control input-sm datepicker" id="DOB'+x+'" placeholder="">        </div>    <div class="form-group col-md-3 col-sm-3">            <label for="DOD">Date of Death or Exact Death Year*</label>             <input type="text" class="form-control input-sm datepicker" id="DOD'+x+'" placeholder="">        </div>   <div class="form-group col-md-3 col-sm-3">            <label for="mother">Deceased Person\'s Mother Name*</label>            <input type="text" class="form-control input-sm" id="mother" placeholder="">        </div> <div class="form-group col-md-3 col-sm-3">            <label for="father">Deceased Person\'s Father Name*</label>            <input type="text" class="form-control input-sm" id="father" placeholder="">        </div> <div class="form-group col-md-3 col-sm-3">      <label for="photo">Upload Photo*</label>        <input type="file" id="photo">      <p class="help-block">Please upload individual photo. Group photo is not acceptable.</p>    </div></div>');
  221.  
  222.                 $('.datepicker').dcalendarpicker();
  223.             }  else{
  224.                 alert("Only 10 Names Allowed");
  225.             }
  226.         });
  227.         $(document).on('click', '.remove_field', function(e){
  228.                 e.preventDefault();
  229.             $(this).parent('div').remove();
  230.             x--;
  231.         });
  232.  
  233.  
  234.     });
  235.  
  236.     //js start
  237.     /* -- DO NOT REMOVE --
  238.  * jQuery DCalendar 1.1 and DCalendar Picker 1.1 plugin
  239.  *
  240.  * Author: Dionlee Uy
  241.  * Email: dionleeuy@gmail.com
  242.  *
  243.  * Date: Sat Mar 2 2013
  244.  *
  245.  * @requires jQuery
  246.  * -- DO NOT REMOVE --
  247.  */
  248. if (typeof jQuery === 'undefined') { throw new Error('DCalendar.Picker: This plugin requires jQuery'); }
  249.  
  250. +function ($) {
  251.  
  252.     Date.prototype.getDays = function() { return new Date(this.getFullYear(), this.getMonth() + 1, 0).getDate(); };
  253.     var months = ['January','February','March','April','May','June','July','August','September','October','November','December'],
  254.         short_months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],
  255.         daysofweek = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'],
  256.  
  257.         DCalendar = function(elem, options) {
  258.             this.calendar = $(elem);
  259.             this.today = new Date();    //system date
  260.             this.date = this.today;     //current selected date, default is today
  261.             this.viewMode = 'days';
  262.             this.options = options;
  263.             this.selected = (this.date.getMonth() + 1) + "/" + this.date.getDate() + "/" + this.date.getFullYear();
  264.  
  265.             if(options.mode === 'calendar')
  266.                 this.tHead = $('<thead><tr><th id="prev">‹</th><th colspan="5" id="currM"></th><th id="next">›</th></tr><tr><th>Su</th><th>Mo</th><th>Tu</th><th>We</th><th>Th</th><th>Fr</th><th>Sa</th></tr></thead>');
  267.             else if (options.mode === 'datepicker')
  268.                 this.tHead = $('<thead><tr><th id="prev">‹</th><th colspan="5" id="currM"></th><th id="next">›</th></tr><tr><th>S</th><th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th></tr></thead>');
  269.             this.tHead.find('#currM').text(months[this.today.getMonth()] +" " + this.today.getFullYear());
  270.             this.calendar.prepend(this.tHead);
  271.             var that = this;
  272.  
  273.             this.calendar.on('click', '#next', function() { initCreate('next'); })
  274.                 .on('click', '#prev', function() { initCreate('prev'); })
  275.                 .on('click', '#today', function() {
  276.                     that.viewMode = 'days';
  277.                     var curr = new Date(that.date),
  278.                         sys = new Date(that.today);
  279.                     if(curr.toString() != sys.toString()) { that.date = sys; }
  280.                     that.create('days');
  281.                 }).on('click', '.date, .pMDate, .nMDate', function() {
  282.                     var tClass = $(this).attr('class'),
  283.                         sdate = $(this).text(),
  284.                         cmonth = that.date.getMonth(),
  285.                         cyear = that.date.getFullYear();
  286.  
  287.                     /* Calculate year */
  288.                     if(tClass === 'pMDate') { cyear = (cmonth === 0 ? cyear - 1 : cyear); }
  289.                     else if(tClass === 'nMDate') { cyear = (cmonth + 2 === 13 ? cyear + 1 : cyear); }
  290.                     /* Calculate month */
  291.                     if(tClass === 'pMDate'){ cmonth = (cmonth === 0 ? '12' : cmonth); }
  292.                     else if (tClass === 'nMDate') { cmonth = (cmonth + 2 === 13 ? '1' : cmonth + 2); }
  293.                     else { cmonth = cmonth + 1; }
  294.  
  295.                     // Selected date
  296.                     that.selected = cmonth + '/' + sdate + '/' + cyear;
  297.  
  298.                     if(that.options.mode === 'datepicker') {
  299.                         that.calendar.find('td').removeClass('selected');
  300.                         $(this).addClass('selected');
  301.                     }
  302.                     selectDate();
  303.                     return true;
  304.                 }).on('click', '#currM', function(){
  305.                     that.viewMode = 'months';
  306.                     that.create(that.viewMode);
  307.                 }).on('click', '.month', function(e){
  308.                     that.viewMode = 'days';
  309.                     var curr = new Date(that.date), y = that.calendar.find('#currM').text();
  310.                     curr.setMonth($(e.currentTarget).attr('num'));
  311.                     that.date = curr;
  312.                     that.create(that.viewMode);
  313.                 });
  314.  
  315.             function selectDate () {
  316.                 var newDate = formatDate(that.options.format);
  317.                 var e = $.Event('selectdate', {date: newDate});
  318.                 that.calendar.trigger(e);
  319.             }
  320.  
  321.             function formatDate (format) {
  322.                 var d = new Date(that.selected), day = d.getDate(), m = d.getMonth(), y = d.getFullYear();
  323.                 return format.replace(/(yyyy|yy|mmmm|mmm|mm|m|dd|d)/gi, function (e) {
  324.                     switch(e.toLowerCase()){
  325.                         case 'd': return day;
  326.                         case 'dd': return (day < 10 ? "0"+day: day);
  327.                         case 'm': return m+1;
  328.                         case 'mm': return (m+1 < 10 ? "0"+(m+1): (m+1));
  329.                         case 'mmm': return short_months[m];
  330.                         case 'mmmm': return months[m];
  331.                         case 'yy': return y.toString().substr(2,2);
  332.                         case 'yyyy': return y;
  333.                     }
  334.                 });
  335.             }
  336.  
  337.             function initCreate(o){
  338.                 var curr = new Date(that.date),
  339.                     currMonth = curr.getMonth(),
  340.                     currYear = curr.getFullYear();
  341.                 curr.setDate(1);
  342.                 if(that.viewMode === 'days') {
  343.                     curr.setMonth(currMonth + (o === 'next' ? 1 : -1));
  344.                 } else {
  345.                     curr.setFullYear(currYear + (o === 'next' ? 1 : - 1));
  346.                 }
  347.                 that.date = curr;
  348.                 that.create(that.viewMode);
  349.             }
  350.  
  351.             this.create(this.viewMode);
  352.         }
  353.  
  354.     DCalendar.prototype = {
  355.  
  356.         constructor : DCalendar,
  357.  
  358.         //setDate : function(){},
  359.  
  360.         create : function(mode){
  361.             var that = this, cal = [], tBody = $('<tbody></tbody>'), d = new Date(that.date), days = that.date.getDays(), day = 1, nStartDate = 1, selDate = that.selected.split('/');
  362.             that.calendar.empty();
  363.             if(mode === "days") {
  364.                 if(that.options.mode === 'calendar') {
  365.                     that.tHead = $('<thead><tr><th id="prev">‹</th><th colspan="5" id="currM"></th><th id="next">›</th></tr><tr><th>Su</th><th>Mo</th><th>Tu</th><th>We</th><th>Th</th><th>Fr</th><th>Sa</th></tr></thead>');
  366.                 } else if (that.options.mode === 'datepicker') {
  367.                     that.tHead = $('<thead><tr><th id="prev">‹</th><th colspan="5" id="currM"></th><th id="next">›</th></tr><tr><th>S</th><th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th></tr></thead>');
  368.                 }
  369.                 that.tHead.find('#currM').text(months[that.date.getMonth()] +" " + that.date.getFullYear());
  370.                 that.calendar.append(that.tHead);
  371.  
  372.                 for(var i = 1; i <= 6; i++){
  373.                     var temp = [$('<td></td>'),$('<td></td>'),$('<td></td>'),$('<td></td>'),$('<td></td>'),$('<td></td>'),$('<td></td>')];
  374.  
  375.                     while(day <= days){
  376.                         d.setDate(day);
  377.                         var dayOfWeek = d.getDay();
  378.                         if(day === that.today.getDate()
  379.                             && d.getMonth() === that.today.getMonth()
  380.                             && d.getFullYear() === that.today.getFullYear()) {
  381.                             temp[dayOfWeek].attr('id', 'currDay');
  382.                         }
  383.                         if(that.options.mode === 'datepicker'
  384.                             && (((d.getMonth() + 1) + "/" + day + "/" + d.getFullYear()) === (selDate[0] + "/" + selDate[1] + "/" + selDate[2]))) {
  385.                             temp[dayOfWeek].addClass('selected');
  386.                         }
  387.                         if(i === 1 && dayOfWeek === 0){
  388.                             break;
  389.                         } else if(dayOfWeek < 6){
  390.                             temp[dayOfWeek].html('<span>'+(day++)+'</span>').addClass('date');
  391.                         } else {
  392.                             temp[dayOfWeek].html('<span>'+(day++)+'</span>').addClass('date');
  393.                             break;
  394.                         }
  395.                     }
  396.                     /* For days of previous and next month */
  397.                     if (i === 1 || i > 4) {
  398.                         var p = new Date(that.date);
  399.                         // First week
  400.                         if (i === 1) {
  401.                             var pMonth = p.getMonth(), pDays = 0;
  402.                             p.setDate(1);
  403.                             p.setMonth(pMonth - 1);
  404.                             pDays = p.getDays();
  405.                             for (var a = 6; a >= 0; a--) {
  406.                                 if (temp[a].text() === ''){
  407.                                     temp[a].html('<span>' + (pDays--) + '</span>').addClass('pMDate');
  408.                                     if (that.options.mode === 'datepicker'
  409.                                         && (((d.getMonth()) + "/" + (pDays + 1) + "/" + d.getFullYear()) === (selDate[0] + "/" + selDate[1] + "/" + selDate[2]))) {
  410.                                         temp[a].addClass('selected');
  411.                                     }
  412.                                 }
  413.                             }
  414.                         }
  415.                         // Last week
  416.                         else if (i > 4) {
  417.                             for (var a = 0; a <= 6; a++) {
  418.                                 if (temp[a].text() === ''){
  419.                                     temp[a].html('<span>' + (nStartDate++) + '</span>').addClass('nMDate');
  420.                                     if (that.options.mode === 'datepicker'
  421.                                         && (((d.getMonth()+2) + "/" + (nStartDate - 1) + "/" + d.getFullYear()) === (selDate[0] + "/" + selDate[1] + "/" + selDate[2]))) {
  422.                                         temp[a].addClass('selected');
  423.                                     }
  424.                                 }
  425.                             }
  426.                         }
  427.                     }
  428.                     cal.push(temp);
  429.                 }
  430.  
  431.                 $.each(cal, function(i, v){
  432.                     var row = $('<tr></tr>'), l = v.length;
  433.                     for(var i = 0; i < l; i++) { row.append(v[i]); }
  434.                     tBody.append(row);
  435.                 });
  436.  
  437.                 var sysDate = "Today: " + daysofweek[that.today.getDay()] + ", " + months[that.today.getMonth()] + " " + that.today.getDate() + ", " + that.today.getFullYear();
  438.                 tBody.append('<tr><td colspan="7" id="today">' + sysDate + '</td></tr>').appendTo(that.calendar);
  439.             } else {
  440.                 this.tHead = $('<thead><tr><th id="prev">‹</th><th colspan="2" id="currM"></th><th id="next">›</th></tr>');
  441.                 that.tHead.find('#currM').text(that.date.getFullYear());
  442.                 that.tHead.appendTo(that.calendar);
  443.                 var currI = 0;
  444.                 for (var i = 0; i < 3; i++) {
  445.                     var row = $('<tr></tr>');
  446.                     for (var x = 0; x < 4; x++) {
  447.                         var col = $('<td align="center"></td>');
  448.                         var m = $('<span class="month" num="' + currI + '">' + short_months[currI] + '</span>');
  449.                         col.append(m).appendTo(row);
  450.                         currI++;
  451.                     }
  452.                     tBody.append(row);
  453.                 }
  454.                 var sysDate = "Today: " + daysofweek[that.today.getDay()] + ", "+ months[that.today.getMonth()] + " " + that.today.getDate() + ", " + that.today.getFullYear();
  455.                 tBody.append('<tr><td colspan="4" id="today">' + sysDate + '</td></tr>').appendTo(that.calendar);
  456.             }
  457.         }
  458.     }
  459.  
  460.     /* DEFINITION FOR DCALENDAR */
  461.     $.fn.dcalendar = function(opts){
  462.         return $(this).each(function(index, elem){
  463.             var that = this;
  464.             var $this = $(that),
  465.                 data = $(that).data('dcalendar'),
  466.                 options = $.extend({}, $.fn.dcalendar.defaults, $this.data(), typeof opts === 'object' && opts);
  467.             if(!data){
  468.                 $this.data('dcalendar', (data = new DCalendar(this, options)));
  469.             }
  470.             if(typeof opts === 'string') data[opts]();
  471.         });
  472.     }
  473.  
  474.     $.fn.dcalendar.defaults = {
  475.         mode : 'calendar',
  476.         format: 'dd/mm/yyyy',
  477.     };
  478.  
  479.     $.fn.dcalendar.Constructor = DCalendar;
  480.  
  481.     /* DEFINITION FOR DCALENDAR PICKER */
  482.     $.fn.dcalendarpicker = function(opts){
  483.         return $(this).each(function(){
  484.             var that = $(this);
  485.             var cal = $('<table class="calendar"></table>'), hovered = false, selectedDate = false;
  486.             that.wrap($('<div class="datepicker" style="position:relative;"></div>'));
  487.             cal.css({
  488.                 position:'absolute',
  489.                 left:0, display:'none',
  490.                 'box-shadow':'0 4px 6px 1px rgba(0, 0, 0, 0.14)',
  491.                 width:'230px',
  492.             }).appendTo(that.parent());
  493.             if(opts){
  494.                 opts.mode = 'datepicker';
  495.                 cal.dcalendar(opts);
  496.             } else{
  497.                 cal.dcalendar({mode: 'datepicker'});
  498.             }
  499.             cal.hover(function(){
  500.                 hovered = true;
  501.             }, function(){
  502.                 hovered = false;
  503.             }).on('click', function(){
  504.                 if(!selectedDate)
  505.                     that.focus();
  506.                 else {
  507.                     selectedDate = false;
  508.                     $(this).hide();
  509.                 }
  510.             }).on('selectdate', function(e){
  511.                 that.val(e.date).trigger('onchange');
  512.                 that.trigger($.Event('dateselected', {date: e.date, elem: that}));
  513.                 selectedDate = true;
  514.             });
  515.             that.on('keydown', function(e){ if(e.which) return false; })
  516.                 .on('focus', function(){
  517.                     $('.datepicker').find('.calendar').not(cal).hide();
  518.                     cal.show();
  519.                 })
  520.                 .on('blur', function(){ if(!hovered) cal.hide(); });
  521.         });
  522.     }
  523.  
  524. }(jQuery);
  525.     //js end
  526.  
  527.     </script>
  528.  
  529.  
  530. </head>
  531. <body style="background-color:#fffeea;">
  532.  
  533.     <div class="panel panel-primary" style="margin:20px;background-color:#fffeea;">
  534.         <div class="panel-heading">
  535.             <h3 class="panel-title">ADMISSION FORM</h3>
  536.         </div>
  537.         <div class="panel-body">
  538.             <form action="admissionreg.php" method="post">
  539.                 <div class="col-sm-12">
  540.                     <!--<div class="form-group col-md-4 col-sm-4">
  541.                         <label for="referenceno">Reference No*  </label>
  542.                        <input type="text" name="referenceno" class="form-control input-sm" id="referenceno" placeholder="">
  543.                    </div>-->
  544.                         <div class="form-group col-md-3 col-sm-3">
  545.                 <label for="admissiontype">admission Type. *</label>
  546.                
  547.                 <select class="form-control input-sm" id="category" name="category" >
  548.                     <option >-- Select Admission Type  --</option>
  549.                     <option value="management" >management</option>
  550.                     <option value="counselling" >counselling</option>
  551.                     <option value="spotadmission" >spotadmission</option>
  552.                     <option value="pio" >pio</option>
  553.                   </select>
  554.             </div>
  555.                
  556.                                 <div class="form-group col-md-2 col-sm-2" style="float:right;">
  557.                     <label for="DOD" align="right">Date *</label>
  558.                     <input type="text" name="date" id="DOD" value='07-07-2017' align="right" readonly>
  559.                 </div>
  560.         </div>
  561.         </div>
  562.         <h4>Choose Course</h4>
  563.         <div class="col-md-12 col-sm-12">
  564.             <div class="form-group col-md-4 col-sm-4">
  565.                 <label for="btech">B.Tech/Diploma </label>
  566.                 <span class="help-block"></span>
  567.  
  568.                 <select class="form-control input-sm" id="btechdiploma" name="btech" onchange="btechFields();">
  569.                     <option>-- Select Branch --</option>
  570.                     <option value="civil">civil</option>
  571.                     <option value="CSE">CSE</option>
  572.                     <option value="ECE">ECE</option>
  573.                     <option value="EEE">EEE</option>
  574.                     <option value="Mechanical">Mechanical</option>
  575.                     <option value="Automobile">Automobile</option>
  576.                     <option value="Mining">Mining</option>
  577.                 </select>
  578.             </div>
  579.             <div class="form-group col-md-4 col-sm-4">
  580.                 <label for="mtech">M.Tech</label>
  581.                 <span class="help-block"></span>
  582.  
  583.                 <select class="form-control input-sm" id="mtech" name="mtech" onchange="mtechFields();">
  584.                     <option>-- Select Branch --</option>
  585.                     <option value="CSE">CSE</option>
  586.                     <option value="CN & IS">CN & IS</option>
  587.                    <option value="IT">IT</option>
  588.                    <option value="DigistalSystems & Comp.Applications">DigistalSystems & Comp.Applications</option>
  589.                    <option value="Embedded Systems">Embedded Systems</option>
  590.                    <option value="VLSI Design">VLSI Design</option>
  591.                    <option value="Electrical Power Systems">Electrical Power Systems</option>
  592.                    <option value="CAD-CAM">CAD-CAM</option>
  593.                    <option value="Machine Design">Machine Design</option>
  594.                    <option value="Production Engineering">Production Engineering</option>
  595.                    <option value="Thermal Engineering">Thermal Engineering</option>
  596.                    <option value="Structural Engineering">Structural Engineering </option>
  597.                    <option value="VLSI&Embedded Systems">VLSI&Embedded Systems</option>
  598.                    <option value="Highway Engineering">Highway Engineering</option>
  599.                    <option value="Power Electronics">Power Electronics</option>
  600.                    <option value="Heat Ventilation&Air Conditioning">Heat Ventilation&Air Conditioning</option>
  601.                </select>
  602.            </div>
  603.            <div class="form-group col-md-4 col-sm-4">
  604.                <label for="mpharmacy">M.Pharmacy </label>
  605.                <span class="help-block"></span>
  606.  
  607.                <select class="form-control input-sm" id="mpharmacy" name="mpharmacy" onchange="mpharmacyFields();">
  608.                     <option>-- Select Branch --</option>
  609.                     <option value="Pharmaceutics">Pharmaceutics</option>
  610.                     <option value="Pharmaceutical Analysis">Pharmaceutical Analysis</option>
  611.                     <option value="Pharmacology">Pharmacology</option>
  612.                     <option value="Pharmaceutical Management&Regulatory Affairs">Pharmaceutical Management&Regulatory Affairs</option>
  613.                    <option value="Hospital & Clinical Pharmacy">Hospital & Clinical Pharmacy</option>
  614.  
  615.                </select>
  616.            </div>
  617.            <div class="form-group col-md-12 col-sm-12">
  618.                <div class="form-group col-md-4">
  619.                    <div class="checkbox">
  620.                        <input id="bpharmacy" type="checkbox" name="bpharmacy" value="bpharmacy" onchange="bpharmacyFields();">
  621.  
  622.                         B.Pharmacy
  623.  
  624.                     </div>
  625.                     <div class="checkbox">
  626.                         <input id="pharmad" type="checkbox" name="pharmad" value=" Pharma.D" onchange="pharmadFields();">
  627.  
  628.                         Pharma.D
  629.  
  630.                     </div>
  631.                     <div class="checkbox">
  632.                         <input id="pharmad_pb" type="checkbox" name="pharmad_pb" value="Pharmad_pb" onchange="pharmad_pbFields();">
  633.  
  634.                         pharma.D(pb)
  635.  
  636.                     </div>
  637.                 </div>
  638.                 <div class="form-group col-md-4">
  639.                     <div class="checkbox">
  640.                         <input id="mba" type="checkbox" name="mba" value="MBA" onchange="mbaFields();">
  641.  
  642.                         MBA
  643.  
  644.                     </div>
  645.                     <div class="checkbox">
  646.                         <input id="mca" type="checkbox" name="mca" value="MCA" onchange="mcaFields();">
  647.  
  648.                         MCA
  649.  
  650.                     </div>
  651.                     <div class="checkbox">
  652.                         <input id="pgdm" type="checkbox" name="pgdm" value="PGDM" onchange="pgdmFields();">
  653.  
  654.                         PGDM
  655.  
  656.                     </div>
  657.                 </div>
  658.                 <div class="form-group col-md-4">
  659.                     <div class="checkbox">
  660.                         <input id="bed" type="checkbox" name="bed" value="B.ED" onchange="bedFields();">
  661.  
  662.                         B.ED
  663.  
  664.                     </div>
  665.                     <div class="checkbox">
  666.                         <input id="ded" type="checkbox" name="ded" value="D.ED" onchange="dedFields();">
  667.  
  668.                         D.ED
  669.  
  670.                     </div>
  671.                     <div class="checkbox">
  672.                         <input id="mam" type="checkbox" name="mam" value="MAM" onchange="mamFields();">
  673.  
  674.                         MAM
  675.  
  676.                     </div>
  677.  
  678.                     <div class="checkbox">
  679.                         <input id="mtm" type="checkbox" name="mtm" value="MTM" onchange="mtmFields();">
  680.  
  681.                         MTM
  682.  
  683.                     </div>
  684.  
  685.                 </div>
  686.             </div>
  687.         </div>
  688.         <h4>Personal Information</h4>
  689.         <div class=" col-sm-12">
  690.         <div class="form-group col-md-12 col-sm-12">
  691.         <div class="form-group col-md-9 col-sm-9">
  692.         <div class="form-group col-md-4 col-sm-4" style="margin-left:-25px;">
  693.            <label for="firstname">First Name*   </label>
  694.                 <input type="text" name="stuname" class="form-control input-sm" id="stuname" placeholder="">
  695.                 </div>
  696.                     <div class="form-group col-md-4 col-sm-4">
  697.                 <label for="lastname">Last Name*    </label>
  698.                 <input type="text" name="lastname" class="form-control input-sm" id="lastname" placeholder="">
  699.                 </div>
  700.                     <div class="form-group col-md-4 col-sm-4">
  701.                 <label for="surname">Surname*   </label>
  702.                 <input type="text" name="surname" class="form-control input-sm" id="surname" placeholder="">
  703.                 </div>
  704.             </div>
  705.             <div class="form-group col-md-3 col-sm-3">
  706.             <div class="col-sm-12">
  707.             <label for="DOD" align="right">Date Of Birth *</label>
  708.             <input type="text" name="dob" id=" DOD" placeholder="     DD-MM-YYYY" align="right">
  709.             </div>
  710.         </div>
  711.         </div>
  712.             <div class="form-group col-md-3 col-sm-3">
  713.                 <label for="category">category. *</label>
  714.                
  715.                 <select class="form-control input-sm" id="Category" name="category">
  716.                     <option>-- Select Category  --</option>
  717.                     <option value="OC">OC</option>
  718.                     <option value="BC-A">BC-A</option>
  719.                     <option value="BC-B">BC-B</option>
  720.                     <option value="BC-C">BC-C</option>
  721.                     <option value="BC-D">BC-D</option>
  722.                     <option value="BC-E">BC-E</option>
  723.                     <option value="SC">SC</option>
  724.                     <option value="ST">ST</option>
  725.                     <option value="Others">Others</option>
  726.                 </select>
  727.             </div>
  728.             <div class="form-group col-md-3 col-sm-3">
  729.                 <label for="Gender">Gender. *</label>
  730.                 <!--     <span class="help-block"></span> -->
  731.                 <select class="form-control input-sm" id="Gender" name="gender">
  732.                     <option>-- Select Gender  --</option>
  733.                     <option value="Male">Male</option>
  734.                     <option value="Female">Female</option>
  735.                 </select>
  736.             </div>
  737.             <div class="form-group col-md-3 col-sm-3">
  738.                 <label for="Region">Region. *</label>
  739.                 <!--          <span class="help-block"></span>   -->
  740.                 <select class="form-control input-sm" name="region" id="Region">
  741.                     <option>-- Select Region(specify the state)  --</option>
  742.                     <option value="OU">OU</option>
  743.                     <option value="AU">AU</option>
  744.                     <option value="SVU">SVU</option>
  745.                     <option value="Other States">Other States</option>
  746.  
  747.                 </select>
  748.             </div>
  749.             <div class="form-group col-md-3 col-sm-3">
  750.                 <label for="Religion">Religion*</label>
  751.                 <input type="text" name="religion" class="form-control input-sm" id="Religion" placeholder="">
  752.             </div>
  753.             <div class="form-group col-md-4 col-sm-4">
  754.                 <label for="Aadhaar No">Aadhaar No*</label>
  755.                 <input type="text" name="aadhaarno" class="form-control input-sm" id="aadhaarno" placeholder="">
  756.             </div>
  757.             <div class="form-group col-md-4 col-sm-4">
  758.                 <label for="rationcardno">Ration Card No*</label>
  759.                 <input type="text" name="rationcardno" class="form-control input-sm" id="rationcardno" placeholder="">
  760.             </div>
  761.  
  762.  
  763.             <div class="form-group col-md-6 col-sm-6">
  764.                 <label for="mobileno">Mobileno*</label>
  765.                 <input type="text" name="mobileno" class="form-control input-sm" id="mobileno" placeholder="">
  766.             </div>
  767.  
  768.             <div class="form-group col-md-6 col-sm-6">
  769.                 <label for="email">Email Id*</label>
  770.                 <input type="text" name="email" class="form-control input-sm" id="email" placeholder="">
  771.             </div>
  772.             <div class="form-group col-md-6 col-sm-6">
  773.                 <label for="fathername">Father's Name*</label>
  774.                 <input type="text" name="fathername" class="form-control input-sm" id="fathername" placeholder="">
  775.             </div>
  776.             <div class="form-group col-md-6 col-sm-6">
  777.                 <label for="fatheroccu">Father's Occupation*</label>
  778.                 <input type="text" name="fatheroccu" class="form-control input-sm" id="fatheroccu" placeholder="">
  779.             </div>
  780.             <div class="form-group col-md-6 col-sm-6">
  781.                 <label for="mothername">Mother's Name*</label>
  782.                 <input type="text" name="mothername" class="form-control input-sm" id="mothername" placeholder="">
  783.             </div>
  784.             <div class="form-group col-md-6 col-sm-6">
  785.                 <label for="motheroccu">Mother's Occupation</label>
  786.                 <input type="text" name="motheroccu" class="form-control input-sm" id="motheroccu" placeholder="">
  787.             </div>
  788.             <div class="form-group col-md-6 col-sm-6">
  789.                 <label for="fathermob">Father's/Primary ContactNo*</label>
  790.                 <input type="text" name="fathermob" class="form-control input-sm" id="fathermob" placeholder="">
  791.             </div>
  792.             <div class="form-group col-md-6 col-sm-6">
  793.                 <label for="mothermob">Mother's/Secondary ContactNo</label>
  794.                 <input type="text" name="mothermob" class="form-control input-sm" id="mothermob" placeholder="">
  795.             </div>
  796.  
  797.             <div class="form-group col-md-12 col-sm-12">
  798.                 <label for="Parentaddr">Parent Residential Address*</label>
  799.                 <textarea name="parent_address" class="form-control input-sm" id="Parentaddr" rows="3"></textarea>
  800.             </div>
  801.             <div class="form-group col-md-6 col-sm-6">
  802.                 <label for="CET">Name of the CET Attempted*</label>
  803.                 <span class="help-block"></span>
  804.  
  805.                 <select class="form-control input-sm" id="cet" name="cet">
  806.                     <option>-- Select CET Attempted--</option>
  807.                     <option value="POLYCET">POLYCET</option>
  808.                     <option value="JEE">JEE</option>
  809.                     <option value="EAMCET">EAMCET</option>
  810.                     <option value="ECET">ECET</option>
  811.                     <option value="ICET">ICET</option>
  812.                     <option value="PGECET">PGECET</option>
  813.                     <option value="GATE">GATE</option>
  814.                     <option value="GPAT">GPAT</option>
  815.                     <option value="EDCET">EDCET</option>
  816.                     <option value="DIETCET">DIETCET</option>
  817.                 </select>
  818.             </div>
  819.             <div class="form-group col-md-6 col-sm-6">
  820.                 <label for="hallticketno">Hall Ticket No*</label>
  821.                 <input type="text" class="form-control input-sm" name="hallticketno" id="hallticketno" placeholder="">
  822.             </div>
  823.             <div class="form-group col-md-6 col-sm-6">
  824.                 <label for="Rank">Rank*</label>
  825.                 <input type="text" name="rank" class="form-control input-sm" id="rank" placeholder="">
  826.             </div>
  827.         </div>
  828.         <h4>Education qualification:</h4>
  829.         <div class="container" style="margin-left:-14px;">
  830.  
  831.  
  832.             <table class="table warning" width:100%;>
  833.                 <thead>
  834.                     <tr class="warning">
  835.                         <th>
  836.                             Name of the Exam
  837.  
  838.                         </th>
  839.                         <th>Nmae of the board/university</th>
  840.                         <th>Rollno</th>
  841.                         <th>
  842.                             Aggregate marks<br>
  843.                             secured<br>(maths,physics,<br>chemistry)
  844.                         </th>
  845.                         <th>
  846.                             Aggregate maximum
  847.                             marks
  848.                         </th>
  849.                         <th>
  850.                             Groups Marks
  851.                             Secured
  852.                         </th>
  853.                         <th>Groups Maximum <br>Marks </th>
  854.                         <th>
  855.                             Month&<br>
  856.                            year passing
  857.                        </th>
  858.                         <th>
  859.                            Total<br>
  860.                        percentage
  861.                        </th>
  862.                         <th>
  863.                            Groups<br>
  864.                            percentage
  865.                        </th>
  866.                    </tr>
  867.                </thead>
  868.                <tbody>
  869.                    <tr class="warning" >
  870.                        <td>
  871.                            <label>SSc/10th</label>
  872.                        </td>
  873.                        <td><input type="text" name="ssc_board" id="input"></td>
  874.                        <td><input type="text" name="ssc_rollno" id="input"></td>
  875.                        <td><input type="text" name="ssc_ams" id="input"></td>
  876.                        <td><input type="text" name="ssc_amm" id="input"></td>
  877.                        <td><input type="text" name="ssc_gms" id="input"></td>
  878.                        <td><input type="text" name="ssc_gmm" id="input"></td>
  879.                        <td><input type="text" name="ssc_yearpassing" id="input"></td>
  880.                         <td><input type="text" name="ssc_tp" id="input"></td>
  881.                         <td><input type="text" name="ssc_gp" id="input"></td>
  882.                    </tr>
  883.  
  884.                    <tr class="warning">
  885.                        <td>
  886.                            <label>inter/10+2</label>
  887.                        </td>
  888.                        <td><input type="text" name="inter_board" id="input"></td>
  889.                        <td><input type="text" name="inter_rollno" id="input"></td>
  890.                        <td><input type="text" name="inter_ams" id="input"></td>
  891.                        <td><input type="text" name="inter_amm" id="input"></td>
  892.                        <td><input type="text" name="inter_gms" id="input"></td>
  893.                        <td><input type="text" name="inter_gmm" id="input"></td>
  894.                        <td><input type="text" name="inter_yearpassing" id="input"></td>
  895.                             <td><input type="text" name="inter_tp" id="input"></td>
  896.                         <td><input type="text" name="inter_gp" id="input"></td>
  897.                    </tr>
  898.                    <tr class="warning" id="divDegree">
  899.                        <td>
  900.                            <label>Degree</label>
  901.                        </td>
  902.                        <td><input type="text" name="degree_univ" id="input"></td>
  903.                        <td><input type="text" name="degree_rollno" id="input"></td>
  904.                        <td><input type="text" name="degree_ams" id="input"></td>
  905.                        <td><input type="text" name="degree_amm" id="input"></td>
  906.                        <td><input type="text" name="degree_gms" id="input"></td>
  907.                        <td><input type="text" name="degree_gmm" id="input"></td>
  908.                        <td><input type="text" name="degree_yearpassing" id="input"></td>
  909.                          <td><input type="text" name="degree_tp" id="input"></td>
  910.                        <td><input type="text" name="degree_gp" id="input"></td>
  911.                    </tr>
  912.                    <tr class="warning" id="divPG">
  913.                        <td>
  914.                            <label>PG</label>
  915.                        </td>
  916.                        <td><input type="text" name="pg_univ" id="input"></td>
  917.                        <td><input type="text" name="pg_rollno" id="input"></td>
  918.                        <td><input type="text" name="pg_ams" id="input"></td>
  919.                        <td><input type="text" name="pg_amm" id="input"></td>
  920.                        <td><input type="text" name="pg_gms" id="input"></td>
  921.                        <td><input type="text" name="pg_gmm" id="input"></td>
  922.                        <td><input type="text" name="pg_yearpassing" id="input"></td>
  923.                            <td><input type="text" name="pg_tp" id="input"></td>
  924.                        <td><input type="text" name="pg_gp" id="input"></td>
  925.                    </tr>
  926.  
  927.                </tbody>
  928.            </table>
  929.        </div>
  930.        <div class="form-group col-md-4 col-sm-4">
  931.             <label for="referencename">Reference Name*  </label>
  932.            <input type="text" name="referencename" class="form-control input-sm" id="referencename" placeholder="">
  933.        </div>
  934.        <div class="form-group col-md-4 col-sm-4" style="float:right">
  935.             <label for="contactno">Reference Contact No*    </label>
  936.            <input type="text" name="contactno" class="form-control input-sm" id="contactno" placeholder="">
  937.        </div>
  938.  
  939.  
  940.        
  941.        <div class="col-md-12 col-sm-12">
  942.            <div class="form-group col-md-3 col-sm-3 pull-middle">
  943.                <center style="margin-left: 502px;">
  944.                    <!--  <input type="submit" name="submit" class="btn btn-default" value="SUBMIT" /> -->
  945.                    <input type="submit" name="submit" class="test" value="Save" />
  946.                 </center>
  947.             </div>
  948.         </div>
  949.         </form>
  950.     </div>
  951.     </div>
  952.     </div>
  953. <script src="javascript/checkbox.js"></script>
  954.  
  955. </body>
  956. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!