Link to home
Start Free TrialLog in
Avatar of Akhil Vinay Mandava
Akhil Vinay MandavaFlag for India

asked on

how can i create a tablular form with input text in html.

i wrote a program like this but it was not right can anyone please modifiy the code ????

Education Details:<br>
 <style>
 table, th, td  {
    border: 1px solid black;
 }
 </style>

  <table style="width:200%"  />
  <tr>
    <th>Qualification</th>
    <th>Years</th>
    <th>University</th>
    <th>Percentage</th>
  </tr>

  <tr>
    <td><input type="text" name="Qualification1"></td>
    <td><input type="text" name="Years1"></td>
    <td><input type="text" name="University1"></td>
    <td><input type="text" name="Percentage1"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification2"></td>
    <td><input type="text" name="Years2"></td>
    <td><input type="text" name="University2"></td>
    <td><input type="text" name="Percentage2"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification3"></td>
    <td><input type="text" name="Years3"></td>
    <td><input type="text" name="University3"></td>
    <td><input type="text" name="Percentage3"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification4"></td>
    <td><input type="text" name="Years4"></td>
    <td><input type="text" name="University4"></td>
    <td><input type="text" name="Percentage4"></td>
  </tr>

 </table>
 </br>
Avatar of Geert G
Geert G
Flag of Belgium image
what's wrong with it ?
and what do you want changed ?

that's not a program, but a piece of html text
Avatar of Leonidas Dosas
Leonidas Dosas
Flag of Greece image
Wrapp the table inside in a form or wrapp an input element in a form eg
<form>
table inside
</form>

Open in new window

Avatar of Akhil Vinay Mandava
Akhil Vinay Mandava
Flag of India image

ASKER

i need to insert information in the tabular in text format  so anyone can chage and sent me the code and also change the table style,
Avatar of Leonidas Dosas
Leonidas Dosas
Flag of Greece image
See this code that the table is inside in a form element:
<!DOCTYPE html>
<html>
<head>
<title>HTML5, CSS3 and JavaScript demo</title>
  <style>
    table, th, td  {
    border: 1px solid black;
 }
    
  </style>
</head>
<body>
<!-- Start your code here -->

  <form action="">
    <table>
      <tr>
    <th>Qualification</th>
    <th>Years</th> 
    <th>University</th>
    <th>Percentage</th>
  </tr>

  <tr>
    <td><input type="text" name="Qualification1"></td>
    <td><input type="text" name="Years1"></td>
    <td><input type="text" name="University1"></td>
    <td><input type="text" name="Percentage1"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification2"></td>
    <td><input type="text" name="Years2"></td>
    <td><input type="text" name="University2"></td>
    <td><input type="text" name="Percentage2"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification3"></td>
    <td><input type="text" name="Years3"></td>
    <td><input type="text" name="University3"></td>
    <td><input type="text" name="Percentage3"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification4"></td>
    <td><input type="text" name="Years4"></td>
    <td><input type="text" name="University4"></td>
    <td><input type="text" name="Percentage4"></td>
  </tr>

      
      
    </table>
    
    
  </form>

<!-- End your code here -->
</body>
</html>

Open in new window


And this without form:
<!DOCTYPE html>
<html>
<head>
<title>HTML5, CSS3 and JavaScript demo</title>
  <style>
    table, th, td  {
    border: 1px solid black;
 }
    
  </style>
</head>
<body>
<!-- Start your code here -->

 
    <table>
      <tr>
    <th>Qualification</th>
    <th>Years</th> 
    <th>University</th>
    <th>Percentage</th>
  </tr>

  <tr>
    <td><input type="text" name="Qualification1"></td>
    <td><input type="text" name="Years1"></td>
    <td><input type="text" name="University1"></td>
    <td><input type="text" name="Percentage1"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification2"></td>
    <td><input type="text" name="Years2"></td>
    <td><input type="text" name="University2"></td>
    <td><input type="text" name="Percentage2"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification3"></td>
    <td><input type="text" name="Years3"></td>
    <td><input type="text" name="University3"></td>
    <td><input type="text" name="Percentage3"></td>
  </tr>
  <tr>
    <td><input type="text"  name="Qualification4"></td>
    <td><input type="text" name="Years4"></td>
    <td><input type="text" name="University4"></td>
    <td><input type="text" name="Percentage4"></td>
  </tr>

      
      
    </table>   
    


<!-- End your code here -->
</body>
</html>

Open in new window


And this with a form inside the td wrapped the input elements
<!DOCTYPE html>
<html>
<head>
<title>HTML5, CSS3 and JavaScript demo</title>
  <style>
    table, th, td  {
    border: 1px solid black;
 }
    
  </style>
</head>
<body>
<!-- Start your code here -->

  
    <table>
      <tr>
    <th>Qualification</th>
    <th>Years</th> 
    <th>University</th>
    <th>Percentage</th>
  </tr>

  <tr>
    <td><form action=""><input type="text" name="Qualification1"></form></td>
    <td><form action=""><input type="text" name="Years1"></form></td>
    <td><form action=""><input type="text" name="University1"></form></td>
    <td><form action=""><input type="text" name="Percentage1"></form></td>
  </tr>
      
      <tr>
    <td><form action=""><input type="text" name="Qualification1"></form></td>
    <td><form action=""><input type="text" name="Years1"></form></td>
    <td><form action=""><input type="text" name="University1"></form></td>
    <td><form action=""><input type="text" name="Percentage1"></form></td>
  </tr>
      
      <tr>
    <td><form action=""><input type="text" name="Qualification1"></form></td>
    <td><form action=""><input type="text" name="Years1"></form></td>
    <td><form action=""><input type="text" name="University1"></form></td>
    <td><form action=""><input type="text" name="Percentage1"></form></td>
  </tr>
      
      <tr>
    <td><form action=""><input type="text" name="Qualification1"></form></td>
    <td><form action=""><input type="text" name="Years1"></form></td>
    <td><form action=""><input type="text" name="University1"></form></td>
    <td><form action=""><input type="text" name="Percentage1"></form></td>
  </tr>
  
  
      
      
    </table>
    
    


<!-- End your code here -->
</body>
</html>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of Scott Fell
Scott Fell
Flag of United States of America image
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial