JQuery in ASP.NET Applications – My jDiv Solution


So, I have a general frustration with working with jQuery in an ASP.NET application. The first, and most obvious, is the ugly markup the HTML controls output. The muddled IDs and the inability to add custom HTML attributes is frustrating.

So, I’ve begun work on a set of classes & controls to help developers work with jQuery in a .NET application.

So far, I’ve composed a jDiv class to use from code behind to generate clean Div tags with as many classes & custom attributes as you like. Also, you can add as many children jDiv elements as you’d like and then just call the parent’s .ToString() method to output all of the markup. This may sound simple, but it is a great tool when you want to use server side C# or VB to output some data, then you want to use jQuery to animate it. The .ToString() method will output the markup, which you can easily output to a clean div.

The jDivControl is similar in composition, a very simple control allowing you to use custom attributes on a standard div tag and you can apply a clean, css & jQuery friendly, ID that will allow you to apply your custom CSS and easily manipulate your elements with jQuery or JavaScript. All you need to do is add your custom attributes to the CustomAttributes property on the jDiv control like so:

CustomAttributes=”customThis=SomeData,customThat=OtherData,customOther=NewData”

and the jDivControl will render your properties on the div tag. This is fantastic for outputting data that jQuery can easily and cleanly access.

The project is up on GitHub, you can access my project via the link below. Try it out and let me know what you think!

jDiv Project

Advertisements
  1. The muddled IDs and the inability to add custom HTML attributes is frustrating. This is fantastic for outputting data that jQuery can easily and cleanly access.Great post. I was checking constantly this blog and I am impressed! Extremely helpful information specially the last part I care for such information much. I was seeking this certain information for a long time. Thanks and good luck.

  1. No trackbacks yet.

Leave a Reply

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 )

Google+ photo

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

Connecting to %s

%d bloggers like this: