I'm encountering an issue with my Grid View and JavaScript code. When I click the button to add a new row, it successfully adds the row but carries over the data from the previous row and fails to save to the database, resulting in an "Invalid Number" error.
<script type='text/javascript' language='javascript'>
function AddNewRecord() {
var grd = document.getElementById('GridView1');
var tbod=grd.rows[0].parentNode;
var newRow=grd.rows[grd.rows.length - 1].cloneNode(true);
tbod.appendChild(newRow);
return false;
}
</script>
<asp:Button ID="Button2" runat="server" Text="Add Row" OnClientClick="return AddNewRecord();"/>
How can I ensure that each new row is generated empty and can be saved to the database?
Here's the code for the Grid:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="White" OnRowCreated="myGridView_ItemCreated" Headerstyle-CssClass="myStyle"
BorderColor="#3366CC" BorderStyle="None" BorderWidth="1px" CellPadding="4" Width="859px">
<RowStyle BackColor="White" ForeColor="#003399" HorizontalAlign="Right" />
<Columns>
<!-- Columns Content Here -->
</Columns>
<FooterStyle BackColor="#99CCCC" ForeColor="#003399" />
<PagerStyle BackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left" />
<SelectedRowStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
<HeaderStyle BackColor="CornflowerBlue" Font-Bold="False" ForeColor="White" Font-Names="Arial" Font-Size="9pt" CssClass="myStyle" />
</asp:GridView>