Results 1 to 2 of 2
  1. #1
    synclenovo is offline Member
    Join Date
    Mar 2009
    Posts
    5
    Rep Power
    0

    Default 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>&nbsp;
    </td>
    </tr>
    <tr>
    <tr>
    <td>&nbsp;
    </td>
    </tr>
    <tr>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;
    <INPUT type="button" value=" Add " onclick="addRow('dataTable')" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;& 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>

  2. #2
    OrangeDog's Avatar
    OrangeDog is offline Senior Member
    Join Date
    Jan 2009
    Location
    Cambridge, UK
    Posts
    838
    Rep Power
    6

    Default

    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

Similar Threads

  1. Scanner input problem
    By slayer_azure in forum New To Java
    Replies: 3
    Last Post: 05-26-2008, 10:49 PM
  2. "Displayed tab width" problem...
    By Petike in forum Eclipse
    Replies: 0
    Last Post: 03-17-2008, 09:39 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •