get all value of all row of a dynamic html table

Discussion in 'Javascript' started by SAN CAZIANO, Dec 14, 2004.

  1. SAN CAZIANO

    SAN CAZIANO Guest

    I have create a dynamic html table by adding some rows where I have to put
    some value in an input field and now how can I get all value of all row ???

    I try this but it doesn' work
    button onclik=Alert("EditFieldValue2.value");

    Please reply me as soon as possible.



    <script>
    function addRowToTable()
    {
    var FieldArray=new Array("ID","CodiceArticolo","Ltd");

    var tbl = document.getElementById('SearchTable');
    var lastRow = tbl.rows.length;

    // if there's no header row in the table, then iteration = lastRow + 1
    var iteration = lastRow;
    var row = tbl.insertRow(lastRow);

    // numero progressivo
    var cellFirst = row.insertCell(0);
    var textNode = document.createTextNode(iteration);

    cellFirst.appendChild(textNode);

    // edit per il valore da ricercare sul campo
    var cellOne = row.insertCell(1);

    var el = document.createElement("input");
    el.setAttribute('type', 'text');
    el.setAttribute('size', '40');
    el.setAttribute('name', 'EditFieldValue' + iteration);
    cellOne.appendChild(el);
    }

    function removeRowFromTable()
    {
    var tbl = document.getElementById('SearchTable');
    var lastRow = tbl.rows.length;
    if (lastRow > 2) tbl.deleteRow(lastRow - 1);
    }

    function openInNewWindow(frm)
    {
    // open a blank window
    var aWindow = window.open("", "TableAddRowNewWindow",

    'scrollbars=yes,menubar=yes,resizable=yes,toolbar=no,width=400,height=400');

    // set the target to the blank window
    frm.target = "TableAddRowNewWindow";

    // submit
    frm.submit();
    }
    </script>

    <form action="tableaddrow_nw.html" method="get">

    <input type="button" value="Add" onclick="addRowToTable();" />
    <input type="button" value="Remove" onclick="removeRowFromTable();" />
    <input type="button" value="Submit" onclick="openInNewWindow(this.form);" />
    <table border="1" id="SearchTable">
    <tr>
    <th colspan="5">Sample table</th>
    </tr>
    <tr>
    <td>1</td>
    <td><input type="text" name="EditFieldValue1" size="40" /></td>
    </tr>
    </table>

    </form>
    SAN CAZIANO, Dec 14, 2004
    #1
    1. Advertising

  2. SAN CAZIANO

    RobB Guest

    SAN CAZIANO wrote:
    > I have create a dynamic html table by adding some rows where I have

    to put
    > some value in an input field and now how can I get all value of all

    row ???
    >
    > I try this but it doesn' work
    > button onclik=Alert("EditFieldValue2.value");
    >
    > Please reply me as soon as possible.
    >
    >
    >
    > <script>
    > function addRowToTable()
    > {
    > var FieldArray=new Array("ID","CodiceArticolo","Ltd");
    >
    > var tbl = document.getElementById('SearchTable');
    > var lastRow = tbl.rows.length;
    >
    > // if there's no header row in the table, then iteration = lastRow +

    1
    > var iteration = lastRow;
    > var row = tbl.insertRow(lastRow);
    >
    > // numero progressivo
    > var cellFirst = row.insertCell(0);
    > var textNode = document.createTextNode(iteration);
    >
    > cellFirst.appendChild(textNode);
    >
    > // edit per il valore da ricercare sul campo
    > var cellOne = row.insertCell(1);
    >
    > var el = document.createElement("input");
    > el.setAttribute('type', 'text');
    > el.setAttribute('size', '40');
    > el.setAttribute('name', 'EditFieldValue' + iteration);
    > cellOne.appendChild(el);
    > }
    >
    > function removeRowFromTable()
    > {
    > var tbl = document.getElementById('SearchTable');
    > var lastRow = tbl.rows.length;
    > if (lastRow > 2) tbl.deleteRow(lastRow - 1);
    > }
    >
    > function openInNewWindow(frm)
    > {
    > // open a blank window
    > var aWindow = window.open("", "TableAddRowNewWindow",
    >
    >

    'scrollbars=yes,menubar=yes,resizable=yes,toolbar=no,width=400,height=400');
    >
    > // set the target to the blank window
    > frm.target = "TableAddRowNewWindow";
    >
    > // submit
    > frm.submit();
    > }
    > </script>
    >
    > <form action="tableaddrow_nw.html" method="get">
    >
    > <input type="button" value="Add" onclick="addRowToTable();" />
    > <input type="button" value="Remove" onclick="removeRowFromTable();"

    />
    > <input type="button" value="Submit"

    onclick="openInNewWindow(this.form);" />
    > <table border="1" id="SearchTable">
    > <tr>
    > <th colspan="5">Sample table</th>
    > </tr>
    > <tr>
    > <td>1</td>
    > <td><input type="text" name="EditFieldValue1" size="40" /></td>
    > </tr>
    > </table>
    >
    > </form>


    This is a mess:

    > button onclik=Alert("EditFieldValue2.value");


    Most people would know what you're trying to do, but sloppiness does
    not sit well with programming. In any event, you also didn't mention
    browser/error message etc. so I'll assume Internet Explorer - which
    doesn't add references to form elements generated with .createElement()
    to either the document object or the form's .elements[] collection.
    Might want to do it yourself:

    <input type="button" value="Add" onclick="addRowToTable(this.form);" />
    <input type="button" value="Remove"
    onclick="removeRowFromTable(this.form);" />
    .................
    function addRowToTable(frm)
    {
    var FieldArray=new Array("ID","CodiceArticolo","Ltd");
    var tbl = document.getElementById('SearchTable');
    var lastRow = tbl.rows.length;
    // if there's no header row in the table, then iteration = lastRow + 1
    var iteration = lastRow;
    var row = tbl.insertRow(lastRow);
    // numero progressivo
    var cellFirst = row.insertCell(0);
    var textNode = document.createTextNode(iteration);
    cellFirst.appendChild(textNode);
    // edit per il valore da ricercare sul campo
    var cellOne = row.insertCell(1);
    var el = document.createElement("input");
    el.setAttribute('type', 'text');
    el.setAttribute('size', '40');
    el.setAttribute('name', 'EditFieldValue' + iteration);
    frm[el.name] = frm.elements[el.name] = el;
    cellOne.appendChild(el);
    }

    function removeRowFromTable(frm)
    {
    var tbl = document.getElementById('SearchTable');
    var lastRow = tbl.rows.length;
    if (lastRow > 2)
    {
    tbl.deleteRow(lastRow - 1);
    frm['EditFieldValue' + --lastRow] = frm.elements['EditFieldValue' +
    lastRow] = null;
    }
    }

    btw it's <input type="button" value="show"
    onclick="alert(EditFieldValue2.value)">
    RobB, Dec 14, 2004
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. RC
    Replies:
    1
    Views:
    784
    Eliyahu Goldin
    Jun 2, 2005
  2. phl
    Replies:
    1
    Views:
    4,330
    Martin Jay
    Jun 8, 2006
  3. D
    Replies:
    0
    Views:
    198
  4. harry

    Get 2nd cell value from table row?

    harry, Jul 22, 2004, in forum: Javascript
    Replies:
    2
    Views:
    128
    Mick White
    Jul 22, 2004
  5. Replies:
    3
    Views:
    159
Loading...

Share This Page