Blogs

News

Email Subscriptions

Mehul Harry's DevExpress Blog

Accessing ASPxGridView's Serverside Properties From ClientSide

     

Last month, I was creating a sample with the ASPxGridView when I needed to access the PageIndex property from the client side. The PageIndex property holds the current page index number. I needed to use the PageIndex for a client side function. Unfortunately, this property was only available on the server side. I used my keen insight to come up with the perfect suggestion to enhance the product: Just open up a bunch of server properties on the client side! Luckily, someone smarter than me (Andrew the ASPxGridView Architect) saw what a horrible idea that really was and came up with this enhancement that works better and does more...

A new method allows you to expose almost any server side property to the client side. Using an ingenious technique which creates temporary client properties so that the client side is not weighed down with extra HTML or JavaScript if it's not needed.

The CustomJSProperties event enables you to declare temporary client properties. Once declared, these properties can be accessed from the client side. To add a new property, use the event parameter's http://documentation.devexpress.com/#AspNet/clsDevExpressWebASPxGridViewASPxGridViewClientJSPropertiesEventArgstopic property (this represents a collection of property names and their values).

For example, to expose the PageIndex property, first override the CustomJSProperties event and add your custom property to expose to the client side: 

protected void ASPxGridView1_CustomJSProperties(object sender, 
   DevExpress.Web.ASPxGridView.ASPxGridViewClientJSPropertiesEventArgs e) 
{
   e.Properties["cpPageIndex"] = ASPxGridView1.PageIndex;
}

That's it, your done. Now you're free to call this property from the client side:

<input id="Button2" type="button" value="Active Page" 
   onclick="alert(grid.cpPageIndex)" />

To avoid rewriting the ASPxGridView’s base properties, prefix the client side property name with "cp" for custom property (e.g. cpPageIndex).

Here is a sample project that shows how it’s done: [CustomJSProperties.zip]

Thanks.

Published Jan 14 2008, 11:16 PM by Mehul Harry (DevExpress)
Bookmark and Share

Comments

 

Shankar said:

A great Idea which would avoid a postback! as well create an interactive experience for the user.

January 15, 2008 7:16 AM
 

Crono said:

This is indeed a great idea. The best of two worlds, client and server.

Congratulations on that one, it scores big time.

January 15, 2008 8:17 AM
 

George Cox said:

Can this be applied to the other ASPx controls?

January 15, 2008 9:37 AM
 

RAUL TORTIMA said:

Great idea for sure!

I would go further and suggest to develop a component that embraces this functionality.

Take a look at:

www.csharper.net/.../adding_a_control_hook__or_client_side_reference_to_a_control_in_asp_net_.aspx

January 17, 2008 8:06 AM
 

Mehul Harry (DevExpress) said:

Thanks Guys, it is a cool feature.

George, not currently but I'll discuss it with the team.

Raul, Thanks, I'll check it out.

January 18, 2008 3:02 AM
 

Kevin Attard said:

wow, really neat idea :)

February 11, 2008 3:18 PM
 

Gustavo said:

I dont have the  ASPxGridViewClientJSPropertiesEventArgs property, I am using 2007 is it for the version??

Regards

April 6, 2008 2:28 AM
 

Mehul Harry (DevExpress) said:

Hello Gustavo,

This property is supported in version 2007 vol 3 and newer versions.

Thanks.

April 6, 2008 8:29 PM
 

Shalini Kondapalli said:

That's very handy.  Thanks a lot.

May 7, 2008 11:33 AM
 

Nitin Nikam said:

By doing this, I only get value at client side, But

How do I set page Index of grid at client side?

May 20, 2008 11:35 AM
 

Mehul Harry (DevExpress) said:

Hello Nitin,

Can you describe your goal in setting the pageindex on the clientside? We need to know the aim in order to answer this question.

Thanks.

May 20, 2008 2:18 PM
 

Mourad said:

I get always the same value of PageIndex (zero), the value changed on server but not on client side.

August 4, 2008 4:54 PM
 

Mehul Harry (DevExpress) said:

Hello Mourad,

I updated the post and added a sample project. Give that a try and see if it helps you:

community.devexpress.com/.../CustomJSProperties.zip

August 4, 2008 5:43 PM
 

Raymond Kirk said:

I was just thinking about Properties From ClientSide  and you've really helped out. Thanks!

January 17, 2009 1:47 AM
 

sunil said:

Yes its great deal.................

July 30, 2009 9:46 AM

About Mehul Harry (DevExpress)

Mehul Harry is an ASP.NET technical evangelist at Developer Express. You can reach him directly at mharry@DevExpress.com. You can also follow him on Twitter: http://twitter.com/mehulharry
More from DevExpress
Live Chat
Have a pre-sales question?
Need assistance with your evaluation?
We are here to help.
Chat is one of the many ways you can contact members of the DevExpress Team. We are available Monday-Friday between 8:30am and 5:00pm Pacific Time.
If you need additional product information, require pre-sales assistance, or want help with your order, write to us at info@devexpress.com or call us at
+1 (818) 844-3383.