Handling Articles and Categories for an ASP.NET AJAX Client-Centric Wiki Application - Display an Article Asynchronously
(Page 3 of 4 )
Click one of the hyperlinks that points to an article in the MsgList.aspx page, and you will be navigated to another web page named ContentList.aspx (Figure 11). For the sake of convenience, we’ve purposely pieced the top and bottom parts together into one picture since there will possibly be a good many comments added to this article.
Figure 11—display an article (the runtime snapshot of the ContentList.aspx page).
Now, let’s see the related code snippet in the MsgList.aspx file, as follows:
<HyperLink id="Title">
<bindings>
<binding dataPath="FileName" property="navigateURL" transformerArgument="ContentList.aspx?PathName={0}" transform="ToString" />
<binding dataPath="Title" property="text" />
</bindings>
</HyperLink>
Here, when we click a hyperlink that points to an article in the ListView control, the navigating URL becomes, for example, ‘http://localhost:1034/AjaxWiki/ContentList.aspx?PathName=1’. As is mentioned above, in this example, we’ve put all the article’s detailed information in ‘.xml’ files, and these files are all located under the root folder (i.e. AjaxWiki). Thus, the content of this article in Figure 11 is stored in the ‘1file.xml’ file.
Now, there appears a question: how can we display the content of the ‘.xml’ file? In fact, there are many solutions; using XMLDataSource in ASP.NET 2.0 is certainly okay, but we are discontented with this solution since it’s server-side based. Manually programming to fetch the xml data from the server side is quite a bother. In this case, MS AJAX has also brought its own solution: using the XsltView control along with XmlDataSource. As you’ve guessed, we are only interested in this third solution.
Since the ‘.xml’ file will be downloaded in a dynamic way, we’re going about this in a way that is quite similar to that adopted in the ‘MsgList.aspx’ file. First, please look at the related xml-script code:
<script type="text/xml-script">
<page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
<components>
<XmlDataSource id="xmlDataSource" />
<xmlDataSource id="xsltSource" autoLoad="true" serviceURL="MyXSLTFile.xsl" />
<XsltView id="dataContent">
<bindings>
<Binding property="document" dataContext="xmlDataSource" dataPath="document" />
<Binding property="transform" dataContext="xsltSource" dataPath="document" />
</bindings>
</xsltView>
………………… (Omitted)
</components>
</page>
</script>
Here, we first defined two XmlDataSource controls (different from those in ASP.NET 2.0). The first one has not been loaded, not to mention its serviceURL parameter. The second one, which is responsible for loading the server-side file ‘MyXSLTFile.xsl’ which defines the style in which the XML file will be rendered, was automatically loaded at the very beginning of downloading the page.
Next, we defined an MS AJAX client-side control named XsltView which is attached to the HTML <div> element with the id being ‘dataContent’. Then, within the sub section <bindings> we bound the property document to the datapath document of the ‘XmlDataSource’ control, and the transform property to the datapath document of the ‘XsltSource’ control.
Now, let’s see the JavaScript code that accomplished the dynamic assignment:
<script type="text/javascript">
var g_xmlDataSource;
function pageLoad(sender,args){
g_xmlDataSource= $find('xmlDataSource');
var categoryid = getParm();
var myfullpathXML=categoryid+"file.xml";
g_xmlDataSource.set_serviceURL(myfullpathXML);
g_xmlDataSource.load();
}
First, we must point out that, in the lifetime of an MS AJAX client-centric page, the pageLoad function (unlike the event onload in DHTML) is executed after all the xml-script blocks have been resolved. The getParm method here is the same as that used above. Therefore, the value of the myfullpathXML variable, in this case, is equal to ‘1file.xml’. Next, we specified the serviceURL parameter of the xmlDataSource control to ‘1file.xml’ by calling the set_serviceURL method. Finally, we loaded the ‘1file.xml’ file by invoking the load method of the xmlDataSource control.
So, does everything seem perfect? No, not quite.
Next: Why is it More Challenging? >>
More ASP.NET Articles
More By Xianzhong Zhu
