Saturday, March 20, 2010

Use CSS and JavaScript in textbox in .aspx page.


Use CSS and JavaScript in textbox in .aspx page.

 Create a project and add a new .aspx page and then in the aspx page add the following code in the head section.

<style type="text/css">

        .uppercase

        {

            text-transform: uppercase;

        }

        .lowercase

        {

            text-transform: lowercase;

        }

        .capitalize

        {

            text-transform: capitalize;

        }

    </style>

And then use the above classes in the code as

Typing Text in UPPERCASE

        <br />

        <asp:TextBox ID="TextBox1" runat="server" CssClass="uppercase"></asp:TextBox><br />

        Typing Text in lowercase

        <br />

        <asp:TextBox ID="TextBox3" runat="server" CssClass="lowercase"></asp:TextBox><br />Typing Text in Capatlize

        <br />

        <asp:TextBox ID="TextBox4" runat="server" CssClass="capitalize"></asp:TextBox>

And then when you will type any text in these textboxes then they will appear as per the css class used.

And to use the JavaScript in the .aspx page we need to add the script in the head section and the script in the body section too to use the script we have made in the head section.

The script of head section looks like:

<script type="text/javascript" language="JavaScript">

<!--

        function chkNumeric(strString)

        // strString is the string passed to be checked

        // check for valid numeric strings

        {

            // strvalidchars defines the set of characters which are valid in a numeric field

            var strValidChars = "0123456789.-";

            // strings

            var strChar;

            // boolresult is the variable which returns true is string is in correct format or false if it is not a valid numeric string

            var boolResult = true;

 

            if (strString.length == 0) return false;

            // test strString consists of valid characters listed above

            for (i = 0; i < strString.length && boolResult == true; i++) {

                strChar = strString.charAt(i);

                if (strValidChars.indexOf(strChar) == -1) {

                    boolResult = false;

                }

            }

            return boolResult;

        }

 

// -->

    </script>

And the body section will look like

<body>

    <form id="form1" runat="server">

    <div>

        Checking Numbers in textbox using javascript<br />

        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

        <br />

        <script type="text/javascript">

            function fun() {

                if (document.form1.TextBox2.value.length == 0) {

                    alert("Please enter a value.");

                }

                else if (chkNumeric(document.form1.TextBox2.value) == false) {

                    alert("Please check - the string conatins non numeric value!");

                }

            }

           

        </script>

        <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="fun()" />

    </div>

    </form>

</body>

And in the body section I have added the script and a button to use that script.

For more clarifications please view the video at: http://www.jaipurmentor.com/share-tech-videos/viewvideo/6/learning-videos/using-css-and-javascipt-in-textbox.html

 

 


Thanks and Regards
Meetu Choudhary
Microsoft MVP (ASP.Net)
DNS MVM Awardee | Microsoft Certified Professional | Microsoft Certified Technology Specialist |
Co-founder / Webmaster : www.jaipurmentor.com | www.msdotnetmentor.com | www.indiaalt.net | Lead Editor / Webmaster : www.dotnetspider.com | www.silverlightclub.com  | interview.msdotnetheaven.com | forum.msdotnetheaven.com | My Blog : http://aspnetbymeetu.blogspot.com | My Profile : www.google.com/profiles/meetuchoudhary

Friday, March 12, 2010

Changing properties of textbox in visual studio 2010


Changing properties of textbox in visual studio 2010
To change the properties of the textbox at run time we need a textbox whose properties we will be changed and an event on which we can see the changes that we have made are applied so to solve the purpose of an event I have taken a command button or button whose click event will work for as the triggering event.
A Design view is shown here.
There are three controls:
And following changes are made to their properties.

Label1           
            ID: lbl_Name
            Backcolor: Aqua
            BorderColor: #660066
BorderStyle: Double
BorderWidth: 5px
Font:
            Bold: True
            Italic: True
            Name: Book Antiqua
            ForeColor: Red
            Text: Name
ToolTip: Enter Your First Name

Textbox1
ID: txt_name
Accesskey: n
Button1
            ID : btn_click
Text: Click

Then you can either double click on the button in the Default.aspx page or you can double click on the combobox in the properties window under events in front of click event in order to generate the click event.
Once you will do that you will see the following window.

And in this window you can write the following code.
protected void btn_click_Click(object sender, EventArgs e)
        {
            txt_name.TextMode = TextBoxMode.MultiLine;
            txt_name.Text="My name is Meetu ";

        }
This will change the mode of the textbox to multiline and the text as well.
The following code will be executed when the text of the textbox will be changed but here is a catch if you will not change the autopostback property of the textbox to true this event wont execute and the default value for autopostback is false as in most of the cases we do not prefer a textbox to call the code form the server side.

        protected void txt_name_TextChanged(object sender, EventArgs e)
        {
            lbl_Name.Text = "event called";
        }
Now you can run the program and check these properties and events and can try changing more properties.

Thanks and Regards
Meetu Choudhary
Microsoft MVP (ASP.Net)
DNS MVM Awardee | Microsoft Certified Professional | Microsoft Certified Technology Specialist |
Co-founder / Webmaster : www.jaipurmentor.com | www.msdotnetmentor.com | www.indiaalt.net | Lead Editor / Webmaster : www.dotnetspider.com | www.silverlightclub.com  | interview.msdotnetheaven.com | forum.msdotnetheaven.com | My Blog : http://aspnetbymeetu.blogspot.com | My Profile : www.google.com/profiles/meetuchoudhary

Subscribe via email

Enter your email address:

Delivered by FeedBurner

MSDotnetMentor

MSDotnetMentor My Website http://msdotnetmentor.com