Advertisement
lalatino

form example

Jul 6th, 2012
185
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 4.40 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <title>http://stackoverflow.com/questions/11360343/duplicate-member-form</title>
  6. </head>
  7. <body>
  8.  
  9. <table border=0 id="table1">
  10.     <tbody>
  11.     <tr>  
  12.             <td colspan="2"><h2>Book Now</h2>   </td>  
  13.             </tr>
  14.         <tr>  
  15.             <td width="139"> Select Date (dd/mm/yy):</td>  
  16.             <td width="351"> <input type="text"  id="datepicker"> </td>  
  17.         </tr>
  18.         <tr>
  19.           <td>Select Category:</td>
  20.           <td>&nbsp;</td>
  21.         </tr>
  22.          <tr>
  23.           <td colspan="2"><select name="orgSelect" class="orgSelect">
  24. <option value="0">----Select CAtegory----</option>
  25. <option value="1">CAtegory 1</option>
  26. <option value="2">CAtegory 2</option>
  27. </select></td>
  28. <tr>
  29. <td>Select Product:</td><td>&nbsp;</td>
  30. </tr>
  31.           </tr>
  32.         <tr>
  33.  
  34.         </tr>
  35.         <tr>
  36.           <td colspan="2"><select name="terrSelect" class="terrSelect">
  37. <option value="0" class="static">----Select Product----</option>
  38. <option value="1" class="sub_1">Product1</option>
  39. <option value="2" class="sub_1">Product2</option>
  40. </select>
  41.    </td>
  42.         </tr>      
  43.         <tr>  
  44.             <td> Number of Persons</td>  
  45.             <td>
  46.               <select name="persons" id="persons" onchange="change_persons(this.value)">
  47.         <optgroup label="select">
  48.                 <option>1</option>
  49.                 <option>2</option>
  50.                 <option>3</option>
  51.         </optgroup>
  52.               </select></td>  
  53.         </tr>  
  54.         <tr>  
  55.             <td><strong>Information:</strong></td>  
  56.             <td>&nbsp;</td>  
  57.         </tr>
  58.     </tbody>
  59.  
  60.     <tbody style="margin-top:1em">
  61.          <tr>  
  62.             <td>1st Member: </td>  
  63.             <td>&nbsp;</td>  
  64.         </tr>
  65.          <tr>
  66.            <td>First Name:</td>
  67.            <td><input type="text" name="fname1" value=""></td>
  68.          </tr>
  69.          <tr>
  70.            <td>Last Name:</td>
  71.            <td><input type="text" name="lname1" value=""></td>
  72.          </tr>
  73.          <tr>
  74.            <td>Email:</td>
  75.            <td><input type="text" name="email1" value=""></td>
  76.          </tr>
  77.          <tr>
  78.            <td>Phone</td>
  79.            <td><input type="text" name="phone1" value=""></td>
  80.          </tr>
  81.          <tr>
  82.            <td>Mobile Phone</td>
  83.            <td><input type="text" name="mobile1" value=""></td>
  84.          </tr>
  85.     </tbody>
  86.  
  87.     <tbody style="margin-top:1em">
  88.          <tr>  
  89.             <td>2nd Member: </td>  
  90.             <td>&nbsp;</td>  
  91.         </tr>
  92.          <tr>
  93.            <td>First Name:</td>
  94.            <td><input type="text" name="fname2" value=""></td>
  95.          </tr>
  96.          <tr>
  97.            <td>Last Name:</td>
  98.            <td><input type="text" name="lname2" value=""></td>
  99.          </tr>
  100.          <tr>
  101.            <td>Email:</td>
  102.            <td><input type="text" name="email2" value=""></td>
  103.          </tr>
  104.          <tr>
  105.            <td>Phone</td>
  106.            <td><input type="text" name="phone2" value=""></td>
  107.          </tr>
  108.          <tr>
  109.            <td>Mobile Phone</td>
  110.            <td><input type="text" name="mobile2" value=""></td>
  111.          </tr>
  112.     </tbody>
  113.  
  114.     <tbody style="margin-top:1em">
  115.          <tr>  
  116.             <td>3rd Member: </td>  
  117.             <td>&nbsp;</td>  
  118.         </tr>
  119.          <tr>
  120.            <td>First Name:</td>
  121.            <td><input type="text" name="fname3" value=""></td>
  122.          </tr>
  123.          <tr>
  124.            <td>Last Name:</td>
  125.            <td><input type="text" name="lname3" value=""></td>
  126.          </tr>
  127.          <tr>
  128.            <td>Email:</td>
  129.            <td><input type="text" name="email3" value=""></td>
  130.          </tr>
  131.          <tr>
  132.            <td>Phone</td>
  133.            <td><input type="text" name="phone3" value=""></td>
  134.          </tr>
  135.          <tr>
  136.            <td>Mobile Phone</td>
  137.            <td><input type="text" name="mobile3" value=""></td>
  138.          </tr>
  139.     </tbody>
  140.  
  141.     </table>
  142.  
  143. <script language="javascript">
  144. <!--
  145. function change_persons(show) {
  146.     var bodies = document.getElementById('table1').tBodies;
  147.     for (var i=1, l=bodies.length; i<l; i++) {
  148.         bodies[i].style.display = (i<=show)? 'block':'none';
  149.     }
  150. }
  151. change_persons(1); // at startup we show only 1 person
  152. //--></script>
  153.  
  154. </body>
  155. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement