How can I have a column in a GridView computed on the fly?

Question

I have the following GridView:

<asp:GridView ID="gv" AutoGenerateColumns="false" runat="server">
        <Columns>
            <asp:BoundField DataField="productName" HeaderText="Item" />
            <asp:BoundField DataField="unitCost" HeaderText="Cost" DataFormatString="{0:c}" />
            <asp:BoundField DataField="originalCount" ItemStyle-HorizontalAlign="Center" HeaderText="Old Count" />          
            <asp:TemplateField HeaderText="New Count" ItemStyle-HorizontalAlign="Center" >
                <ItemTemplate>
                    <asp:TextBox ID="NewCount"  Width="20" runat="server" />
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>   
    </asp:GridView>

And I want to add a final 'Total' column that calculates

(originalCount - NewCount) * unitCost

and updates it as the user enters a number in the NewCount text box.

Can I do this just with .net, or do I need to use Java? If the latter, how do I tell which Gridview cell to update?

Thanks in advance,

Ben

Answer 1

Updated with new code (old answer below)

You need to use Javascript to do what you're asking. There are a million different ways to this so you'll need to modify the code below to make it work for you.

Create your GridView as follows:

<asp:GridView runat="server" ID="gv1" AutoGenerateColumns="false">
        <Columns>
            <asp:BoundField DataField="productName" HeaderText="Item" />
            <asp:TemplateField HeaderText="Cost">
                <ItemTemplate>
                    <asp:Label runat="server" ID="unitCost" Text='<%# String.Format("{0:c}",Eval("unitCost")) %>'/>
                </ItemTemplate>
            </asp:TemplateField> 
            <asp:TemplateField ItemStyle-HorizontalAlign="Center" HeaderText="Old Count">
                <ItemTemplate>
                    <asp:Label runat="server" ID="originalCount" Text='<%# Bind("originalCount") %>' />
                </ItemTemplate>
            </asp:TemplateField>         
            <asp:TemplateField HeaderText="New Count" ItemStyle-HorizontalAlign="Center" >
                <ItemTemplate>
                    <asp:TextBox ID="NewCount"  Width="20" runat="server" onblur="javascript:GetTotal(this);"  />
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Total" ItemStyle-HorizontalAlign="Center" >
                <ItemTemplate>
                    <asp:Label runat="server" ID="lblTotal"></asp:Label>

                </ItemTemplate>
            </asp:TemplateField>
        </Columns> 
</asp:GridView>

Next add the following Javascript to your Head tag:

<script type="text/javascript">
    function GetTotal(obj) {
        var rowIndex = obj.id.substring(obj.id.lastIndexOf('_') + 1, obj.id.length);
        var unitCost = document.getElementById('MainContent_gv1_unitCost_' + rowIndex).innerHTML.replace("$", "") ;
        var originalCount = document.getElementById('MainContent_gv1_originalCount_' + rowIndex).innerHTML;
        var NewCount = document.getElementById('MainContent_gv1_NewCount_' + rowIndex).value;
        document.getElementById('MainContent_gv1_lblTotal_' + rowIndex).innerHTML = "$" + ((originalCount - NewCount) * unitCost).toFixed(2);    }
</script>

There you have it. When you make a change to the NewCount, the total will automatically be updated in the far right column.

---

Old Answer

You can do this by adding a new TemplateField and then writing a static method to calculate the total. This is off the top of my head but you do something similar to what's below.

First, add the following TemplateField:

<asp:TemplateField HeaderText="Total" ItemStyle-HorizontalAlign="Center" >
   <ItemTemplate>
      <%# GetTotal((double)Eval("originalCount"),(double)Eval("NewCount"),(double)Eval("unitCost")) %>
   </ItemTemplate>
</asp:TemplateField>

Then, in your code-behind, add the following static method:

public static double GetTotal(double originalCount, double NewCount, double unitCost) {
    return (originalCount - NewCount) * unitCost;
}

The end result will be a column with the desired calculated total.

Answer 2

Best Answer - SINGLE LINE

<asp:TemplateField HeaderText="Net Amt">
    <ItemTemplate>    
<%# (Eval("itm_or_fee_amt")==DBNull.Value?0:Convert.ToDouble(Eval("itm_or_fee_amt")))+(Eval("late_fee")==DBNull.Value?0:Convert.ToDouble(Eval("late_fee"))) %>
 </ItemTemplate>  
 </asp:TemplateField>