Create Client Controls in ASP.NET 2.0 AJAX 1.0 Extensions
page 1 of 9
Published: 19 Jun 2007
In this article Bilal Haidar demonstrates how to create a basic client control Grid with Edit/Delete/Create functionalities with ASP.NET 2.0 AJAX 1.0 Extensions.
by Bilal Haidar
Average Rating: This article has not yet been rated.
Views (Total / Last 10 Days): 40106/ 98


In the last few articles we have been discussing the new features in ASP.NET 2.0 AJAX 1.0. Among the new features is creating client controls that you can instantiate on the client side, add it to the page content, and fire and handle events defined on these client controls.

In this article we will demonstrate the new client controls in AJAX 1.0 by creating a Grid control that allows you to create new records, edit an existing record, and delete an existing record. You might be wondering why we would create such a control in a time we have the GridView that has all this functionality in which we can place it inside an UpdatePanel control and get the Ajaxified GridView! You are right, but with the development of this new AJAX client control, it will show you in details how we can create any control you want, add methods, properties, and events.

Figure 1 below shows the client control Grid we are about to demonstrate in this article.

Figure 1


As you can see, when the page loads, a client control is responsible to show a Grid-like table listing the contacts stored in the database. In each row there are two actions, one to edit and another to delete the current row. In addition, there is a button to create a new contact, which when clicked will show another client control that allows the user to add a new contact to the database.


View Entire Article

User Comments

Title: gsdfg   
Name: nikesh
Date: 2009-12-24 6:21:47 AM
not bad
Title: Mr   
Name: Malcolm Swaine
Date: 2008-07-09 6:24:45 PM
"A control is already associated with the element." - try removing the Ajax Functionality and this goes away ... quick workaround
Title: edit data error   
Name: jfliuyun
Date: 2007-06-21 4:26:44 PM
when first click editimage everything is ok,but before you submit the data ,you click editimage throw error "A control is already associated with the element." can you tell me what happened,and how to result it,thanks
Title: Yes it does!   
Name: Muhammad Mosa
Date: 2007-06-21 8:10:15 AM
Yes it does! at least you closed the door. I was thinking of another way and want to make sure there is no other way
Title: Re: Muhammad   
Name: Bilal Haidar [MVP]
Date: 2007-06-20 6:54:11 AM
In AJAX 1.0 you only have two ways to interact with methods on the server:
1- WS methods
2- Page static methods

In the second option, you can place a static method on the page, inside it you can directly access your API the way you want. Does this help you?

Title: Bind The Control with a data layer   
Name: Muhammad Mosa
Date: 2007-06-20 3:56:54 AM
No, this is not my target. sorry for this. what I mean I have Business Logic Rule Library. I want to use this library's methods to bind data to the AJAX control. Just as in your sample, but instead of using WS I want to use normal library
Title: Re: Bind The Control with a data layer   
Name: Bilal Haidar [MVP]
Date: 2007-06-19 3:47:13 PM
I guess I didn't get your question right!

Do you mean you want to use WS not developed in .NET? Please correct me if I am wrong!

Title: Bind The control with a data layer   
Name: Muhammad Mosa
Date: 2007-06-19 1:26:28 PM
Well, we are on the same boat then. Ok in this sample, do you have any idea how can I bind the control to a data layer method that is not a WS method?!
Keep the good work brother
Title: Re: Carlito   
Name: Bilal Haidar [MVP]
Date: 2007-06-19 1:09:59 PM
I will be checking on that and get back to you here on this article!
Title: Re: Muhammad Mosa   
Name: Bilal Haidar [MVP]
Date: 2007-06-19 1:07:59 PM
Hello Muhammad,
We never use WS as a data layer. I can speak on myself, it is only for demonstration purpose that I embed the nasty DB work inside my WS. Just to save some time!
But in real projects, WS should only be an interface for your application and all your logic (BL and DAL) should be in a seperate API!!

Hope this answers your question!

Title: Mozilla compatibility   
Name: Carlito
Date: 2007-06-19 12:30:41 PM
Hi, I was just trying your sample code which seems to work well with IE but not so well with Firefox.
It seems whenever I click on 'New Contact', the new contact sections shows for a second then disappears and the page reloads the contact list again...
Title: Nice By why always Web Services?!   
Name: Muhammad Mosa
Date: 2007-06-19 9:41:23 AM
Wonderful as usual Bilal. I have one comment but it is not on the article it is general. Every time I read something about ASP.NET AJAX -well not everything- they just present Web Services as the data service to retrive data! While in most cases we don't use web services unless it is required. I mean I'm not going to use Web Service just to act as a data layer, I already have my data layer library!
In this I'm not going to use Web Service! you may suggest to use static web methods on the page itself, well is there are any other alternatives?!

Community Advice: ASP | SQL | XML | Regular Expressions | Windows

©Copyright 1998-2024  |  Page Processed at 2024-05-24 9:24:22 AM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search