How to show dollars format on label

  1. #1

    How to show dollars format on label

    Hi,
    I am trying to show usdollar format number on the lable. When the page loads its working fine but when i click on the button to assign new value to the lable its not showing in us dollar format..

    below is the sample code.. please tell me where am i doing wrong?
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <ext:XScript runat="server">
        <script language="javascript" type="text/javascript">
            var usDollarFormat = function (lbl, v) {
                v = (Math.round((v - 0) * 100)) / 100;
                v = (v == Math.floor(v)) ? v + ".00" : ((v * 10 == Math.floor(v * 10)) ? v + "0" : v);
                v = String(v);
                var ps = v.split('.'),
                    whole = ps[0],
                    sub = ps[1] ? '.' + ps[1] : '.00',
                    r = /(\d+)(\d{3})/;
                while (r.test(whole)) {
                    whole = whole.replace(r, '$1' + ',' + '$2');
                }
                v = whole + sub;
                if (v.charAt(0) == '-') {
                    return '-$' + v.substr(1);
                }
                lbl.setFieldLabel("$" + v);
                //lbl.setText("$" + v);
                return "$" + v;
            }
        </script>
        </ext:XScript>
    </head>
    <body>
        <form id="form1" runat="server">
        <ext:ResourceManager runat="server" />
        <div>
            <ext:Button ID="btnSetDollars" runat="server" Text="Set new dollar value">
                <DirectEvents>
                    <Click OnEvent="btnSetDollars_Click" />
                </DirectEvents>
            </ext:Button>
            <ext:Label ID="lblDollar" runat="server">
                <Listeners>
                    <AfterRender Handler=" var r=usDollarFormat(#{lblDollar},#{lblDollar}.fieldLabel); alert(r);" />
                </Listeners>
            </ext:Label>
        </div>
        </form>
    </body>
    </html>
    this is code behind
    namespace WebApplication1
    {
        public partial class DollarLable : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                lblDollar.FieldLabel = "34567";
            }
    
            protected void btnSetDollars_Click(object sender, DirectEventArgs e)
            {
                lblDollar.FieldLabel = "123456";
            }
        }
    }
    is there any other way to achieve my requirement?

    thank you.
  2. #2
    Hi,

    Well, you can format on server side or:

    Example
    <%@ Page Language="C#" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                this.Label1.FieldLabel = "34567";
            }
        }
    
        protected void Button_Click(object sender, DirectEventArgs e)
        {
            X.Call("setFieldLabel", new JRawValue(this.Label1.ClientID), "123456");
        }
    </script>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.Net Example</title>
        <script language="javascript" type="text/javascript">
            var usDollarFormat = function (v) {
                v = (Math.round((v - 0) * 100)) / 100;
                v = (v == Math.floor(v)) ? v + ".00" : ((v * 10 == Math.floor(v * 10)) ? v + "0" : v);
                v = String(v);
                var ps = v.split('.'),
                    whole = ps[0],
                    sub = ps[1] ? '.' + ps[1] : '.00',
                    r = /(\d+)(\d{3})/;
                while (r.test(whole)) {
                    whole = whole.replace(r, '$1' + ',' + '$2');
                }
                v = whole + sub;
                if (v.charAt(0) == '-') {
                    return '-$' + v.substr(1);
                }
                return "$" + v;
            };
    
            var setFieldLabel = function (label, fieldLabel) {
                label.setFieldLabel(usDollarFormat(fieldLabel));
            };
        </script>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:Button runat="server" Text="Set new value">
                <DirectEvents>
                    <Click OnEvent="Button_Click" />
                </DirectEvents>
            </ext:Button>
            <ext:Label ID="Label1" runat="server">
                <Listeners>
                    <AfterRender Handler="setFieldLabel(this, this.fieldLabel);" />
                </Listeners>
            </ext:Label>
        </form>
    </body>
    </html>
  3. #3
    Thanks for the reply Danill, its working fine..

    but why dont my example works?
    after assigning new value to the label, why dont it fire afterrender event again?

    Is their any other event which fires when changing value for fieldlable?


    Thank you.
  4. #4
    Quote Originally Posted by Mr.Techno View Post
    after assigning new value to the label, why dont it fire afterrender event again?
    Changing a FieldLabel doesn't cases firing of AfterRender event, because a field is already rendered.

    Quote Originally Posted by Mr.Techno View Post
    Is their any other event which fires when changing value for fieldlable?
    No such event.
  5. #5
    I forgot that there is the usMoney method in the Ext.util.Format utility class.

    So, with some modification my initial example can look this way.

    Example
    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                this.Label1.FieldLabel = "34567";
            }
        }
     
        protected void Button_Click(object sender, DirectEventArgs e)
        {
            string fieldLabel = string.Format("Ext.util.Format.usMoney('{0}')", "123456");
            this.Label1.Call("setFieldLabel", new JRawValue(fieldLabel));
        }
    </script>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.Net Example</title>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:Button runat="server" Text="Set up a new FieldLabel" OnDirectClick="Button_Click" />
            <ext:Label ID="Label1" runat="server">
                <Listeners>
                    <AfterRender Handler="this.setFieldLabel(Ext.util.Format.usMoney(this.fieldLabel));" />
                </Listeners>
            </ext:Label>
        </form>
    </body>
    </html>
    Though I'd still recommend to format a value on server side, it would be more clear.
  6. #6
    thanks danill

Similar Threads

  1. Replies: 1
    Last Post: May 21, 2012, 3:47 PM
  2. I can't show label with textfield
    By LLdeOJ in forum 1.x Help
    Replies: 1
    Last Post: Nov 24, 2010, 10:57 AM
  3. How to Show Data In Decimal format in GridColumn
    By Dinesh.T in forum 1.x Help
    Replies: 0
    Last Post: Jun 11, 2010, 7:25 AM
  4. [CLOSED] How to show a label in front of a button?
    By flormariafr in forum 1.x Premium Help
    Replies: 3
    Last Post: Feb 01, 2010, 10:54 AM
  5. Show value in label on row selection
    By RS in forum 1.x Help
    Replies: 6
    Last Post: Jan 22, 2009, 7:04 AM

Tags for this Thread

Posting Permissions