Hi Dedzil,
Please refer below sample.
HTML
<form id="form1" runat="server">
<asp:Repeater ID="rptProducts" runat="server">
<HeaderTemplate>
<table id="tblProducts">
<tr>
<th>Item</th>
<th>Price</th>
<th>Quantity</th>
<th>Total</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<asp:Label ID="lblItem" runat="server" Text='<%# Eval("Item") %>'></asp:Label>
</td>
<td>
<asp:TextBox ID="txtPrice" runat="server" Text='<%# Eval("Price") %>'></asp:TextBox>
</td>
<td>
<asp:TextBox ID="txtQuantity" runat="server" Text='<%# Eval("Quantity") %>'></asp:TextBox>
</td>
<td>
<asp:Label ID="lblTotal" runat="server" Text='<%# Eval("Total") %>'></asp:Label>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</form>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('[id*=tblProducts] tr:has(td)').each(function () {
var price = $(this).find('[id*=txtPrice]').val();
var qty = $(this).find('[id*=txtQuantity]').val();
$(this).find('[id*=lblTotal]').html(parseFloat(price) * parseFloat(qty));
});
});
</script>
Namespace
using System.Data;
Code
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[4] {
new DataColumn("Item"),
new DataColumn("Price"),
new DataColumn("Quantity"),
new DataColumn("Total") });
dt.Rows.Add("Shirt", "200", "10", "0");
dt.Rows.Add("Football", "30", "20", "0");
dt.Rows.Add("Bat", "50", "20", "0");
dt.Rows.Add("Cap", "100", "40", "0");
rptProducts.DataSource = dt;
rptProducts.DataBind();
}
}
Screenshot
