Javascript and Asp.net


Let’s see how we can use javascript with our server side controls with very simple examples

1) One way is using

controlname.attributes.add(string key,string value);

Let’s see an example

1. Create a new webpage

2. Add a textbox to it.

<asp:TextBox ID=”TextBox1″ runat=”server”></asp:TextBox>

3. Now let us add some javascript for onMouseOver event so that whenever mouse is over the textbox it should alert Hello World message.

4. For this add this code on page_load event handler

protected void Page_Load(object sender, EventArgs e)
{
TextBox1.Attributes.Add(“onMouseOver”,”alert(‘Hello World’);”);
}

OnMouseOver is the name of the JavaScript event followed by our javascript code to run on occurence of that event.

5. If small code of javascript is there than we can write it over directly in attributes.add but otherwise it’s better we write the code within our script block and put the name of the function over there

<script type=”text/javascript”>
function mHover()
{
alert(‘Hello World’);
}
</script>

and

protected void Page_Load(object sender, EventArgs e)
{
TextBox1.Attributes.Add(“onMouseOver”, “mHover()”);
}

Normally we can insert javascript by adding attributes to the control.

But for our button server control we can use OnClientClick property for handling button clicks with Javascript code

<asp:Button ID=”Button1″ runat=”server” Text=”Button” OnClientClick=”return confirm(‘Post back to the server?’);”/>

Whatever is written on OnClientClick fires first followed by the postback event.

In above case if the method returns false i.e. user clicks cancel no post back occurs.

Some common javascript events which we can use inside attributes.add are

onChange, onClick, onMouseOver, onMouseOut, onKeyUp, onKeyDown, onSelect, onFocus, onBlur,onAbort, onError, onLoad ,onUnload

In asp.NET we can make use of Page.ClientScript property for managing script blocks

RegisterClientScriptCallBlock() : It writes the script block right after the <form runat=server> tag

RegisterStartupScript() : It writes the script block right before closing </form> tag

We will modify the textbox example we first created

1: Remove the script section from the aspx page and put it on the page load like this

protected void Page_Load(object sender, EventArgs e)
{
TextBox1.Attributes.Add(“onMouseOver”, “mHover()”);
string script=@”<script type=’text/javascript’>
function mHover()
{
alert(‘Hello World’);
}
</script>”;
Page.ClientScript.RegisterClientScriptBlock(this.GetType(),”onMO”,script);
TextBox1.Attributes.Add(“onMouseOver”, “mHover()”);
}

2: Now run the web page and see the source we will find the script added just after the <form> start tag

3: Now replace

Page.ClientScript.RegisterClientScriptBlock(this.GetType(),”onMO”,script);

with

Page.ClientScript.RegisterStartupScript(this.GetType(),”onMO”,script);

4: We will be able to see the script added just before the </form> tag

Bye

Author: Nishant Rana

I love working in and sharing everything about Microsoft.NET technology !

Please share your thoughts

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

CRM for You and Me

Customer Relationship Mgt App for the Professional

D CRM Explorer

Learn about Microsoft Dynamics CRM Power Platform customization and implementation and other cool stuffs

Stroke // Jonas Rapp

I know pre-stroke. I will improve who I was.

Power Melange

Power Melange By Shalinee

Clavin's Blog

Power Automate - Power Apps - SharePoint Online - Azure - Nintex - K2 - Artificial Intelligence

Sat Sangha Salon

An Inquiry in Being

The Indoencers

The Influencers & Influences of Indian Music

Monika Halan's blog

Hand's-free money management

D365 Demystified

A closer look at Microsoft Dynamics 365.

Microsoft Mate (msftmate) - Andrew Rogers

Experienced consultant primarily focused on Microsoft Dynamics 365 and the Power Platform

Knowhere365

Specific topics by Django Lohn on the whole Microsoft365 Stack

Manmit Rahevar's Blog

One Stop Destination for Microsoft Technology Solutions

MG

Naturally Curious

Brian Illand

Power Platform and Dynamics 365

Steve Mordue MVP

A Microsoft Business Applications MVP

Subwoofer 101

Bass defines your home theater

SQLTwins by Nakul Vachhrajani

SQL Server tips and experiences dedicated to my twin daughters.

Everything D365

Discovering Azure DevOps and D365 Business Applications

Tech Wizard

Lets do IT Spells

Two Bite Tips

Valuable Tips To Grow Your Business

XRM Tricks (Power Platform & Dynamics CRM )

Power Platform & Dynamics CRM

CRM TIPS BY PRM

Mail to crmtipsbyprm@gmail.com for queries and suggestions

nijos.dev

Giving back to the community what I have learned

xrm CRM Dynamics

Dynamics CRM Technical & Functional Info

Dynamics 365 Blogs - Explained in unique way

Sometimes you need to look at things from different perspective.

CRM Keeper

Dynamics 365 Customer Engagement, CRM, Microsoft CRM, Dynamics CRM

EVOLVED365

Step into the world of a Dynamics 365 Consultant

Dianamics PCF Lady

Diana & Dynamics 365 & Power Platform

Sara Lagerquist

No Code Customization Concepts

innovativeaj

developer, designer, writer, fun loving, patriotic, humble and a sweet person inside out :) love and respect people who have a great sense of humor.

Temmy Wahyu Raharjo

Dreaming to be a clean coder and TDD minded programmer.

Transform 365

We blog about problems we face and code we write to help others

%d bloggers like this: