Displays news items of a specific aggregation Abstract
The next task we are facing is to create the displaynewsitems. ASPX page. This page displays the news item title of the selected aggregation abstract in the form of a link. When you click the title, the news content is displayed in the frame in the lower right part. To accomplish this task, we will face the following two major challenges:
· Access the RSS aggregate Abstract Through the specified URL;
· Convert the received XML data into HTML;
Fortunately, in the. NET Framework, it is not very difficult to implement these two tasks. For the first task, only two rows are required.CodeTo load the remote XML data to an xmldocument object. In the second task, it is easier to display XML data on the ASP. NET page using the ASP. net xml Web Control.
The XML Web control is designed to display Original or converted XML data on a web page. The first step to use the XML Web control is to define the XML data source. by defining a series of attributes, you can do this in many ways. Using the document attribute, you can specify an xmldocument instance as the XML data source of the XML Web Control. If XML data is stored in a file in the Web Server File System, you can use the documentsource attribute to provide the relative or absolute path of the XML file. Finally, if your XML data is a string, which of the following statements can you use? The documentcontent attribute. All three methods can be used to associate XML data with the XML control.
Generally, XML data is converted in some way before being displayed on a web page. The XML Web control allows us to specify an XSLT style sheet for this conversion. Similar to XML data, An XSLT style table can be set using one of the two attributes in two different ways. One is that the transform attribute can be assigned to a transform instance, second, assign the relative or absolute path of the XSLT file on the Local Web server to the transformsource attribute.
Now let's create the displaynewsitems. ASPX page. Before adding XML Web controls and compiling background code classes, we need to add a small segment of client JavaScript code in the HTML section. To be precise, add the following <SCRIPT> code block to the
<Script language = "JavaScript">
// Display a blank page in the bottom Frame when the news items Loads
Parent. rbottom. Location. href = "about: blank ";
</SCRIPT>
Each time the displaynewsitems. ASPX page is loaded, the JavaScript code of this client displays a blank page in the framework in the lower right corner. To understand why we need to add this code, let's take a look at what happens when we omit this Code:
· If you click aggregate summary in the frame on the left, the browser will load summary news items in the frame on the top right;
· When you click a news item in the upper right frame, the browser will load the details of the news item in the lower right frame;
Now you can click other aggregate summaries in the frame on the left. the browser will load the new summary news item in the frame on the upper right;
The details of the previous news item are also displayed in the lower right frame! Through the client JavaScript code above, you can click the summary of the frame on the left to clear the content of the lower right frame to eliminate this flaw.
After processing the client code, let's focus on adding XML Web controls. Once the XML Web Control is added, set its ID attribute to xsltnewsitems and the transformsourc attribute to newsitems. XSLT (the name of the XSLT style table file to be created ). Now, in the page_load event processing function, we need to obtain a remote RSS aggregate file in an xmldocument instance, and then assign the document attribute of the XML Web control to the xmldocument instance.
In the page_load event processing function, the code that is closely related to the task we want to implement is the last three lines of code. These three lines of code create a new xmldocument object, load the remote RSS abstract content, and then assign this xmldocument object to the document attribute of the XML Web Control. It's so easy to access remote XML data and display them on ASP. NET pages. Aren't you impressed?
One thing we need to do is create the XSLT style sheet newsitems. aspx. The first draft of the style sheet is as follows:
<? XML version = "1.0" encoding = "UTF-8"?>
<XSL: stylesheetversion = "1.0"
Xmlns: XSL = "http://www.w3.org/1999/XSL/Transform">
<XSL: output method = "html" omit-XML-declaration = "yes"/>
disable-output-escaping = "yes"/>
displayitem. aspx? Id =
rbottom
disable-output-escaping = "yes"/>
( )
This XSLT style table has only one template to match the "/RSS/channel" XPath expression. This template first displays the content of the element in bold. Then, obtain each element cyclically. A hyperlink is displayed to the displayitem. ASPX page for each element, and the location attribute of the element is passed in the query string. Note that the target attribute of the hyperlink is set to rbottom and the name of the lower right frame. Finally, the title and element of each news item are displayed.
This XSLT style sheet has two projects, not everyone is familiar. First, the disable-output-escaping = "yes" attribute in the <XSL: value-of> element. Essentially, the setting of this attribute notifies the XSLT engine not to escape invalid xml characters, such as: &, <,>, "And ''. To understand the meaning of this setting, you must know that if you do not set this attribute (that is, set it to the default value "no"), if the title contains an escape & Character &, the output HTML file also has a &, not just a character &. If you think about it, you will find that this situation will cause many problems. For example, assume that the title of an aggregate file is "Matt'sCoolBlog, if the output escape is not forbidden, the output will retain "Matt'sCool"Blog" is displayed as "Matt's <I> cool </I> blog" on the web page ". When disable-output-escaping = "yes" is used to disable output escape, the output is not escaped, the above content will be treated as "Matt's <I> cool </I> blog" and displayed on the page is what we want "Matt's cool blog ".
Another thing to note is the element <A>. This strange syntax will generate the following output content:
<A href = "displayitem. aspx? Id = position "> news item title </a>
This syntax is used to add an attribute to an element you want to create in the XSLT style sheet, and then use the <XSL: attribute> syntax in the label of the element. Some examples of this syntax can be found on the w3schools Website: The <XSL: attribute> element.
Note that the value of the hyperlink ID query string comes from the <XSL: number> element and is returned from the position () function. <XSL: number> the element only outputs a value. The position () function is an XPATH function used to return the sequential position of the current node in the XML document. This means that for the first news item, the position () function returns 1, the second news item, the position function returns 2, and so on. We need to record this value and pass it through the query string. In this way, when the displayitem. ASP page is accessed, you can know the items that display the RSS aggregate abstract.
Smart readers may have noticed that our XSLT style sheets are not all completed, because the feedid parameter is not passed to the displayitem. ASPX page through the query string. To understand why, let's review the <item> element sequence number passed in the ID query string parameter. That is to say, if the user clicks the fourth news item, displayitem. aspx? Id = 4 is loaded to the frame in the lower right corner. The problem is that the displayitem. ASPX page cannot determine which abstract the user wants to view. There are two different ways to solve this problem. For example, you can use the client JavaScript code in the lower right frame to read the URL of the upper right frame and then determine the feedid value. In my opinion, the simpler way is to pass the feedid value through the query string together with the ID parameter.
In this case, the feedid value does not exist in the rss xml data manipulated by the XSLT style table. However, the displaynewsitems. ASPX page knows the feedid value. You need a method to let the XSLT style sheet know the value. You can achieve this by using XSLT parameters.
The use of XSLT parameters is very simple. In the XSLT style sheet, you need to add a <XSL: param> element to the <XSL: Template> element, which provides the parameter name. The following code names this parameter as feedid:
<XSL: stylesheet version = "1.0" xmlns: XSL = "http://www.w3.org/1999/XSL/Transform">
<XSL: template match = "/RSS/channel">
<XSL: Param name = "feedid"/>
...
</XSL: Template>
</XSL: stylesheet>
Now, you can use the following syntax to use this parameter in the <XSL: value-of> element:
<XSL: value-of select = "$ parametername"/>
Finally, add the following code to our XSLT style sheet to add the feedid query string parameter to the hyperlink:
<A>
<XSL: attribute name = "href"> displayitem. aspx? Id = <XSL: number value = "position ()"/> & feedid = <XSL: value-of select = "$ feedid"
/> </XSL: attribute>
Note that an & character (Escape &) is added after the ID query string parameter, so that we can pass the value of the feedid parameter to the feedid parameter of the query string. This is what we want to add in the XSLT style sheet.
The rest of the work is to set the value of this parameter in the page_load event handler function on the displaynewsitems. ASPX page. You can do this by using the javastargumentlist class. This class has an addparameter () method. Once an instance of this class is created and corresponding parameters are added, the instance can be assigned to the transformargumentlist parameter of the XML Web Control. The following code shows the updated displaynewsitems. ASPX page page_load event handler function:
Display details of a specific news item
The last thing to do is to display the details of the selected news item. The details are displayed in the lower right frame, and the title, description, and link of the news item are displayed. Similar to the displaynewsitem. ASPX page, the displayitem. ASPX page first retrieves a remote RSS aggregate Abstract Based on the passed feedid string parameter, and then displays the details using the XML Web Control. In fact, the page_load event handler function on the displayitem. ASPX page is almost the same as that on the displaynewsitem. ASPX page. There are only two minor differences:
· The displayitem. ASPX page needs to read the ID to query the value of the string parameter;
· The displayitem. ASPX page uses an XSLT parameter, but this parameter is different from that used on the displaynewsitem. ASPX page;
The displaynewsitem. aspx and displayitem. aspx pages both need to pass an XSLT style table in the parameters. The displaynewsitem. ASPX page passes the feedid parameter, while displayitem. aspx also needs to pass in the ID parameter, which indicates that the news item should be displayed in the XSLT style sheet. This small difference is shown in bold in the following code. The following code skips the same part of the displaynewsitems. ASPX page:
The following is an XSLT style table for transforming XML data:
<? XML version = "1.0" encoding = "UTF-8"?>
<XSL: stylesheetversion = "1.0"
Xmlns: XSL = "http://www.w3.org/1999/XSL/Transform">
<XSL: output method = "html" omit-XML-declaration = "yes"/>
<XSL: Param name = "ID"/>
<XSL: template match = "/RSS/channel">
<B> <XSL: value-of select = "item [$ id]/Title"
Disable-output-escaping = "yes"/> </B>
<P>
<XSL: value-of select = "item [$ id]/description"
Disable-output-escaping = "yes"/>
</P>
<A>
<XSL: attribute name = "href"> <XSL: value-
Select = "item [$ id]/Link"/> </XSL: attribute>
<XSL: attribute name = "target"> _ blank </XSL: attribute>
Read more...
</A>
</XSL: Template>
</XSL: stylesheet>
Note that the <XSL: param> element is used to declare the id xslt parameter. Then, in several different <XSL: value-of> elements, the ID parameter is used to capture specific <item> elements from the <item> element list. In the XPath syntax, elementname [I] means to access the I-th element based on the corresponding element name. For example, item [1] gets only the first <item> element, and item [2] gets the second element. Therefore, item [$ id] is a specific <item> element defined by the XSLT parameter ID.
Finally, it is worth noting that there is a hyperlink read more… near the end of the style sheet ..., Its target attribute is set to null, so when the user clicks read more... The browser opens a new window.