Results 1 to 2 of 2
LinkBack URL
About LinkBacks- 04-07-2009, 03:04 PM #1
Member
- Join Date
- Mar 2009
- Posts
- 5
- Rep Power
- 0
problem with changes of Dynamic input width box
i have two buttons add and remove , When add button is clicked a checkbox and textbox are added.
this text box and checkbox are in table
problem :
I have kept the table width to 800px and want to set this same width for the text box as they are added.
program
============<HTML>
<HEAD>
<style type="text/css">
.navigation {
position: absolute;
top: 0px;
left: 0px;
height: 20px;
width: 110%;
background-color: #DBE8F1;
}
.content {
position: absolute;
top: 0px;
left: 110px;
height: 100%;
width: 690px;
background-color: #FFFFFF;
color: #4400AA;
overflow: auto;
}
</style>
<TITLE> Add/Remove dynamic rows in HTML table </TITLE>
<SCRIPT language="javascript">
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
// cell2.innerHTML = rowCount + 1;
var element2 = document.createElement("input");
element2.type = "text" ;
cell2.appendChild(element2);
var cell3 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
cell3.appendChild(element2);
}
function deleteRow(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=1; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
</SCRIPT>
</HEAD>
<BODY>
<div class="navigation">
<table width="880px " scrolling="auto" valign="top" >
<tr bgcolor="#DBE8F1" border="0" bordercolor=" " valign="top">
<td valign="top" >
<h3><center>Commands</center></h3>
</td>
</tr>
</table>
</div>
<form style="width: 100%; height: 190%; overflow-x: scroll; overflow-y: scroll; border: 0; background-color: #FFFFFF;">
<table width="880px">
<tr>
<td>
</td>
</tr>
<tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
<INPUT type="button" value=" Add " onclick="addRow('dataTable')" /> & nbsp;
<INPUT type="button" value="Remove" onclick="deleteRow('dataTable')" />
</td>
</tr>
</table>
<TABLE id="dataTable" width="70%" border="1">
<TR>
<TD width="5%"> </TD>
<TD width="75%"><B>Command</B></TD>
<TD width="20%"><b>TimeOut(Sec)</b></TD>
</TR>
</TABLE>
</form>
</BODY>
</HTML>
- 04-09-2009, 12:15 AM #2
Senior Member
- Join Date
- Jan 2009
- Location
- Cambridge, UK
- Posts
- 838
- Rep Power
- 5
Try a JavaScript forum, this is a Java forum. They are very different things.
Don't forget to mark threads as [SOLVED] and give reps to helpful posts.
How To Ask Questions The Smart Way
Reply With QuoteSimilar Threads
-
Scanner input problem
By slayer_azure in forum New To JavaReplies: 3Last Post: 05-26-2008, 10:49 PM -
"Displayed tab width" problem...
By Petike in forum EclipseReplies: 0Last Post: 03-17-2008, 09:39 PM
Bookmarks