onblur onfocus client side update of footer total sample code not working in firefox

[EJ]

the methods for never fire on this sample code at http://www.telerik.com/help/aspnet-ajax/grdtotalsingridfooters.html under

Client-side calculation of totals for a template column in firefox 3.6.10 but works fine in IE 8 how do I adapt this telerik supplied sample code so that it works on both of them?

<script type="text/javascript">
  var initialValue = 0.0;
   function update(footerBox, changedBox)
   {
   var footerBoxControl = $get(footerBox);
   var changedBoxControl = $get(changedBox);
   var tempValue = footerBoxControl.value - initialValue;
   footerBoxControl.value = parseFloat(tempValue) + parseFloat(changedBoxControl.value);
   }
   function getInitialValue(changedBox)
   {
   var changedBoxControl= document.getElementById(changedBox);
   initialValue = parseFloat(changedBoxControl.value);
   }
 </script>

<form id="form1"  runat="server">
       <telerik:RadGrid
        ShowFooter= "true"
        ID= "RadGrid1" runat="server" DataSourceID="AccessDataSource1" GridLines="None"
        OnPreRender= "RadGrid1_PreRender" OnItemDataBound="RadGrid1_ItemDataBound">
           <MasterTableView AutoGenerateColumns="False" DataKeyNames="OrderID"
           DataSourceID= "AccessDataSource1">
               <Columns>
                   <telerik:GridBoundColumn DataField="OrderID" DataType="System.Int32"
                   HeaderText= "OrderID"
                       ReadOnly= "True"
                       SortExpression= "OrderID" UniqueName="OrderID">
                   </telerik:GridBoundColumn>
                   <telerik:GridTemplateColumn UniqueName="Template1">
                   <ItemTemplate>
<asp:TextBox runat="server" ID="TextBox1" Text='<% #Eval("Freight") %>'></asp:TextBox>
                   </ItemTemplate>
                   <FooterTemplate>
                   <asp:TextBox runat="Server" ID="TextBox2">
                   </asp:TextBox>
                   </FooterTemplate>
                   </telerik:GridTemplateColumn>
               </Columns>
               <ExpandCollapseColumn Visible="False">
                   <HeaderStyle Width="19px" />
               </ExpandCollapseColumn>
               <RowIndicatorColumn Visible="False">
                   <HeaderStyle Width="20px" />
               </RowIndicatorColumn>
           </MasterTableView>
       </telerik:RadGrid><asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/Nwind.mdb"
           SelectCommand= "SELECT TOP 10 [OrderID], [Freight] FROM [Orders]"></asp:AccessDataSource>
   </form>

public partial class _Default : System.Web.UI.Page
{
   double sum = 0;
   string clientID;


   protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
   {
        if (e.Item is GridDataItem)
       {
           GridDataItem dataItem = (GridDataItem)e.Item;
           sum+=double.Parse((dataItem[ "Template1"].FindControl("TextBox1") as TextBox).Text);
       }
        else if (e.Item is GridFooterItem)
       {
           GridFooterItem footer = (GridFooterItem)e.Item;
           (footer[ "Template1"].FindControl("TextBox2") as TextBox).Text = sum.ToString();
           clientID = (footer["Template1"].FindControl("TextBox2") as TextBox).ClientID;
       }
   }



   protected void RadGrid1_PreRender(object sender, EventArgs e)
   {
       foreach (GridDataItem dataItem in RadGrid1.MasterTableView.Items)
       {
           (dataItem[ "Template1"].FindControl("TextBox1") as TextBox).Attributes.Add("onblur", "update('" + clientID + "'" + "," + "'" + (dataItem["Template1"].FindControl( "TextBox1") as TextBox).ClientID + "')");
           (dataItem[ "Template1"].FindControl("TextBox1") as TextBox).Attributes.Add("onfocus", "getInitialValue('" + (dataItem["Template1"].FindControl( "TextBox1") as TextBox).ClientID + "')");
       }
   }
}

[Veli]

Hi EJ,

I took the sample code and put it in a test page. I am getting the values updated both in IE8 and Firefox 3.6.11. The only think I observe is that in Firefox the result is not rounded and shows all the decimal digits after parsing and addition:



And to fix this, you can apply an additional rounding function:

var initialValue = 0.0;
function update(footerBox, changedBox)
{
    var footerBoxControl = $get(footerBox);
    var changedBoxControl = $get(changedBox);
    var tempValue = footerBoxControl.value - initialValue;
    var result = parseFloat(tempValue) + parseFloat(changedBoxControl.value);
    footerBoxControl.value = round(result, 2);
}

function round(value, decimals)
{
    var pow = Math.pow(10, decimals);
    return Math.round(value * pow) / pow;
}

function getInitialValue(changedBox)
{
    var changedBoxControl = document.getElementById(changedBox);
    initialValue = parseFloat(changedBoxControl.value);
}

Attaching the test page I used.

Veli
the Telerik team