HI, so im trying to add new rows to my table using the codes that were given but the row doesnt stick, as in it disappears just after clicking a button. Am i doing something wrong?

<script type="text/javascript" charset="utf-8">  
        var giCount = 1;
        $(document).ready(function() 
        {   
            //initialise the table
            $("#tables").dataTable( );
        });
        function fnClickAddRow() {
        $('#tables').dataTable().fnAddData( [
            "Table "+ giCount,
            "Table "+ giCount] );
            giCount++;
        }
    </script>
<div style="float:right;height:0;width:500px">
    <form method="" action="">
        <div style="float:right;height:0;">
            <input type="submit" name="addT" value="Add Table" onclick="fnClickAddRow();" />
        </div>
        <table id="tables" border="2" rules="all" cellspacing="5px" cellpadding="5px" width="500px">
            <thead>
                <tr>
                    <th>Table</th>
                </tr>
            </thead>
            <tbody>

            </tbody>
        </table>
    </form>
</div>

Hi,

Please try to change input type to "button"

<input type="button" name="addT" value="Add Table" onclick="fnClickAddRow();" />

because button type submit may refresh the page.

Please let me know.

Thanks,
Ajay

thanks! that worked.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.