JavaScript, the language for them all!! (Jquery with gridview in asp.net 2.0)

Posted by Ali AL Lawati on Sep 4, 2008 in Development, English | 2 comments

Once a long time ago (in 80s) I think Assembly was considered the savior for when ever some one need to do some dirty work with their C or whatever language code and its not clear for him how to do it there or few things are not supported assembly comes to give you control on the tiniest transistor on the PC so you can do what ever in your mind (this is not just 80s it is applicable for all times  )

In 90s the days of C++, Visual Basic 6.0, JAVA, PHP,… etc I think the savior was the C language, really when ever there was something you cannot do in any of these languages that you are working on, you would just connect it to a c DLL or any c library file!!, using JNI for Java or active or DLL library for visual basic and similarly for others.

These days (WEB 2.0 days) all of the applications are moving to web using PHP J2EE, .NET 2005/2008, R on R and others. The common factor between them is they all need JavaScript to do the dirty work for them (working on client machines) so as in old days when all programmers needed to know assembly or as in 90s when all programmers needed to know C to do wonders with their softwares, these days developers must know JavaScript; cause it is the language for them all (applicable to any JavaScript framework (jquery, mootool, prototype))!!!

Ok that’s enough chit chat, now why I am talking all about this?? Because jquery enabled me to do something fun with asp.net 2.0’s gridview

I will show you

I have added a jscript folder to my project and in it I have added the jquery and one of its plug-in: datepicker which will show a date picker calendar

Added jquery to my master page code so it will be available to all of my pages in the application that uses this master page

<script type=”text/javascript” src=”Jscript/jquery-1.2.1.min.js”></script>

Now I have a gridview (well for my application need I have a very complex 3 level nested gridview)

Now close date is a template column where I have a textbox I made the cssclass of the text box equals to “datepickerz” <asp:TextBox ID=”TextBox1″ runat=”server” Text=’<%# Bind(“close_date”) %>‘ CssClass=”datepickerz” Width=”89px”></asp:TextBox>

Now I need for each row in this complex gridview the textbox to be a datepicker so simply I wrote the following jquery script

<script type=”text/javascript” src=”Jscript/ui.datepicker.js”></script>

<script type=”text/javascript” >

$(document).ready(function() {

$(‘.datepickerz’).each( function () {

$(this).attachDatepicker();

});

});

</script>

Which is one of the beautiful magic of jquery it allows to pick all controls that have been assigned the class datepickerz and then for each control I just attach it with the datepicker.

The result whenever I click on the textbox in any editable row in the complex gridview I will get a floating calendar to select a date that will be stored in the textbox.

I know I have not discovered the atoms by doing this simple activity, but I wanted to mention it because as I see around me (in Oman) most of .NET developers are not aware of Jquery and other JavaScript frameworks and their features.

Related posts:

1. Calling ASP Functions from java script
2. search_Resutls