473,395 Members | 1,937 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

home > topics > javascript > questions > jquery/javascript not working

Join Bytes to post your question to a community of 473,395 software developers and data experts.

Jquery/Javascript not working

I am working on webpage which has following :

- Collapsible panel as it has lot of fields( have used Accordian style for this purpose)

- 3 Javascripts to enable/disable set of fields based on Checkbox

- Jquery to show/hide the tablerows depending upon the dropdown so if they select 0 nothing shows, if they select 1 row 1 shows and selct 2 to display 2 rows and so on..

The problem I am facing is that scripts and query works separately but not when they are combined together. Please help !!!

Below is the code :

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.   <meta name="viewport" content="width=device-width, initial-scale=1">
  5.   <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  6.   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  7.   <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  8.   <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  9.   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  10. <!--This is Javascript to disable the address fields if user doesn't tick the checkbox-->
  11. <script type="text/javascript">
  12. $(document).ready(function(){
  13.     $('#sccb').click(function(){
  14.         if (this.checked) {
  15.             $('#cns').removeAttr("disabled");
  16.             $('#cns2').removeAttr("disabled");
  17.             $('#cns3').removeAttr("disabled");
  18.             $('#cns4').removeAttr("disabled");
  19.             $('#cns5').removeAttr("disabled");
  20.             $('#cns6').removeAttr("disabled");
  21.             $('#cns7').removeAttr("disabled");
  22.         } else {
  23.             $("#cns").attr("disabled", true);
  24.             $("#cns2").attr("disabled", true);
  25.             $("#cns3").attr("disabled", true);
  26.             $('#cns4').attr("disabled", true);
  27.             $('#cns5').attr("disabled", true);
  28.             $('#cns6').attr("disabled", true);
  29.             $('#cns7').attr("disabled", true);
  30.         }
  31.     });
  32. });
  33. </script>
  34. <script type="text/javascript">
  35. $(document).ready(function(){
  36.     $('#sccb1').click(function(){
  37.         if (this.checked) {
  38.             $('#cns8').removeAttr("disabled");
  39.             $('#cns9').removeAttr("disabled");
  40.             $('#cns10').removeAttr("disabled");
  41.             $('#cns11').removeAttr("disabled");
  42.             $('#cns12').removeAttr("disabled");
  43.             $('#cns13').removeAttr("disabled");
  44.             $('#cns14').removeAttr("disabled");
  45.  
  46.         } else {
  47.             $("#cns8").attr("disabled", true);
  48.             $("#cns9").attr("disabled", true);
  49.             $("#cns10").attr("disabled", true);
  50.             $("#cns11").attr("disabled", true);
  51.             $("#cns12").attr("disabled", true);
  52.             $("#cns13").attr("disabled", true);
  53.             $("#cns14").attr("disabled", true);
  54.         }
  55.     });
  56. });
  57. </script>
  58. <script type="text/javascript">
  59. $(document).ready(function(){
  60.     $('#sccb2').click(function(){
  61.         if (this.checked) {
  62.             $('#cns15').removeAttr("disabled");
  63.             $('#cns16').removeAttr("disabled");
  64.             $('#cns17').removeAttr("disabled");
  65.             $('#cns18').removeAttr("disabled");
  66.             $('#cns19').removeAttr("disabled");
  67.             $('#cns20').removeAttr("disabled");
  68.             $('#cns21').removeAttr("disabled");
  69.  
  70.         } else {
  71.             $("#cns15").attr("disabled", true);
  72.             $("#cns16").attr("disabled", true);
  73.             $("#cns17").attr("disabled", true);
  74.             $("#cns18").attr("disabled", true);
  75.             $("#cns19").attr("disabled", true);
  76.             $("#cns20").attr("disabled", true);
  77.             $("#cns21").attr("disabled", true);
  78.         }
  79.     });
  80. });
  81. </script>
  82. <script>
  83. $( document ).ready(function() {
  84.     $( "select" ).change(function () {
  85.         var val = $( "select" ).val();
  86.         if (val != 'select one') {
  87.             var tableRows = $("table tr");
  88.             jQuery.each(tableRows, function(i ,tr) {
  89.                 if (i > val) {
  90.                     $(tr).hide();
  91.                 } else {
  92.                     $(tr).show();
  93.                 }
  94.             })
  95.         }
  96.       }
  97.     )
  98. });
  99. </script>
  100.   <style>
  101. .input {
  102. display: inline;
  103. -webkit-box-sizing: content-box;
  104. -moz-box-sizing: content-box;
  105. box-sizing: content-box;
  106. position: absolute;
  107. padding: 4px;
  108. border: 2px solid #b7b7b7;
  109. -webkit-border-radius: 4px;
  110. border-radius: 4px;
  111. font: normal 14px/normal "Comic Sans MS", cursive, sans-serif;
  112. color: rgba(0,0,0,1);
  113. -o-text-overflow: ellipsis;
  114. text-overflow: ellipsis;
  115. background: rgba(255,255,255,1);
  116. -webkit-box-shadow: 0 0 1px 0 rgba(0,0,0,0.5) ;
  117. box-shadow: 0 0 1px 0 rgba(0,0,0,0.5) ;
  118. text-shadow: 1px 1px 0 rgba(255,255,255,0.66) ;
  119. -webkit-transition: all 200ms cubic-bezier(0.42, 0, 1, 1);
  120. -moz-transition: all 200ms cubic-bezier(0.42, 0, 1, 1);
  121. -o-transition: all 200ms cubic-bezier(0.42, 0, 1, 1);
  122. transition: all 200ms cubic-bezier(0.42, 0, 1, 1);
  123. }
  124. tbody tr {
  125. display: none;
  126. }
  127. </style>
  128. </head>
  129. <body>
  130.  
  131. <div class="container">
  132.   <h2>Accordion Example</h2>
  133.   <div class="panel-group" id="accordion">
  134.     <div class="panel panel-default">
  135.       <div class="panel-heading">
  136.         <h4 class="panel-title">
  137.           <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">Collapsible Group 1</a>
  138.         </h4>
  139.       </div>
  140.       <div id="collapse1" class="panel-collapse collapse in">
  141.         <div class="panel-body">
  142. <fieldset>
  143. <fieldset style="width: 1031px;"><legend style="font-weight: bold; font-family: Comic Sans MS;">Personal Details</legend><br>
  144. <div style="width: 1021px;" class="form-group"> <big><label for="stuftitle">Title<span style="color: red;">*</span></label></big>
  145. &nbsp; &nbsp; &nbsp;&nbsp;
  146. <select name="stuftitle" class="input">
  147. <option value="">-select--</option>
  148. <option>Mr</option>
  149. <option>Dr</option>
  150. </select>
  151. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  152. &nbsp;&nbsp;&nbsp;
  153. <big><label for="stuffname">Firstname<span style="color: red;">*</span></label></big>
  154. &nbsp; &nbsp;
  155. <input size="15" name="stuffname" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  156. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  157. &nbsp;&nbsp;
  158. <big><label for="stufmname">Middlename<span style="color: red;">*</span></label></big>&nbsp;
  159. <input size="15" class="input" name="stufmname">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  160. <big><label for="stufsname">Surname<span style="color: red;">*</span></label></big>
  161. &nbsp;&nbsp;&nbsp; <input size="16" class="input" name="stufsname"></div>
  162. <br>
  163. <big><label for="stufgender">Gender<span style="color: red;">*</span></label></big>&nbsp;
  164. <select name="stufgender" class="input">
  165. <option value="">-select--</option>
  166. <option>Male</option>
  167. <option>Mx</option>
  168. </select>
  169. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  170. &nbsp;
  171. <big><label for="stufdob">Birthdate<span style="color: red;">*</span></label></big>
  172. &nbsp;&nbsp;&nbsp;&nbsp; <input size="15" name="stufdob" class="input" type="date">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  173. &nbsp; &nbsp;&nbsp;
  174. <big><label for="stufmobile">Mobile<span style="color: red;">*</span></label></big>
  175. &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; <input size="15" class="input" name="stufmobile">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  176. &nbsp;&nbsp;
  177. <big><label for="stufemail">Email<span style="color: red;">*</span></label></big>
  178. &nbsp;&nbsp;&nbsp; <input size="19" class="input" name="stufemail" type="email">
  179. </fieldset>
  180. <fieldset style="width: 1012px;">
  181. <legend><br>
  182. <span style="font-weight: bold; font-family: Comic Sans MS;">Address
  183. Details</span></legend>
  184. <div style="width: 1021px;" class="form-group">
  185. <big><label for="stufaddress">If address different than Applicant's address please tick the checkbox? <span style="color: red;">*</span></label></big>&nbsp;&nbsp;<input type="checkbox" id="sccb" name="stufaddress" value="stufaddress"><br><br>
  186. <big><label for="stufadd1">Add. Line 1<span style="color: red;">*</span></label></big>
  187. &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; <input type="text" class="input" id="cns" name="stufadd1" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  188. &nbsp; &nbsp; &nbsp; &nbsp; <big><label for="stufadd2">Add. Line 2</label></big>
  189. &nbsp; &nbsp; &nbsp;&nbsp; <input type="text" class="input" id="cns2" name="stufadd2" disabled="disabled"/>
  190. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  191. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
  192. <big><label for="stufadd3">Add. Line 3</label></big>
  193. &nbsp;<input type="text" class="input" id="cns3" name="stufadd3" disabled="disabled" size="18"/><br>
  194. <br>
  195. <big><label for="stufcity">City<span style="color: red;">*</span></label></big>
  196. &nbsp;&nbsp;&nbsp;
  197. <input size="15" class="input" type="text" id="cns4" name="stufcity" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  198. <big><label for="stufstate">State<span style="color: red;">*</span></label></big>
  199. &nbsp;&nbsp;
  200. <input size="15" class="input" type="text" id="cns5" name="stufstate" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  201. <big><label for="stufcountry">Country<span style="color: red;">*</span></label></big>
  202. &nbsp;&nbsp;&nbsp;&nbsp;
  203. <input size="15" class="input" type="text" id="cns6" name="stufcountry" disabled="disabled"/>&nbsp;
  204. &nbsp;&nbsp;&nbsp;&nbsp;
  205. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  206. &nbsp; &nbsp; &nbsp; <big><label for="stufpincode">Pincode<span style="color: red;">*</span></label></big>
  207. &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; <input size="10" class="input" type="text" id="cns7" name="stufpincode" disabled="disabled"/> </div>
  208. </fieldset>
  209. <br style="font-family: Comic Sans MS;">
  210. <fieldset>
  211. <legend style="font-weight: bold; font-family: Comic Sans MS;">Qualification
  212. Details</legend>
  213. <div style="width: 1021px;" class="form-group"><big><big><small><label for="stufpgd">Post Graduation </label></small><label for="stufpgd"></label></big>&nbsp;</big>&nbsp;&nbsp;
  214. <input name="stufpgd" class="input">
  215. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  216. <big><label for="stufgd">Graduation</label></big>
  217. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stufgd">
  218. &nbsp; &nbsp;
  219. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  220. <big><label for="stuf12">12th Marks/Grade</label></big>
  221. &nbsp; <input size="10" class="input" name="stuf12"><br>
  222. <div style="width: 1021px;" class="form-group"><span style="color: red;">(include
  223. University name)</span>
  224. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  225. <span style="color: red;">(include University name)</span><br>
  226. <br>
  227. <big><label for="stufpq">Profesional Qualification</label></big>
  228. &nbsp;
  229. <input name="stufpq" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  230. &nbsp;&nbsp;
  231. <big><label for="stuf10">10th Mark/Grade</label></big> &nbsp; &nbsp; <input size="10" class="input" name="stuf10">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  232. &nbsp;&nbsp;
  233. <big><label for="stufalumni">School Alumni?</label></big>
  234. &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;
  235. <select name="stufalumni" class="input">
  236. <option value="">-select--</option>
  237. <option>Yes</option>
  238. <option>No
  239. </option>
  240. </select>
  241. </div>
  242. </div>
  243. </fieldset>
  244. <br>
  245. <div style="width: 1021px;" class="form-group">
  246. <fieldset><legend style="font-family: Comic Sans MS; font-weight: bold;">Job/Business
  247. Detail</legend>
  248. <div style="width: 1021px;" class="form-group"><big><label for="stufcname">Company Name</label></big>
  249. &nbsp;&nbsp; <input name="stufcname" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  250. <big><label for="stufoccupation">Occupation</label></big>
  251. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stufoccupation">
  252. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  253. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  254. &nbsp; &nbsp;
  255. <big><label for="stufdesignation">Designation</label></big>
  256. &nbsp;&nbsp; <input size="18" class="input" name="stufdesignation"><br>
  257. <br>
  258. <big><label for="stufcadd1">Add. Line 1</label></big>
  259. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <input name="stufcadd1" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  260. &nbsp; &nbsp;&nbsp;
  261. <big><label for="stufcadd2">Add. Line 2</label></big>
  262. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stufcadd2">&nbsp;&nbsp;
  263. &nbsp;
  264. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  265. &nbsp; &nbsp; &nbsp;
  266. <big><label style="font-weight: bold;" for="stufcadd3">Add. Line 3</label></big>
  267. &nbsp; &nbsp;&nbsp; &nbsp; <input size="16" class="input" name="stufcadd3"><br>
  268. <br>
  269. <big><label for="stufccity">City</label></big>
  270. &nbsp;&nbsp;&nbsp; <input size="15" name="stufccity" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  271. &nbsp; &nbsp;
  272. <big><label for="stufcstate">State</label></big>
  273. &nbsp;&nbsp; <input size="15" class="input" name="stufcstate">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  274. &nbsp; &nbsp;
  275. <big><label for="stufcpincode">Pincode</label></big>
  276. &nbsp; <input size="15" class="input" name="stufcpincode">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  277. &nbsp;&nbsp;
  278. <big><label for="stufdoj">Joining Date</label></big>
  279. &nbsp;&nbsp;&nbsp; <input class="input" name="stufdoj" size="15" type="date">
  280. </div>
  281. </fieldset>
  282. </div>
  283. </fieldset>
  284.         </div>
  285.       </div>
  286.     </div>
  287.     <div class="panel panel-default">
  288.       <div class="panel-heading">
  289.         <h4 class="panel-title">
  290.           <a data-toggle="collapse" data-parent="#accordion" href="#collapse2">Collapsible Group 2</a>
  291.         </h4>
  292.       </div>
  293.       <div id="collapse2" class="panel-collapse collapse">
  294.         <div class="panel-body">
  295. <fieldset>
  296. <fieldset style="width: 1031px;"><legend style="font-weight: bold; font-family: Comic Sans MS;">Personal Details</legend><br>
  297. <div style="width: 1021px;" class="form-group"> <big><label for="stumtitle">Title<span style="color: red;">*</span></label></big>
  298. &nbsp; &nbsp; &nbsp;&nbsp;
  299. <select name="stumtitle" class="input">
  300. <option value="">-select--</option>
  301. <option>Mrs</option>
  302. <option>Ms</option>
  303. <option>Miss</option>
  304. <option>Dr</option>
  305. </select>
  306. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  307. &nbsp;&nbsp;&nbsp;
  308. <big><label for="stumfname">Firstname<span style="color: red;">*</span></label></big>
  309. &nbsp; &nbsp;
  310. <input size="15" name="stumfname" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  311. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  312. &nbsp;&nbsp;
  313. <big><label for="stummname">Middlename<span style="color: red;">*</span></label></big>&nbsp;
  314. <input size="15" class="input" name="stummname">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  315. <big><label for="stumsname">Surname<span style="color: red;">*</span></label></big>
  316. &nbsp;&nbsp;&nbsp; <input size="16" class="input" name="stumsname"></div>
  317. <br>
  318. <big><label for="stumgender">Gender<span style="color: red;">*</span></label></big>&nbsp;
  319. <select name="stumgender" class="input">
  320. <option value="">-select--</option>
  321. <option>Female</option>
  322. <option>Mx</option>
  323. </select>
  324. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  325. &nbsp;
  326. <big><label for="stumdob">Birthdate<span style="color: red;">*</span></label></big>
  327. &nbsp;&nbsp;&nbsp;&nbsp; <input size="15" name="stumdob" class="input" type="date">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  328. &nbsp; &nbsp;&nbsp;
  329. <big><label for="stummobile">Mobile<span style="color: red;">*</span></label></big>
  330. &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; <input size="15" class="input" name="stummobile">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  331. &nbsp;&nbsp;
  332. <big><label for="stumemail">Email<span style="color: red;">*</span></label></big>
  333. &nbsp;&nbsp;&nbsp; <input size="19" class="input" name="stumemail" type="email">
  334. </fieldset>
  335. <fieldset style="width: 1012px;">
  336. <legend><br>
  337. <span style="font-weight: bold; font-family: Comic Sans MS;">Address
  338. Details</span></legend>
  339. <div style="width: 1021px;" class="form-group">
  340. <big><label for="stumaddress">If address different than Applicant's address please tick the checkbox? <span style="color: red;">*</span></label></big><big>&nbsp;&nbsp;<input type="checkbox" id="sccb1" name="stumaddress" value="stumaddress"><br><br>
  341. <label for="stumadd1">Add. Line 1<span style="color: red;">*</span></label>
  342. &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; <input type="text" id="cns8" class="input" name="stumadd1" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  343. &nbsp; &nbsp; &nbsp; &nbsp; <label for="stumadd2">Add. Line 2</label>
  344. &nbsp; &nbsp; &nbsp;&nbsp; <input type="text" id="cns9" class="input" name="stumadd2" disabled="disabled"/>
  345. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  346. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
  347. <label for="stumadd3">Add. Line 3</label>
  348. &nbsp; <input size="18" type="text" id="cns10" class="input" name="stumadd3" disabled="disabled"/><br>
  349. <br>
  350. <label for="stumcity">City<span style="color: red;">*</span></label>
  351. &nbsp;&nbsp;&nbsp;
  352. <input size="15" type="text" id="cns11" class="input" name="stumcity" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  353. <label for="stumstate">State<span style="color: red;">*</span></label>
  354. &nbsp;&nbsp;
  355. <input size="15" type="text" id="cns12" class="input" name="stumstate" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  356. <label for="stumcountry">Country<span style="color: red;">*</span></label>
  357. &nbsp;&nbsp;&nbsp;&nbsp;
  358. <input size="15" type="text" id="cns13" class="input" name="stumcountry" disabled="disabled"/>&nbsp;
  359. &nbsp;&nbsp;&nbsp;&nbsp;
  360. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  361. &nbsp; &nbsp; &nbsp;<label for="stumpincode">Pincode<span style="color: red;">*</span></label>
  362. &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; <input size="10" type="text" id="cns14" class="input" name="stumpincode" disabled="disabled"/></div>
  363. </fieldset>
  364. <br style="font-family: Comic Sans MS;">
  365. <fieldset>
  366. <legend style="font-weight: bold; font-family: Comic Sans MS;">Qualification
  367. Details</legend>
  368. <div style="width: 1021px;" class="form-group"><big><big><small><label for="stumpgd">Post Graduation </label></small><label for="stumpgd"></label></big>&nbsp;</big>&nbsp;&nbsp;
  369. <input name="stumpgd" class="input">
  370. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  371. <big><label for="stumgd">Graduation</label></big>
  372. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stumgd">
  373. &nbsp; &nbsp;
  374. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  375. <big><label for="stum12">12th Marks/Grade</label></big>
  376. &nbsp; <input size="10" class="input" name="stum12"><br>
  377. <div style="width: 1021px;" class="form-group"><span style="color: red;">(include
  378. University name)</span>
  379. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  380. <span style="color: red;">(include University name)</span><br>
  381. <br>
  382. <big><label for="stumpq">Profesional Qualification</label></big>
  383. &nbsp;
  384. <input name="stumpq" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  385. &nbsp;&nbsp;
  386. <big><label for="stum10">10th Mark/Grade</label></big> &nbsp; &nbsp; <input size="10" class="input" name="stum10">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  387. &nbsp;&nbsp;
  388. <big><label for="stumalumni">School Alumni?</label></big>
  389. &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;
  390. <select name="stumalumni" class="input">
  391. <option value="">-select--</option>
  392. <option>Yes</option>
  393. <option>No
  394. </option>
  395. </select>
  396. </div>
  397. </div>
  398. </fieldset>
  399. <br>
  400. <div style="width: 1021px;" class="form-group">
  401. <fieldset><legend style="font-family: Comic Sans MS; font-weight: bold;">Job/Business
  402. Detail</legend>
  403. <div style="width: 1021px;" class="form-group"><big><label for="stumcname">Company Name</label></big>
  404. &nbsp;&nbsp; <input name="stumcname" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  405. <big><label for="stumoccupation">Occupation</label></big>
  406. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stumoccupation">
  407. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  408. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  409. &nbsp; &nbsp;
  410. <big><label for="stumdesignation">Designation</label></big>
  411. &nbsp;&nbsp; <input size="18" class="input" name="stumdesignation"><br>
  412. <br>
  413. <big><label for="stumcadd1">Add. Line 1</label></big>
  414. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <input name="stumcadd1" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  415. &nbsp; &nbsp;&nbsp;
  416. <big><label for="stumcadd2">Add. Line 2</label></big>
  417. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stumcadd2">&nbsp;&nbsp;
  418. &nbsp;
  419. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  420. &nbsp; &nbsp; &nbsp;
  421. <big><label style="font-weight: bold;" for="stumcadd3">Add. Line 3</label></big>
  422. &nbsp; &nbsp;&nbsp; &nbsp; <input size="16" class="input" name="stumcadd3"><br>
  423. <br>
  424. <big><label for="stumccity">City</label></big>
  425. &nbsp;&nbsp;&nbsp; <input size="15" name="stumccity" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  426. &nbsp; &nbsp;
  427. <big><label for="stumcstate">State</label></big>
  428. &nbsp;&nbsp; <input size="15" class="input" name="stumcstate">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  429. &nbsp; &nbsp;
  430. <big><label for="stumcpincode">Pincode</label></big>
  431. &nbsp; <input size="15" class="input" name="stumcpincode">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  432. &nbsp;&nbsp;
  433. <big><label for="stumdoj">Joining Date</label></big>
  434. &nbsp;&nbsp;&nbsp; <input class="input" name="stumdoj" size="15" type="date">
  435. </div>
  436. </fieldset>
  437. </div>
  438. </fieldset>
  439.         </div>
  440.       </div>
  441.     </div>
  442.     <div class="panel panel-default">
  443.       <div class="panel-heading">
  444.         <h4 class="panel-title">
  445.           <a data-toggle="collapse" data-parent="#accordion" href="#collapse3">Collapsible Group 3</a>
  446.         </h4>
  447.       </div>
  448.       <div id="collapse3" class="panel-collapse collapse">
  449.         <div class="panel-body">
  450. <fieldset>
  451. <fieldset style="width: 1031px;"><legend style="font-weight: bold; font-family: Comic Sans MS;">Personal Details</legend><br>
  452. <div style="width: 1021px;" class="form-group"> <big><label for="stugtitle">Title<span style="color: red;">*</span></label></big>
  453. &nbsp; &nbsp; &nbsp;&nbsp;
  454. <select name="stugtitle" class="input">
  455. <option value="">-select--</option>
  456. <option>Mr</option>
  457. <option>Mrs</option>
  458. <option>Ms</option>
  459. <option>Miss</option>
  460. <option>Dr</option>
  461. </select>
  462. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  463. &nbsp;&nbsp;&nbsp;
  464. <big><label for="stugfname">Firstname<span style="color: red;">*</span></label></big>
  465. &nbsp; &nbsp;
  466. <input size="15" name="stugfname" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  467. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  468. &nbsp;&nbsp;
  469. <big><label for="stugmname">Middlename<span style="color: red;">*</span></label></big>&nbsp;
  470. <input size="15" class="input" name="stugmname">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  471. <big><label for="stugsname">Surname<span style="color: red;">*</span></label></big>
  472. &nbsp;&nbsp;&nbsp; <input size="16" class="input" name="stugsname"></div>
  473. <br>
  474. <big><label for="stuggender">Gender<span style="color: red;">*</span></label></big>&nbsp;
  475. <select name="stuggender" class="input">
  476. <option value="">-select--</option>
  477. <option>Male</option>
  478. <option>Female</option>
  479. <option>Mx</option>
  480. </select>
  481. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  482. &nbsp;
  483. <big><label for="stugdob">Birthdate<span style="color: red;">*</span></label></big>
  484. &nbsp;&nbsp;&nbsp;&nbsp; <input size="15" name="stugdob" class="input" type="date">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  485. &nbsp; &nbsp;&nbsp;
  486. <big><label for="stugmobile">Mobile<span style="color: red;">*</span></label></big>
  487. &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; <input size="15" class="input" name="stugmobile">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  488. &nbsp;&nbsp;
  489. <big><label for="stugemail">Email<span style="color: red;">*</span></label></big>
  490. &nbsp;&nbsp;&nbsp; <input size="19" class="input" name="stugemail" type="email">
  491. </fieldset>
  492. <fieldset style="width: 1012px;">
  493. <legend><br>
  494. <span style="font-weight: bold; font-family: Comic Sans MS;">Address
  495. Details</span></legend>
  496. <div style="width: 1021px;" class="form-group">
  497. <big><label for="stugaddress">If address different than Applicant's address please tick the checkbox?<span style="color: red;">*</span></label></big>
  498. &nbsp;&nbsp;<input type="checkbox" id="sccb2" name="stugaddress" value="stugaddress"><br><br>
  499. <big><label for="stugadd1">Add. Line 1<span style="color: red;">*</span></label></big>
  500. &nbsp; &nbsp;&nbsp;&nbsp;&nbsp; <input type="text" id="cns15" class="input" name="stugadd1" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  501. &nbsp; &nbsp; &nbsp; &nbsp; <big><label for="stugadd2">Add. Line 2</label></big>
  502. &nbsp; &nbsp; &nbsp;&nbsp; <input type="text" id="cns16" class="input" name="stugadd2" disabled="disabled"/>
  503. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  504. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
  505. <big><label for="stugadd3">Add. Line 3</label></big>
  506. &nbsp; <input size="18" type="text" id="cns17" class="input" name="stugadd3" disabled="disabled"/><br>
  507. <br>
  508. <big><label for="stugcity">City<span style="color: red;">*</span></label></big>
  509. &nbsp;&nbsp;&nbsp;
  510. <input size="15" type="text" id="cns18" class="input" name="stugcity" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  511. <big><label for="stugstate">State<span style="color: red;">*</span></label></big>
  512. &nbsp;&nbsp;
  513. <input size="15" type="text" id="cns19" class="input" name="stugstate" disabled="disabled"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  514. <big><label for="stugcountry">Country<span style="color: red;">*</span></label></big>
  515. &nbsp;&nbsp;&nbsp;&nbsp;
  516. <input size="15" type="text" id="cns20" class="input" name="stugcountry" disabled="disabled"/>&nbsp;
  517. &nbsp;&nbsp;&nbsp;&nbsp;
  518. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  519. &nbsp; &nbsp; &nbsp; <big><label for="stugpincode">Pincode<span style="color: red;">*</span></label></big>
  520. &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; <input size="10" type="text" id="cns21" class="input" name="stumgpincode" disabled="disabled"/></div>
  521. </fieldset>
  522. <br style="font-family: Comic Sans MS;">
  523. <fieldset>
  524. <legend style="font-weight: bold; font-family: Comic Sans MS;">Qualification
  525. Details</legend>
  526. <div style="width: 1021px;" class="form-group"><big><big><small><label for="stugpgd">Post Graduation </label></small><label for="stugpgd"></label></big>&nbsp;</big>&nbsp;&nbsp;
  527. <input name="stugpgd" class="input">
  528. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  529. <big><label for="stuggd">Graduation</label></big>
  530. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stuggd">
  531. &nbsp; &nbsp;
  532. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  533. <big><label for="stug12">12th Marks/Grade</label></big>
  534. &nbsp; <input size="10" class="input" name="stug12"><br>
  535. <div style="width: 1021px;" class="form-group"><span style="color: red;">(include
  536. University name)</span>
  537. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  538. <span style="color: red;">(include University name)</span><br>
  539. <br>
  540. <big><label for="stugpq">Profesional Qualification</label></big>
  541. &nbsp;
  542. <input name="stugpq" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  543. &nbsp;&nbsp;
  544. <big><label for="stug10">10th Mark/Grade</label></big> &nbsp; &nbsp; <input size="10" class="input" name="stug10">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  545. &nbsp;&nbsp;
  546. <big><label for="stugalumni">School Alumni?</label></big>
  547. &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;
  548. <select name="stugalumni" class="input">
  549. <option value="">-select--</option>
  550. <option>Yes</option>
  551. <option>No
  552. </option>
  553. </select>
  554. </div>
  555. </div>
  556. </fieldset>
  557. <br>
  558. <div style="width: 1021px;" class="form-group">
  559. <fieldset><legend style="font-family: Comic Sans MS; font-weight: bold;">Job/Business
  560. Detail</legend>
  561. <div style="width: 1021px;" class="form-group"><big><label for="stugcname">Company Name</label></big>
  562. &nbsp;&nbsp; <input name="stugcname" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  563. <big><label for="stugoccupation">Occupation</label></big>
  564. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stugoccupation">
  565. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  566. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  567. &nbsp; &nbsp;
  568. <big><label for="stugdesignation">Designation</label></big>
  569. &nbsp;&nbsp; <input size="18" class="input" name="stugdesignation"><br>
  570. <br>
  571. <big><label for="stugcadd1">Add. Line 1</label></big>
  572. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <input name="stugcadd1" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  573. &nbsp; &nbsp;&nbsp;
  574. <big><label for="stugcadd2">Add. Line 2</label></big>
  575. &nbsp; &nbsp; &nbsp;&nbsp; <input class="input" name="stugcadd2">&nbsp;&nbsp;
  576. &nbsp;
  577. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  578. &nbsp; &nbsp; &nbsp;
  579. <big><label style="font-weight: bold;" for="stugcadd3">Add. Line 3</label></big>
  580. &nbsp; &nbsp;&nbsp; &nbsp; <input size="16" class="input" name="stugcadd3"><br>
  581. <br>
  582. <big><label for="stugccity">City</label></big>
  583. &nbsp;&nbsp;&nbsp; <input size="15" name="stugccity" class="input">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  584. &nbsp; &nbsp;
  585. <big><label for="stugcstate">State</label></big>
  586. &nbsp;&nbsp; <input size="15" class="input" name="stugcstate">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  587. &nbsp; &nbsp;
  588. <big><label for="stugcpincode">Pincode</label></big>
  589. &nbsp; <input size="15" class="input" name="stugcpincode">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  590. &nbsp;&nbsp;
  591. <big><label for="stugdoj">Joining Date</label></big>
  592. &nbsp;&nbsp;&nbsp; <input class="input" name="stugdoj" size="15" type="date">
  593. </div>
  594. </fieldset>
  595. </div>
  596. </fieldset>
  597.         </div>
  598.       </div>
  599.     </div>
  600. <div class="panel panel-default">
  601.       <div class="panel-heading">
  602.         <h4 class="panel-title">
  603.           <a data-toggle="collapse" data-parent="#accordion" href="#collapse4">Sibling Detail</a>
  604.         </h4>
  605.       </div>
  606.       <div id="collapse4" class="panel-collapse collapse">
  607.         <div class="panel-body">
  608.  
  609.  
  610.  
  611. <big style="font-family: Comic Sans MS;"><big>Select Number of siblings<span
  612. style="color: red; font-weight: bold;">*</span></big></big><span
  613. style="font-family: Comic Sans MS;"> </span>&nbsp;&nbsp;
  614. <select name="app_siblingno" class="input">
  615. <option>select one</option>
  616. <option>0</option>
  617. <option>1</option>
  618. <option>2</option>
  619. <option>3</option>
  620. <option>4</option>
  621. <option>5</option>
  622. <option>6</option>
  623. </select>
  624. <br>
  625. <br>
  626. <table style="text-align: left; width: 100px;" border="0"
  627. cellpadding="0" cellspacing="0">
  628. <tbody>
  629. <tr>
  630. <td colspan="6" rowspan="1" style="vertical-align: top;">
  631. </td>
  632. </tr>
  633. <tr>
  634. <td style="vertical-align: top;">S.No 1
  635. </td>
  636. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;Name&nbsp;&nbsp;&nbsp;&nbsp;<input name="app_siblingname1">
  637. </td>
  638. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;Birthdate<input name="app_siblingdob1">
  639. </td>
  640. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;Class<select name="app_siblingclass1">
  641. <option>select one</option>
  642. <option>XII</option>
  643. <option>XI</option>
  644. <option>X</option>
  645. <option>IX</option>
  646. <option>VIII</option>
  647. <option>VII</option>
  648. <option>VI</option>
  649. <option>V</option>
  650. <option>IV</option>
  651. <option>III</option>
  652. <option>II</option>
  653. <option>I</option>
  654. <option>KG/Prep</option>
  655. <option>Nursery</option>
  656. </td>
  657. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;Gender<select name="app_siblinggender1">
  658. <option>select one</option>
  659. <option>Male</option>
  660. <option>Female</option>
  661. <option>Mx</option>
  662. </td>
  663. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;School Name<input name="app_schlname1">
  664. </td>
  665. </tr>
  666. <tr>
  667. <td style="vertical-align: top;">2
  668. </td>
  669. <td style="vertical-align: top;"><input name="app_siblingname2">
  670. </td>
  671. <td style="vertical-align: top;"><input name="app_siblingdob2">
  672. </td>
  673. <td style="vertical-align: top;"><select name="app_siblingclass2">
  674. <option>select one</option>
  675. <option>XII</option>
  676. <option>XI</option>
  677. <option>X</option>
  678. <option>IX</option>
  679. <option>VIII</option>
  680. <option>VII</option>
  681. <option>VI</option>
  682. <option>V</option>
  683. <option>IV</option>
  684. <option>III</option>
  685. <option>II</option>
  686. <option>I</option>
  687. <option>KG/Prep</option>
  688. <option>Nursery</option>
  689. </td>
  690. <td style="vertical-align: top;"><select name="app_siblinggender2">
  691. <option>select one</option>
  692. <option>Male</option>
  693. <option>Female</option>
  694. <option>Mx</option>
  695. </td>
  696. <td style="vertical-align: top;"><input name="app_siblingschlname2">
  697. </td>
  698. </tr>
  699. <tr>
  700. <td style="vertical-align: top;">3
  701. </td>
  702. <td style="vertical-align: top;"><input name="app_siblingname3">
  703. </td>
  704. <td style="vertical-align: top;"><input name="app_siblingdob3">
  705. </td>
  706. <td style="vertical-align: top;"><select name="app_siblingclass3">
  707. <option>select one</option>
  708. <option>XII</option>
  709. <option>XI</option>
  710. <option>X</option>
  711. <option>IX</option>
  712. <option>VIII</option>
  713. <option>VII</option>
  714. <option>VI</option>
  715. <option>V</option>
  716. <option>IV</option>
  717. <option>III</option>
  718. <option>II</option>
  719. <option>I</option>
  720. <option>KG/Prep</option>
  721. <option>Nursery</option>
  722. </td>
  723. <td style="vertical-align: top;"><select name="app_siblinggender3">
  724. <option>select one</option>
  725. <option>Male</option>
  726. <option>Female</option>
  727. <option>Mx</option>
  728. </td>
  729. <td style="vertical-align: top;"><input name="app_siblingschlname3">
  730. </td>
  731. </tr>
  732. <tr>
  733. <td style="vertical-align: top;">4
  734. </td>
  735. <td style="vertical-align: top;"><input name="app_siblingname4">
  736. </td>
  737. <td style="vertical-align: top;"><input name="app_siblingdob4">
  738. </td>
  739. <td style="vertical-align: top;"><select name="app_siblingclass4">
  740. <option>select one</option>
  741. <option>XII</option>
  742. <option>XI</option>
  743. <option>X</option>
  744. <option>IX</option>
  745. <option>VIII</option>
  746. <option>VII</option>
  747. <option>VI</option>
  748. <option>V</option>
  749. <option>IV</option>
  750. <option>III</option>
  751. <option>II</option>
  752. <option>I</option>
  753. <option>KG/Prep</option>
  754. <option>Nursery</option>
  755. </td>
  756. <td style="vertical-align: top;"><select name="app_siblinggender4">
  757. <option>select one</option>
  758. <option>Male</option>
  759. <option>Female</option>
  760. <option>Mx</option>
  761. </td>
  762. <td style="vertical-align: top;"><input name="app_siblingschlname4">
  763. </td>
  764. </tr>
  765. <tr>
  766. <td style="vertical-align: top;">5
  767. </td>
  768. <td style="vertical-align: top;"><input name="app_siblingname5">
  769. </td>
  770. <td style="vertical-align: top;"><input name="app_siblingdob5">
  771. </td>
  772. <td style="vertical-align: top;"><select name="app_siblingclass5">
  773. <option>select one</option>
  774. <option>XII</option>
  775. <option>XI</option>
  776. <option>X</option>
  777. <option>IX</option>
  778. <option>VIII</option>
  779. <option>VII</option>
  780. <option>VI</option>
  781. <option>V</option>
  782. <option>IV</option>
  783. <option>III</option>
  784. <option>II</option>
  785. <option>I</option>
  786. <option>KG/Prep</option>
  787. <option>Nursery</option>
  788. </td>
  789. <td style="vertical-align: top;"><select name="app_siblinggender5">
  790. <option>select one</option>
  791. <option>Male</option>
  792. <option>Female</option>
  793. <option>Mx</option>
  794. </td>
  795. <td style="vertical-align: top;"><input name="app_siblingschlname5">
  796. </td>
  797. </tr>
  798. <tr>
  799. <td style="vertical-align: top;">6
  800. </td>
  801. <td style="vertical-align: top;"><input name="app_siblingname6">
  802. </td>
  803. <td style="vertical-align: top;"><input name="app_siblingdob6">
  804. </td>
  805. <td style="vertical-align: top;"><select name="app_siblingclass6">
  806. <option>select one</option>
  807. <option>XII</option>
  808. <option>XI</option>
  809. <option>X</option>
  810. <option>IX</option>
  811. <option>VIII</option>
  812. <option>VII</option>
  813. <option>VI</option>
  814. <option>V</option>
  815. <option>IV</option>
  816. <option>III</option>
  817. <option>II</option>
  818. <option>I</option>
  819. <option>KG/Prep</option>
  820. <option>Nursery</option>
  821. </td>
  822. <td style="vertical-align: top;"><select name="app_siblinggender6">
  823. <option>select one</option>
  824. <option>Male</option>
  825. <option>Female</option>
  826. <option>Mx</option>
  827. </td>
  828. <td style="vertical-align: top;"><input name="app_siblingschlname6">
  829. </td>
  830. </tr>
  831. </tbody>
  832. </table>
  833.         </div>
  834.       </div>
  835.     </div>
  836. <div class="panel panel-default">
  837.       <div class="panel-heading">
  838.         <h4 class="panel-title">
  839.           <a data-toggle="collapse" data-parent="#accordion" href="#collapse5">Document Upload</a>
  840.         </h4>
  841.       </div>
  842.       <div id="collapse5" class="panel-collapse collapse">
  843.         <div class="panel-body">
  844.         Document Upload
  845. (Only PDF/JPE/JPEG)</span></big></big></label></big><big><br>
  846. </big><big>
  847. </big><big><span style="color: red;">(Note : File size
  848. should not be more than 100KB)</span></big><big><br>
  849. </big><big>
  850. </big><big><br>
  851. </big><big>
  852. </big><div class="form-group"><big>
  853. </big><big><big><label for="stupassport">1. Password</label></big></big><big>&nbsp;&nbsp;&nbsp;
  854. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
  855. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; </big><big><input name="stupassport" accept=".jpg,.pdf" class="input" type="file"></big><big> </big></div><big>
  856. </big><big><br>
  857. </big><big>
  858. </big><big><br>
  859. </big><big>
  860. </big><div class="form-group"><big><big><label for="stuic">2. Immunisation
  861. Certificate&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <input name="stuic" accept=".jpg,.pdf" class="input" type="file"></label></big></big></div><big>
  862. </big><big><br>
  863. </big><big>
  864. </big><big><br>
  865. </big><big>
  866. </big><div class="form-group"><big>
  867. </big><big><big><label for="stutc">3. Transfer
  868. Certificate</label></big></big><big>&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
  869. &nbsp; &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; </big><big><input name="stutc" accept=".jpg,.pdf" class="input" type="file"></big></div><big>
  870. </big><big><br>
  871. </big><big>
  872. </big><big><br>
  873. </big><big>
  874. </big><div class="form-group"><big>
  875. </big><big><big><label for="stumrc">4. Marksheet/ Reportcard</label></big></big><big>
  876. &nbsp;&nbsp; &nbsp;&nbsp;&nbsp; </big><big><input name="stumrc" accept=".jpg,.pdf" class="input" type="file"></big></div><big>
  877. </big><big><br>
  878. </big><big>
  879. </big><big><br>
  880. </big><big>
  881. </big><div class="form-group"><big>
  882. </big><big><big><label for="stumr">5. Medical Report</label></big></big><big>&nbsp; &nbsp;
  883. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; </big><big><input name="stumr" accept=".jpg,.pdf" class="input" type="file"></big></div><big>
  884. </big><big><br>
  885. </big><big>
  886. </big><big><br>
  887. </big><big>
  888. </big><div class="form-group"><big>
  889. </big><big><big><label for="stuod">6. Any Other Document</label></big></big><big>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  890. &nbsp; &nbsp;&nbsp; &nbsp;</big><big><input name="stuod" accept=".jpg,.pdf" class="input" type="file"></big></div><big>
  891. </big><big><br>
  892. </big><big>
  893. </big>
  894.         </div>
  895.       </div>
  896.     </div>
  897.   </div>
  898. </div>
  899.  
  900. </body>
  901. </html>
  902.  
  903.  
Aug 28 '16 #1

✓ answered by Dormilich

Expand|Select|Wrap|Line Numbers
  1. var val = $( "select" ).val();
this will always refer to the first <select>. not the one that triggered the event.

for that you would use
Expand|Select|Wrap|Line Numbers
  1. var val = this.value;

18 1324
Can someone please help ??
Aug 29 '16 #2
Dormilich
8,658 Expert Mod 8TB
you include jQuery three times with different versions. in that case it would've been a miracle if that went well.
Aug 29 '16 #3
can you please suggest me how can I achieve the desired result in that case ?
Aug 29 '16 #4
Dormilich
8,658 Expert Mod 8TB
well, start with including jQuery only once (I thought that one were obvious ...)
Aug 29 '16 #5
gits
5,390 Expert Mod 4TB
besides that i think that the logic for the 'select' handling is wrong. it applies the same handling for all select elements on that page which i think is not the intention, so that part probably needs to be fixed as well.
Aug 29 '16 #6
I did try that but i wasnt sure how can I combine 3 different library into one. As my 3 javascripts are referring to 3 check boxes which enables the address fields and the jquery is being used for showing/dispalying the rows based on option chosen
Aug 29 '16 #7
Dormilich
8,658 Expert Mod 8TB
I did try that but i wasnt sure how can I combine 3 different library into one.
you don't combine 3 jQuery versions into one. you use 1 jquery version (the latest possible one) that you know works with each part.
Aug 29 '16 #8
I did try looking into that but couldn't find it and that's why choose to go this way. Will you be able to help me please ?
Aug 29 '16 #9
Dormilich
8,658 Expert Mod 8TB
then remove those 3 jQuery links and place one before bootstrap using version 2.2.4 (the latest jQuery 2 release)
Aug 29 '16 #10
I think I have boiled down the issue. The problem is table rows jquery. It doesn't seems to be working when run in the html here. However I am able to run it when running it standalone in a separate form. Is it getting conflicted ?
Aug 29 '16 #11
Dormilich
8,658 Expert Mod 8TB
The problem is table rows jquery.
I have no idea what that could mean.
Aug 29 '16 #12
The jquery which is not working after including in html code is
Expand|Select|Wrap|Line Numbers
  1. <script>
  2.  
  3. jQuery(function($){
  4. $( document ).ready(function() {
  5.     $( "select" ).change(function () {
  6.         var val = $( "select" ).val();
  7.         if (val != 'select one') {
  8.             var tableRows = $("table tr");
  9.             jQuery.each(tableRows, function(i ,tr) {
  10.                 if (i > val) {
  11.                     $(tr).hide();
  12.                 } else {
  13.                     $(tr).show();
  14.                 }
  15.             })
  16.         }
  17.       }
  18.     )
  19. });
  20. });
  21.  
  22. </script>
  23. <big style="font-family: Comic Sans MS;"><big>Select Number of siblings<span
  24. style="color: red; font-weight: bold;">*</span></big></big><span
  25. style="font-family: Comic Sans MS;"> </span>&nbsp;&nbsp;
  26. <select name="app_siblingno" class="input">
  27. <option>select one</option>
  28. <option>0</option>
  29. <option>1</option>
  30. <option>2</option>
  31. <option>3</option>
  32. <option>4</option>
  33. <option>5</option>
  34. <option>6</option>
  35. </select>
  36. <br>
  37. <br>
  38. <table style="text-align: left; width: 100px;" border="0"
  39. cellpadding="0" cellspacing="0">
  40. <tbody>
  41. <tr>
  42. <td colspan="6" rowspan="1" style="vertical-align: top;">
  43. </td>
  44. </tr>
  45. <tr>
  46. <td style="vertical-align: top;">S.No 1
  47. </td>
  48. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;Name&nbsp;&nbsp;&nbsp;&nbsp;<input name="app_siblingname1">
  49. </td>
  50. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;Birthdate<input name="app_siblingdob1">
  51. </td>
  52. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;Class<select name="app_siblingclass1">
  53. <option>select one</option>
  54. <option>XII</option>
  55. <option>XI</option>
  56. <option>X</option>
  57. <option>IX</option>
  58. <option>VIII</option>
  59. <option>VII</option>
  60. <option>VI</option>
  61. <option>V</option>
  62. <option>IV</option>
  63. <option>III</option>
  64. <option>II</option>
  65. <option>I</option>
  66. <option>KG/Prep</option>
  67. <option>Nursery</option>
  68. </td>
  69. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;Gender<select name="app_siblinggender1">
  70. <option>select one</option>
  71. <option>Male</option>
  72. <option>Female</option>
  73. <option>Mx</option>
  74. </td>
  75. <td style="vertical-align: top;">&nbsp;&nbsp;&nbsp;&nbsp;School Name<input name="app_schlname1">
  76. </td>
  77. </tr>
  78. <tr>
  79. <td style="vertical-align: top;">2
  80. </td>
  81. <td style="vertical-align: top;"><input name="app_siblingname2">
  82. </td>
  83. <td style="vertical-align: top;"><input name="app_siblingdob2">
  84. </td>
  85. <td style="vertical-align: top;"><select name="app_siblingclass2">
  86. <option>select one</option>
  87. <option>XII</option>
  88. <option>XI</option>
  89. <option>X</option>
  90. <option>IX</option>
  91. <option>VIII</option>
  92. <option>VII</option>
  93. <option>VI</option>
  94. <option>V</option>
  95. <option>IV</option>
  96. <option>III</option>
  97. <option>II</option>
  98. <option>I</option>
  99. <option>KG/Prep</option>
  100. <option>Nursery</option>
  101. </td>
  102. <td style="vertical-align: top;"><select name="app_siblinggender2">
  103. <option>select one</option>
  104. <option>Male</option>
  105. <option>Female</option>
  106. <option>Mx</option>
  107. </td>
  108. <td style="vertical-align: top;"><input name="app_siblingschlname2">
  109. </td>
  110. </tr>
  111. <tr>
  112. <td style="vertical-align: top;">3
  113. </td>
  114. <td style="vertical-align: top;"><input name="app_siblingname3">
  115. </td>
  116. <td style="vertical-align: top;"><input name="app_siblingdob3">
  117. </td>
  118. <td style="vertical-align: top;"><select name="app_siblingclass3">
  119. <option>select one</option>
  120. <option>XII</option>
  121. <option>XI</option>
  122. <option>X</option>
  123. <option>IX</option>
  124. <option>VIII</option>
  125. <option>VII</option>
  126. <option>VI</option>
  127. <option>V</option>
  128. <option>IV</option>
  129. <option>III</option>
  130. <option>II</option>
  131. <option>I</option>
  132. <option>KG/Prep</option>
  133. <option>Nursery</option>
  134. </td>
  135. <td style="vertical-align: top;"><select name="app_siblinggender3">
  136. <option>select one</option>
  137. <option>Male</option>
  138. <option>Female</option>
  139. <option>Mx</option>
  140. </td>
  141. <td style="vertical-align: top;"><input name="app_siblingschlname3">
  142. </td>
  143. </tr>
  144. <tr>
  145. <td style="vertical-align: top;">4
  146. </td>
  147. <td style="vertical-align: top;"><input name="app_siblingname4">
  148. </td>
  149. <td style="vertical-align: top;"><input name="app_siblingdob4">
  150. </td>
  151. <td style="vertical-align: top;"><select name="app_siblingclass4">
  152. <option>select one</option>
  153. <option>XII</option>
  154. <option>XI</option>
  155. <option>X</option>
  156. <option>IX</option>
  157. <option>VIII</option>
  158. <option>VII</option>
  159. <option>VI</option>
  160. <option>V</option>
  161. <option>IV</option>
  162. <option>III</option>
  163. <option>II</option>
  164. <option>I</option>
  165. <option>KG/Prep</option>
  166. <option>Nursery</option>
  167. </td>
  168. <td style="vertical-align: top;"><select name="app_siblinggender4">
  169. <option>select one</option>
  170. <option>Male</option>
  171. <option>Female</option>
  172. <option>Mx</option>
  173. </td>
  174. <td style="vertical-align: top;"><input name="app_siblingschlname4">
  175. </td>
  176. </tr>
  177. <tr>
  178. <td style="vertical-align: top;">5
  179. </td>
  180. <td style="vertical-align: top;"><input name="app_siblingname5">
  181. </td>
  182. <td style="vertical-align: top;"><input name="app_siblingdob5">
  183. </td>
  184. <td style="vertical-align: top;"><select name="app_siblingclass5">
  185. <option>select one</option>
  186. <option>XII</option>
  187. <option>XI</option>
  188. <option>X</option>
  189. <option>IX</option>
  190. <option>VIII</option>
  191. <option>VII</option>
  192. <option>VI</option>
  193. <option>V</option>
  194. <option>IV</option>
  195. <option>III</option>
  196. <option>II</option>
  197. <option>I</option>
  198. <option>KG/Prep</option>
  199. <option>Nursery</option>
  200. </td>
  201. <td style="vertical-align: top;"><select name="app_siblinggender5">
  202. <option>select one</option>
  203. <option>Male</option>
  204. <option>Female</option>
  205. <option>Mx</option>
  206. </td>
  207. <td style="vertical-align: top;"><input name="app_siblingschlname5">
  208. </td>
  209. </tr>
  210. <tr>
  211. <td style="vertical-align: top;">6
  212. </td>
  213. <td style="vertical-align: top;"><input name="app_siblingname6">
  214. </td>
  215. <td style="vertical-align: top;"><input name="app_siblingdob6">
  216. </td>
  217. <td style="vertical-align: top;"><select name="app_siblingclass6">
  218. <option>select one</option>
  219. <option>XII</option>
  220. <option>XI</option>
  221. <option>X</option>
  222. <option>IX</option>
  223. <option>VIII</option>
  224. <option>VII</option>
  225. <option>VI</option>
  226. <option>V</option>
  227. <option>IV</option>
  228. <option>III</option>
  229. <option>II</option>
  230. <option>I</option>
  231. <option>KG/Prep</option>
  232. <option>Nursery</option>
  233. </td>
  234. <td style="vertical-align: top;"><select name="app_siblinggender6">
  235. <option>select one</option>
  236. <option>Male</option>
  237. <option>Female</option>
  238. <option>Mx</option>
  239. </td>
  240. <td style="vertical-align: top;"><input name="app_siblingschlname6">
  241. </td>
  242. </tr>
  243. </tbody>
  244. </table>
But this is working standalone
Aug 29 '16 #13
Dormilich
8,658 Expert Mod 8TB
Expand|Select|Wrap|Line Numbers
  1. var val = $( "select" ).val();
this will always refer to the first <select>. not the one that triggered the event.

for that you would use
Expand|Select|Wrap|Line Numbers
  1. var val = this.value;
Aug 29 '16 #14
thanks a million..it works perfectly....
Aug 29 '16 #15
gits
5,390 Expert Mod 4TB
it's not i guess. as i said - the handling for the select is applied to all! select nodes in the page. I guess the tablerows should only react to the select-node in the 'Sibling Detail' section? now simply open that section and for example 'Collapsible Group 3' as well. use the select node in that section to chose Yes/No for example - and it will show all the tablerows. i doubt that this is the intention. you would need to check from which select node the event comes from - by an id or an attribute that identifies that - or simply only add the handler to that single select-node.
Aug 30 '16 #16
Gits you are right.. I didnt actually notice that. Can you please help me in adding the handler as I am not that technical ? Thanks
Aug 30 '16 #17
gits
5,390 Expert Mod 4TB
since i'm not going to write the code for copy and pasting i give you 2 hints that you could use to fix that issue:

1. you can give the select node that you want to handle an id or whatever other attribute (for example a name) that you can check additionally in the current handler code and only in case the events come from that node - handle the table rows. This would allow you to handle all the select's events in a central place. There are different possibilities to implement it like that.

2. given the fact that you would give the node a unique attribute you could even change the 'apply' mechanism by not selecting all nodes in the first place but only that one you really want. In this case you would have a handler for that specific node only and the other selects would need their own custom handlers applied as well if you ever want them to have one.

Both solutions would work - with the described basic ideas behind them. it would depend on how you think you will extend the code from there on, i cannot really say that one would be 'better' then the other while i don't know the further plans, that might imply that one implementation could have an advantage over the other.

when you show what you have tried then we might be able to help you further in case you would have problems with a specific solution.

best regards.
Aug 31 '16 #18
Thanks gits. I have managed to get this working now. Thanks for your idea
Sep 1 '16 #19

Sign in to post your reply or Sign up for a free account.

Similar topics

1
iam_clint
Javascript - Working with mouse wheel
by: iam_clint | last post by:
http://adomas.org/javascript-mouse-wheel/ heres a document i found for javascripting with the mouse wheel. pretty interesting good reference if anyone wanted todo anything with the mouse wheel.
Javascript
1
Javascript working on FF but not on IE
by: Rajesh Rao | last post by:
Hi guys, following url works in Fire Fox but not On IE. http://www.dell.com/content/topics/topic.aspx/global/hybrid/snp/en/storage_type?c=us&cs=19&l=en&ModelSelection=121317&s=dhs
Javascript
1
javascript working locally but not online
by: 2007boy | last post by:
I am puzzled by a problem I am having with a javascript that is working on my computer (mac osx) but fail when put online. it happens only with the old IE 5.2 for mac and the iCab browsers. the code...
Javascript
6
DOM javascript working fine with IE but nothing happens with Firefox
by: ApOG | last post by:
Hello everyone, I have this javascript code working perfectly with IE, but with firefox nothing happens when running the function... function add_div_field () { var ni =...
Javascript
1
javascript working fine in IE but cannot work in Firefox
by: web20tester | last post by:
Hi all, I am new to javascript. I have this script working fine in IE but cannot work in firefox. Really appreciate on any guidance. search0.js function Search(str) { var...
Javascript
16
javascript working in mozilla validating only one field
by: shyamg | last post by:
Hi, this is my javascript validating the fields in mozilla FF but its working and validating only one field. how to write the and how to works the script .................. function...
Javascript
3
javascript working incorrectly in mozilla with select element
by: yurcheg | last post by:
Hi, I've searched the forum for this problem but haven't found anything relevant. I've got a javascript code which dynamically creates list-boxes in a form. It works perfectly fine in IE, but in...
Javascript
26
javascript working on mozilla firefox but not on IE 6
by: itgaurav198 | last post by:
Hi, I have the following script function submitForm1() { document.forms.action="SearchRecords"; document.forms.submit(); }
Javascript
7
Javascript working in IE but not in Firefox
by: printline | last post by:
Hello out there.... I have a javascript that goes like this: <script language="javascript"> function checkFields9(){ if (shopform.totalhwtemp.value<=16) { return...
Javascript
2
load() function in jquery not working
by: xiiopao | last post by:
hi there guys im currently working on a project with jquery... the thing is.. i need to change the contents of a div named "sub2" with the contents of "pets.html"... i've read some tutorials and i...
Javascript
0
How to turn on java script in a villaon keypad mobile phone
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
Java
0
Merging data from multiple Excel files
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
Data Management
0
BarryA
Navigating the Data Structures and Algorithms (DSA)
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
Algorithms / Advanced Math
1
Is that possible of reading the .csv file in column wise and the column have different lengths ?
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
C / C++
0
How to build RAID in BIOS?
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
Computer Hardware
0
marktang
What is ONU?
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
General
0
Oralloy
Problem With Comparison Operator <=> in G++
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
C / C++
0
jinu1996
Maximizing Business Potential: The Nexus of Website Design and Digital Marketing
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
Online Marketing
0
tracyyun
Discussion: How does Zigbee compare with other wireless protocols in smart home applications?
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
General

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.

BYTES.COM © 2024
About Bytes
Terms Of Use
Privacy Policy
Sitemap
Advertise on Bytes:
Post a Job
Sponsored Posts
Platinum & Gold Sponsors
Hire Now!