Cuyahoga is a powerful and well designed Web-based Content Management System. In current version, however, there is not yet Ajax supported. This brief article will show you how we can implement an Ajax based delayed content loading for its module.
The project I am doing will achieve Asian water news from an external website, Global Water News. To do this, I developed a set of classes to download content from external page and then parse them. However, in a synchronous way, the content downloading and parsing process is rather slow, consequently affecting the display of our homepage. A delayed loading of this part of content will be ideal for circumventing this problem.
Figure below shows the schema we developed for Cuyahoga framework.
See www.asian-gwadi.org homepage for online demonstration.
1. Enable Ajax support
Download latest ASP.net Ajax toolkit for framework 2.0 and install it. Add reference to System.Web.Extensions in Web project.
Open a brand new Ajax based web project. This will generate necessary configuration for Ajax support in a Web project. Merge web.config created in this new project to Cuyahoga’s root web.config.
2. Add a Cuyahoga module for your purpose
AsianWaterNewsModule is just derived on ModuleBase and simple leave everything blank.
AsianWaterNewsControl.ascx is the user control working together with the module. It’s based on BaseModuleControl. It simply defines the container where we will populate data later.
AsianWaterNewsControl_Under.ascx is the underlying user control who download data from external web page, parse them and then fill up a repeater control.
AsianWaterNewsFristPage.cs, WaterItem.cs, and WaterNewsPageContent.cs are business logic codes to help AsianWaterNewsContol_Under control to realize its functionality.
AsianWaterNewsService.asmx define a web service, which renders the underlying user control, AsianWaterNewsControl_Under.ascx, to HTML codes. The output of this web services is expected to populate the placeholder contained in Cuyahoga user control, i.e., AsianWaterNewsControl.ascx.
Install directory contains sql scripts for database structure.
See my previous post to get understand how to realize delayed content loading. For English original article, see here.
Download source codes of the AsianWaterNewsModule project.
Note, CSS and images should be defined in the template currently applied to your site. I did not include those stuff in the source code package.
See http://www.asian-gwadi.org/ for the operational demo.