What I am missing in my HTML code.
You are missing HTML. This isn't HTML, this is tag soup.
N values should come under Active column.
The row with N does not have the correct number of td's.
Your first row shows three table data cells (td). This means your table consists of rows with three cells each.
Code:
<tr class="Caption">
1<td align="center" style="width: 40%">Labour Sub-Type</td>
2<td align="center" style="width: 50%">Labour Sub-Type Description</td>
3<td align="center" style="width: 10%">Active</td>
</tr>
However your row with "N" consists of only one cell.
Code:
<tr>
1<td align="center" style="width: 10%">N</td>
</tr>
If you want to use a table, you must use it correctly. If you use table tags but do not follow the rules of tables, it will not work.
You will see this yourself if you make the table neat.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<table style="width: 60%">
<tbody>
<tr>
<td align="center">
<div id="SubTypeDataDiv">
<table style="width: 100%" class="FormBorder">
<tbody>
<tr class="Caption">
<td align="center" style="width: 40%">Labour Sub-Type</td>
<td align="center" style="width: 50%">Labour Sub-Type Description</td>
<td align="center" style="width: 10%">Active</td>
</tr>
<tr>
you are missing <td>s here
<input type="hidden" id="labourSubTypeList_0__labourSubTypeAutoId" value="1" name="labourSubTypeList[0].labourSubTypeAutoId">
<input type="hidden" id="labourSubTypeList_0__labourTypeAutoId" value="1" name="labourSubTypeList[0].labourTypeAutoId">
<td align="center"></td>
</tr>
<tr>
this row only has 2 td's. Where is your last one?
<td class="tdLabel"></td>
<td><input type="text" class="TextBoxLarge" id="labourSubTypeList_0__labourSubType" value="Bhutanese National Labour-13-feb-2013" name="labourSubTypeList[0].labourSubType"></td>
</tr>
<tr>
this row only has one td in it. Where are the other two?
<td align="center"></td>
</tr>
<tr>
this row only has 2 td's. Where is your last one?
<td class="tdLabel"></td>
<td><input type="text" class="TextBoxLarge" id="labourSubTypeList_0__labourSubTypeDesc" value="Bhutanese National Labour1" name="labourSubTypeList[0].labourSubTypeDesc"></td>
</tr>
<tr>
this row only has 1 td. Where are the other two?
<td align="center" style="width: 10%">N</td>
</tr>
<tr>
there are only 2 td's in this row. Where is the last one?
<td valign="top" align="right"></td>
<td valign="top" align="left"><input type="checkbox" id="labourSubTypeList_0__labourTypeStatus" value="true" name="labourSubTypeList[0].labourTypeStatus"><input type="hidden" value="true" name="__checkbox_labourSubTypeList[0].labourTypeStatus" id="__checkbox_labourSubTypeList_0__labourTypeStatus"></td>
</tr>
<tr>
this row only has 1 td. Where are the other two?
<input type="hidden" id="labourSubTypeList_1__labourSubTypeAutoId" value="2" name="labourSubTypeList[1].labourSubTypeAutoId">
<input type="hidden" id="labourSubTypeList_1__labourTypeAutoId" value="1" name="labourSubTypeList[1].labourTypeAutoId">
<td align="center"></td>
</tr>
<tr>
only 2 td's here
<td class="tdLabel"></td>
<td><input type="text" class="TextBoxLarge" id="labourSubTypeList_1__labourSubType" value="Statutory-On-Cost Allowances" name="labourSubTypeList[1].labourSubType"></td>
</tr>
<tr>
only one here
<td align="center"></td>
</tr>
<tr>
care to guess what's wrong with this one?
<td class="tdLabel"></td>
<td><input type="text" class="TextBoxLarge" id="labourSubTypeList_1__labourSubTypeDesc" value="Statutory-On-Cost Allowances" name="labourSubTypeList[1].labourSubTypeDesc"></td>
</tr>
<tr>
<td align="center" style="width: 10%">N</td>
</tr>
<tr>
<td valign="top" align="right"></td>
<td valign="top" align="left"><input type="checkbox" id="labourSubTypeList_1__labourTypeStatus" value="true" name="labourSubTypeList[1].labourTypeStatus"><input type="hidden" value="true" name="__checkbox_labourSubTypeList[1].labourTypeStatus" id="__checkbox_labourSubTypeList_1__labourTypeStatus"></td>
</tr>
etc...
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
</BODY>
</HTML>
My advice: next time, instead of spewing a huge jumble of table mess and wondering why it doesn't work, try properly indenting the code. This makes it much more readable and you will find errors much more easily. In your code posted above, it was difficult to see that the number of td's did not match per row, but once I indented everything, it became obvious.
Now, you can have fewer td's in a row, but then you must use the colspan attribute to set a td to take up more than the space of one normal td. For example, the rows with nothing in them:
Code:
<tr>
<td colspan=3></td>
</tr>
Since you've set at the first, top row that a row consists of 3 td's, this now is code with a single td who spans across three "normal" td's.
As a final note, this code is bad and should never go online. The doctype is ancient, the table is nested in another table (why?), this is not tabular data, and this is not how forms should be constructed. Since there are inputs in here, this is a form. It should have form tags.
Reply With Quote
Originally Posted by Stomme poes
Bookmarks