xml to html problem - newbie question

Discussion in 'XML' started by grant, Aug 5, 2004.

  1. grant

    grant Guest

    Hi,

    I am new to xml - xsl but wonder if someone could help me with an
    issue. Maybe an explanation of how to get to the result too :)

    I have an xml structure for a menu and i need to create an xsl to
    transform it into html to dynamically create the menu.

    The xml structure cant be changed so that's not an option.

    The xml structure is as follows:

    <?xml version="1.0"?>
    <commandResult>
    <data>
    <searchData>
    <searchName>Web Access Menu</searchName>
    <searchId>80000000000001D0</searchId>
    <listView><name>Web Access Menu</name><label>Web Access
    Menu</label></listView>
    <searchMeta>
    <label>Web Access Menu</label>
    <tableData>
    <tableId>8000000000000119</tableId>
    <accessPermissions>
    <read/>
    </accessPermissions>
    <tableQuickSearch>
    <rId>8000000000000278</rId>
    </tableQuickSearch>
    </tableData>
    <queryId>8000000000000997</queryId>
    <disconnected>0</disconnected>
    <resultsListLimit>100</resultsListLimit>
    <searchParameter>
    <parameterFieldMeta>
    <fieldName>Type</fieldName>
    <fieldId>8000000000001A7C</fieldId>
    <rType>rText</rType>
    <dataAttribute>0</dataAttribute>
    <maxCharacters>10</maxCharacters><isOptional>0</isOptional>
    <defaultConditionValue>0</defaultConditionValue>
    <hasDefault>0</hasDefault>
    <label>Type</label>
    <ordinal>1</ordinal>
    </parameterFieldMeta>
    <operator>Equals</operator>
    </searchParameter>
    <searchFields>
    <searchFieldMeta>
    <fieldName>URL</fieldName>
    <fieldId>8000000000001A80</fieldId>
    <rType>rText</rType>
    <dataAttribute>0</dataAttribute>
    <maxCharacters>100</maxCharacters><label>URL</label>
    <ordinal>0</ordinal><visible>1</visible>
    </searchFieldMeta>
    <searchFieldMeta>
    <fieldName>Target</fieldName>
    <fieldId>8000000000001A7D</fieldId>
    <rType>rText</rType>
    <dataAttribute>0</dataAttribute>
    <maxCharacters>10</maxCharacters><label>Target</label>
    <ordinal>1</ordinal><visible>1</visible>
    </searchFieldMeta>
    <searchFieldMeta>
    <fieldName>Description</fieldName>
    <fieldId>8000000000001A81</fieldId>
    <rType>rText</rType>
    <dataAttribute>0</dataAttribute>
    <maxCharacters>100</maxCharacters><label>Description</label>
    <ordinal>2</ordinal><visible>1</visible>
    </searchFieldMeta>
    </searchFields>
    <availableFields>
    </availableFields>
    </searchMeta>
    <searchResults>
    <resultsListCount>2</resultsListCount>
    <recordSelection>
    <startRecordNumber>0</startRecordNumber>
    <numberOfRecords>2</numberOfRecords>
    </recordSelection>
    <searchRow>
    <recordId>0000000000000001</recordId>
    <fieldValue>forgotpassword.asp</fieldValue>
    <fieldValue>_self</fieldValue>
    <fieldValue>forgot password</fieldValue>
    </searchRow>
    <searchRow>
    <recordId>0000000000000002</recordId>
    <fieldValue>home.asp</fieldValue>
    <fieldValue>_self</fieldValue>
    <fieldValue>Home</fieldValue>
    </searchRow>
    </searchResults>
    <searchCriteria>
    <parameterValue>a</parameterValue>
    <orConditions>0</orConditions>
    </searchCriteria>
    </searchData>
    </data>
    </commandResult>

    As you can see its not too friendly but there is a node called
    /commandResult/data/searchData/searchMeta/searchFields/searchFieldMeta
    that contains the field names and another under
    /commandResult/data/searchData/searchResults/searchRow that contains
    the values for the fields.

    How can I construct an XSL document that will create a HTML table for
    each of the field name nodes and give me the data for <A> hyperlinks
    etc..

    I cant seem to work out how to link the parent to child nodes (if
    that's the right terminology)

    Please can someone help me.

    Thanks in advance
    Grant
    grant, Aug 5, 2004
    #1
    1. Advertising

  2. In article <>,
    grant <> wrote:

    [...]

    % As you can see its not too friendly but there is a node called
    % /commandResult/data/searchData/searchMeta/searchFields/searchFieldMeta
    % that contains the field names and another under
    % /commandResult/data/searchData/searchResults/searchRow that contains
    % the values for the fields.
    %
    % How can I construct an XSL document that will create a HTML table for
    % each of the field name nodes and give me the data for <A> hyperlinks
    % etc..

    It might be nice to have an example of the output, but here's an
    example which does something which is probably not what you want:

    <xsl:stylesheet xmlns:xsl = 'http://www.w3.org/1999/XSL/Transform'
    version = '1.0'>
    <xsl:eek:utput method='html'/>

    <!-- the point of the first two templates is to constrain the
    default xslt behaviour. Rather than trying to match all
    nodes against templates and print all text nodes, we want
    to match only the searchFields node and ignore the text fileds -->
    <xsl:template match='/'>
    <xsl:apply-templates select='//searchFields'/>
    </xsl:template>

    <xsl:template match='text()'/>

    <!-- when we find a searchFields, we print a table containing a column
    for each search column. You might have to sort on the ordinal
    element if the columns don't appear in the right order. -->

    <xsl:template match='searchFields'>
    <table><tr>
    <xsl:for-each select='searchFieldMeta'>
    <th><xsl:value-of select='fieldName'/></th>
    </xsl:for-each>
    </tr>
    <xsl:apply-templates select='//searchResults'/>
    </table>
    </xsl:template>


    <!-- in your application, you probably want to print only one
    column with the position() = 1 value as an href and the
    position() = 3 value as the printed value. You'd do that
    like this (untested):

    <xsl:for-each select='searchRow'>
    <tr>
    <td><a href='{fieldValue[1]}'>
    <xsl:value-of select='fieldValue[3]'/></a></td>
    </tr>
    </xsl:for-each>

    -->

    <xsl:template match='searchResults'>
    <xsl:for-each select='searchRow'>
    <tr>
    <xsl:for-each select='fieldValue'>
    <xsl:choose>
    <xsl:when test='position() = 1'>
    <td><a href='{.}'><xsl:value-of select='.'/></a></td>
    </xsl:when>
    <xsl:eek:therwise>
    <td><xsl:value-of select='.'/></td>
    </xsl:eek:therwise>
    </xsl:choose>
    </xsl:for-each>
    </tr>
    </xsl:for-each>
    </xsl:template>

    </xsl:stylesheet>
    --

    Patrick TJ McPhee
    East York Canada
    Patrick TJ McPhee, Aug 6, 2004
    #2
    1. Advertising

  3. grant

    grant lang Guest

    Hi,

    That has helped alot thanks.

    The section:

    [...]

    <!-- in your application, you probably want to print only one
    column with the position() = 1 value as an href and the
    position() = 3 value as the printed value. You'd do that
    like this (untested):

    <xsl:for-each select='searchRow'>
    <tr>
    <td><a href='{fieldValue[1]}'>
    <xsl:value-of select='fieldValue[3]'/></a></td>
    </tr>
    </xsl:for-each>

    -->
    [...]

    Doesnt seem to work or at least i dont have enough experience to
    troubleshoot it yet and make it work but the assumption here is correct.
    A single link containing the description (field3) with a href of
    (field1).

    Ultimately I'd like to use something like this menu system available
    here: http://www.obout.com/sm3/pro_outlook.aspx

    But at this stage using the ASP version so the code behind the page
    would look like:

    ****************************************

    <html>
    <head>
    <title>obout Slide Menu Pro - Outlook example (classic ASP)</title>
    <meta http-equiv="Content-type" content='text/html; charset="UTF-8"'
    />
    <link rel="stylesheet" href="/slidemenu/styles/xp_outlook.css"
    media="screen" />
    </head>

    <body>
    <%
    'create and set up menu
    dim osm
    set osm = Server.CreateObject("obout_SlideMenu3_Pro.Menu")
    osm.ID = "prooutlook"
    osm.ScriptPath = "/slidemenu/smscript"
    osm.CSSParent = "SMParent"
    osm.CSSParentOver = "SMParentOver"
    osm.CSSParentSelected = "SMParentSelected"
    osm.CSSChild = "SMChild"
    osm.CSSChildOver = "SMChildOver"
    osm.CSSChildSelected = "SMChildSelected"
    osm.CSSChildrenBox = "SMChildrenBox"
    osm.CSSMenu = "SMMenu"
    osm.KeepExpanded = false
    osm.Speed = 8
    'Initially select 'a_a'
    If(Request.QueryString("sm")="") Then
    osm.SelectedId = "a_a"
    Else
    osm.SelectedId = Request.QueryString("sm")
    End If

    'build menu
    osm.AddParent "a", "Services"
    osm.AddChild "a_a", "<BR><img src=""/slidemenu/images/computer.gif""
    class=""SMChildImage""><BR>Desktop support", "pro_outlook.asp"
    osm.AddChild "a_b", "<BR><img src=""/slidemenu/images/network.gif""
    class=""SMChildImage""><BR>Network services", "pro_outlook.asp"
    osm.AddChild "a_c", "<BR><img src=""/slidemenu/images/publishing.gif""
    class=""SMChildImage""><BR>Publishing services", "pro_outlook.asp"

    osm.AddParent "b", "Downloads"
    osm.AddChild "b_a", "<BR><img src=""/slidemenu/images/search.gif""
    class=""SMChildImage""><BR>Search", "pro_outlook.asp"
    osm.AddChild "b_b", "<BR><img src=""/slidemenu/images/drive.gif""
    class=""SMChildImage""><BR>Big list", "pro_outlook.asp"

    osm.AddParent "c", "Contact us"
    osm.AddChild "c_a", "<BR><img src=""/slidemenu/images/contact.gif""
    class=""SMChildImage""><BR>E-mail", "pro_outlook.asp"
    osm.AddChild "c_b", "<BR><img src=""/slidemenu/images/chat.gif""
    class=""SMChildImage""><BR>Talk to us live", "pro_outlook.asp"

    'styles switch for user browser
    Function styleSwitch (cssClassName)
    Dim br_type
    If (instr(Request.ServerVariables ("HTTP_USER_AGENT"), "IE")) Then
    br_type = "_ie"
    End If
    styleSwitch = cssClassName + br_type
    End Function

    'Slide Menu event handler
    Response.Write("You've selected: <b>" + osm.SelectedId + "</b><br />")
    'Display the SlideMenu
    Response.Write(osm.HTML)
    Set osm = Nothing
    %>
    </body>
    </html>

    *************************************************

    And the section containing the osm.AddParent and osm.AddChild would be
    dynamically created using the XML in the previous post etc.

    On the obout site there is also an XML version too but the XML result
    from our application is not flexiable so I would prefer to create
    something as above.

    So I guess I have two questions, the first being can we make the section
    of code work that I cant seem to make work and the second question would
    be is it possible using the XML example posted previously to create a
    XSL to produce the resulting ASP page above?

    Other than that, using the XML does anyone have any suggestions on a
    menu system that would look nice like the obout menu system?

    Thanks heaps for your time!
    Grant

    *** Sent via Developersdex http://www.developersdex.com ***
    Don't just participate in USENET...get rewarded for it!
    grant lang, Aug 6, 2004
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. niels
    Replies:
    3
    Views:
    363
    Alexander Schatten
    Oct 1, 2003
  2. jkflens
    Replies:
    2
    Views:
    1,459
    jkflens
    May 30, 2006
  3. MKline
    Replies:
    1
    Views:
    455
    Andy Dingley
    Dec 13, 2006
  4. Jerry C.
    Replies:
    8
    Views:
    227
    Uri Guttman
    Nov 23, 2003
  5. Erik Wasser
    Replies:
    5
    Views:
    445
    Peter J. Holzer
    Mar 5, 2006
Loading...

Share This Page