Download informationTo download this code sample, click one of the following links:
Technical overviewYou should have some experience in chatting with friends on the web. You may think it is complicated to develop a web chat application. However, ASP.NET provides an easy and accessible way to do it. The technical overview introduces how to construct a web chat room by using AJAX.
The principle controls needed to construct a web chat room by using AJAX are not that complicated. As you know, a web chat application needs the following four basic controls:
- A list control that is used to show the list of chat room members.
- A list control that is used to show the list of chat messages.
- A text box control that is used to input messages.
- A button that is used to send a message.
Users input a message in the text box, and then they press the Send button. In this situation, the message is sent to the server. The message list is updated every two seconds to get the newest messages in the chat room from the server.
It is difficult to make an AJAX web chat application that behaves the same way as a Windows Form application, because you cannot maintain a continuous connection with the server. Therefore, a lot of events that could be immediately communicated between a client and server cannot be realized. The common workaround is to make the web chat application send a request every few seconds to check for server-side updates.
Sample OverviewThis code sample is separated into 4 sections:
- The Data section. For example, LINQ to SQL.
- The Service section. For example, the WCF service.
- The Logic section. For example, the classes that are used for the service and that communicate data.
- The User interface (UI) section. For example, pages and client scripts.
- Create an ASP.NET web application.
- Create a database file. For example, you can create an .mdf file.
- Open the database file and create the following four tables: Note For more information about how to design these tables, follow the sample code that you downloaded.
Table name Description tblChatRoom stores chat room data tblMessagePool stores the chat message data temporarily tblSession stores the user session data tblTalker stores the active user data
- Add LINQ to an SQL file. For example, you can add LINQ to a .dbml SQL file. Drag and drop the tables into the stage of the file in the Visual Studio IDE.
- Create the following class files: NoteFor more information about how to design these classes, follow the sample code that you downloaded.
Table name Description ChatManager.cs In the code sample, there are some static methods to control the data in the database by using LINQ. ChatRoom.cs It is a DataContract that is used to send the chat room data to the client by using the WCF service. Message.cs It is a DataContract that is used to send the message data to the client by using the WCF service. RoomTalker.cs It is a DataContract that is used to send the talker data in a chat room to the client by using the WCF service.
- Add an AJAX-enabled WCF service.
csaspnetajaxwebchat.transition.LeaveChatRoom(RoomID, SuccessCallBack, FailCallBack);
vbaspnetajaxwebchat.transition.LeaveChatRoom(RoomID, SuccessCallBack, FailCallBack);Notes
- Csaspnetajaxwebchat is the namespace for this application.
- Transition is the service name.
- LeaveChatRoom is the method name.
- SuccessCallBack is a function that is called when the service is called successfully.
- FailCallBack is a function that is called when the service call fails.
- Csaspnetajaxwebchat is the namespace for this application.
- Open the Default.aspx page. If there is no Default.aspx page, you need to create one. Create a ScriptManager control, and then insert the following code to add a service reference and a script reference:
<asp:ServiceReference Path="~/Services/Transition.svc" />
<asp:ScriptReference Path="~/Scripts/chatbox.js" />
<link rel="Stylesheet" type="text/css" href="http://ajax.microsoft.com/ajax/jquery.ui/1.8.5/themes/dark-hive/jquery-ui.css" />
Note For more details about Microsoft Ajax CDN, click the link in the “References” section.
- Create a new web page. In this code sample, the new web page is the ChatBox.aspx page. In the ChatBox.aspx page, some UI controls are created to send and receive messages.
Note For more information about the ChatBox.aspx page, see the ChatBox.aspx page in this code sample.
- You are now ready to test the application.
- Microsoft ASP.NET 3.5
- Microsoft ASP.NET 4
LanguagesThis code sample contains the following programming languages:
- To run this sample code, you must have the Microsoft .NET Framework installed.
What is All-In-One Code Framework?All-In-One Code Framework shows most Microsoft development techniques by using code samples in different programming languages. Each example is carefully selected, composed, and documented to show one common code scenario. For more information about All-In-One Code Framework, visit the following Microsoft website:
How to find more All-In-One Code Framework samplesTo find more All-In-One Code Framework samples, search for "kbcodefx" together with related keywords on the Microsoft support Web site. Or, visit the following Microsoft website:
Rapid publishing disclaimerMicrosoft corporation and/or its respective suppliers make no representations about the suitability, reliability, or accuracy of the information and related graphics contained herein. All such information and related graphics are provided "as is" without warranty of any kind. Microsoft and/or its respective suppliers hereby disclaim all warranties and conditions with regard to this information and related graphics, including all implied warranties and conditions of merchantability, fitness for a particular purpose, workmanlike effort, title and non-infringement. You specifically agree that in no event shall Microsoft and/or its suppliers be liable for any direct, indirect, punitive, incidental, special, consequential damages or any damages whatsoever including, without limitation, damages for loss of use, data or profits, arising out of or in any way connected with the use of or inability to use the information and related graphics contained herein, whether based on contract, tort, negligence, strict liability or otherwise, even if Microsoft or any of its suppliers has been advised of the possibility of damages.
Article ID: 2494268 - Last Review: May 23, 2014 - Revision: 1