dropdown calculator control

  1. #1

    dropdown calculator control

    dropdown calculator control
    Click image for larger version. 

Name:	advcalculatordrop.png 
Views:	221 
Size:	9.5 KB 
ID:	2943
  2. #2
    Here is something that I wrote that works like a simple calculator. Maybe this will work for you in the meanwhile.

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="testing_Default" %>
    <%@ 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>
        <script type="text/javascript">
         function checkformistakes(calculation) {
                var re = "";
                re = /(\n[\+\-\*\/\.]|^[\+\-\*\/\.]|[\+\-\*\/\.]\n)/g;
                if (re.test(calculation)) {
                    Ext.Msg.alert("Calculation Error", "You must not start or end a line with any of plus, minus, divide, multiply or decimal(+-/*.)");
                    return false;
                }
                 var res = new RegExp("[A-Za-z;'%^!@#$%&]", "g");
                 txtCalc.setRawValue(calculation.replace(res,  ''));
                 re = /[\+\-\*\/]{2,}/g; 
                if (re.test(calculation)) {
                    Ext.Msg.alert("Calculation Error", "You must not have two operators (+-/*) together.");
                    return false;
                }
                re = /[\.]{2,}/g;
                if (re.test(calculation)) {
                    Ext.Msg.alert("Calculation Error", "You must not have two dots (.) together.");
                    return false;
                }
                re = /={2,}/g;
                if (re.test(calculation)) {
                    Ext.Msg.alert("Calculation Error", "You must not have two equals (=) together.");
                    return false;
                }
                re = /[a-zA-Z0-9](?=\()/g;
                if (re.test(calculation)) {
                    Ext.Msg.alert("Calculation Error", "You can't precede a bracket by a number or letter. Use +-*/");
                    return false;
                }
                re = /\)(?=[a-zA-Z0-9])/g;
                if (re.test(calculation)) {
                    Ext.Msg.alert("Calculation Error", "You can't follow a bracket by a number or letter. Use +-*/");
                    return false;
                }
                re = /[\+\-\*\/](?=\=)/g;
                if (re.test(calculation)) {
                    Ext.Msg.alert("Calculation Error", "Equals (=) cannot follow and operator (+-/*).");
                    return false;
                }
                re = /(^\d|\n\d)(?=([a-zA-Z]| ))/g;
                if (re.test(calculation)) {
                    Ext.Msg.alert("Calculation Error", "Text lines cannot start with a digit.");
                    return false;
                }
                return true;
            }
        </script>
    
    
    </head>
    <body>
        <form id="form1" runat="server">
        <ext:ResourceManager runat="server">
        </ext:ResourceManager>
        <ext:DropDownField ID="txtAnswer" runat="server" TriggerIcon="Combo">
            <Component>
                <ext:Panel Hidden="true" ID="pnlCalc" Height="155" Title="Calculator" Width="135"
                    runat="server">
                    <Items>
                        <ext:TableLayout ID="TableLayout1" runat="server" Columns="4">
                            <Cells>
                                <ext:Cell ColSpan="4">
                                    <ext:TextField ID="txtCalc" Width="129" StyleSpec="margin-left: 2px; text-align: right"
                                        runat="server">
                                    </ext:TextField>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button OnClientClick="x = txtCalc.getRawValue(); x += '1'; txtCalc.setRawValue(x)"
                                        StyleSpec="margin-left: 2px" ID="Button1" MinWidth="30" runat="server" Text="1"
                                        StandOut="true">
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button2" MinWidth="30" runat="server"
                                        Text="2" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '2'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button3" MinWidth="30" runat="server"
                                        Text="3" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '3'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button4" MinWidth="30" runat="server"
                                        Text="+" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += ' + '; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button5" MinWidth="30" runat="server"
                                        Text="4" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '4'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button6" MinWidth="30" runat="server"
                                        Text="5" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '5'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button7" MinWidth="30" runat="server"
                                        Text="6" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '6'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button8" MinWidth="30" runat="server"
                                        Text="-" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += ' - '; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button9" MinWidth="30" runat="server"
                                        Text="7" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '7'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button10" MinWidth="30" runat="server"
                                        Text="8" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '8'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button11" MinWidth="30" runat="server"
                                        Text="9" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '9'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button12" MinWidth="30" runat="server"
                                        Text="X" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += ' * '; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button13" MinWidth="30" runat="server"
                                        Text="C" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = ''; txtCalc.setRawValue('')" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button14" MinWidth="30" runat="server"
                                        Text="0" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '0'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button15" MinWidth="30" runat="server"
                                        Text="." StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += '.'; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell>
                                    <ext:Button StyleSpec="margin-left: 2px" ID="Button16" MinWidth="30" runat="server"
                                        Text="/" StandOut="true">
                                        <Listeners>
                                            <Click Handler="x = txtCalc.getRawValue(); x += ' / '; txtCalc.setRawValue(x)" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                                <ext:Cell ColSpan="4">
                                    <ext:Button StyleSpec="margin-left: 2px" MinWidth="129" ID="btnEq" runat="server"
                                        Text="=" StandOut="true">
                                        <Listeners>
                                            <Click Handler="if (checkformistakes(txtCalc.getRawValue()) == false){return}; x = eval(txtCalc.getRawValue()); if (x == undefined){return;}; if(x.length != 0){ txtAnswer.setRawValue(x);x = ''; txtCalc.setRawValue(''); #{pnlCalc}.hide(); };" />
                                        </Listeners>
                                    </ext:Button>
                                </ext:Cell>
                            </Cells>
                        </ext:TableLayout>
                    </Items>
                </ext:Panel>
            </Component>
        </ext:DropDownField>
        </form>
    </body>
    </html>
  3. #3
    Hi @Richardt,

    Thanks for sharing!

Similar Threads

  1. Replies: 6
    Last Post: Jan 28, 2012, 1:14 AM
  2. Replies: 2
    Last Post: May 14, 2011, 6:29 PM
  3. [CLOSED] Dropdown using User Control
    By speedstepmem4 in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Mar 21, 2011, 9:42 AM
  4. Replies: 6
    Last Post: Feb 08, 2011, 6:17 PM
  5. [CLOSED] Calculator Function
    By iansriley in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Nov 02, 2010, 8:29 AM

Posting Permissions