Solved

XSL, XML display problem

Posted on 2003-11-09
16
522 Views
Last Modified: 2008-02-01
Hello,

I would like to display the values from these two xsl templates on one line centred. I have pasted also the css code for this template. At the moment the level value is centred, but the data value is on a seperate line. I have also tried nowrap which made no difference. I can post the full code if you wish.

Thanks

<xsl:template match="LEVEL">
<div class= "level"><xsl:value-of select="."/> LEVEL MODULE <xsl:apply-templates select="DATE"/></div>
</xsl:template>


<xsl:template match="DATE">
<xsl:value-of select="."/>
</xsl:template>

.level
{
text-align: center;
font-family: Arial;
font-size: 12pt;
font-weight: bold;
margin-bottom: 0.3cm;
}
0
Comment
Question by:AntoniRyszard656
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 7
16 Comments
 
LVL 6

Accepted Solution

by:
metalmickey earned 70 total points
ID: 9713433
For this XML

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="table.xsl"?>
<root>
    <LEVEL>1</LEVEL>
    <DATE>11/11/2003</DATE>
</root>


this template seems to work for me.

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
  <xsl:template match="/">
    <html>
      <title/>
      <head>
      <style type="text/css">
      .level
{
text-align: center;
font-family: Arial;
font-size: 12pt;
font-weight: bold;
margin-bottom: 0.3cm;
}
      </style>
      </head>
      <body>
<div class= "level">
          <xsl:apply-templates/>
</div>

</body>
</html>
  </xsl:template>
 
<xsl:template match="LEVEL">
<xsl:value-of select="."/> LEVEL MODULE
</xsl:template>

<xsl:template match="DATE">
<xsl:value-of select="."/>
</xsl:template>
</xsl:stylesheet>

Depending on what order the nodes are in  DATE then LEVEL rather than LEVEL than DATE

you could use

 <xsl:value-of select="following-sibling::DATE"/>

or

<xsl:value-of select="preceding-sibling::DATE"/>

depending on where it is in the doc. Then you wouldnt need a template that matched the DATE node


MM



0
 

Author Comment

by:AntoniRyszard656
ID: 9714768
Thank you for replying.

I tried the <xsl:value-of select="following-sibling::DATE"/> line, and this displays the level and date values on the same line, though a second date is now displayed on a seperate line, even when I removed the date template. Also to note the css code has its own file. The level, Date, XML tags are all part of a larger tag named info, below is the xsl template. I have used the apply-templates , and I think this is the reason why the second date is displayed. I needed use the apply-template function, because the tags within the xml INFO are not always the same.

<xsl:template match="INFO">
<div class= "coursecode"><xsl:value-of select="COURSE/@code"/></div>
<div class="coverpage"><xsl:apply-templates/></div>
</xsl:template>

Any further advice would be appreciated.

I have a further question, the xsl templates below display a roman numerial and then the subquestion. I have been trying to display the subquestions on the same line as the roman numerial. But with a gap between for example: To date I can only archieve the subquestion of the line under the roman numerial.

i)          Subquestion goes here      
                                                                              [10]                              

<xsl:template match="SUBQUESTION">
<xsl:number format="i) "/>
<div class="subquestion"><xsl:apply-templates /></div>
<xsl:if test="@marks&gt;0">
<div class="marks">[Marks <xsl:value-of select="@marks"/>]</div>
</xsl:if>
</xsl:template>

Here is the XML format

<QUESTION>

       <SUBQUESTION marks="5">
       </SUBQUESTION>
       <SUBQUESTION marks="5">
       </SUBQUESTION>
       <SUBQUESTION marks="5">
       </SUBQUESTION>
       <SUBQUESTION marks="5">
       </SUBQUESTION>
</QUESTION>

And CSS

.subquestion
{
vertical-align:top;
font-family: Arial;
font-size: 12pt;
margin-left: 1.5cm;
}

.marks
{
margin-left: 16.5cm;
font-family: Arial;
font-size: 12pt;
margin-bottom: 0.3cm;
}
0
 
LVL 6

Expert Comment

by:metalmickey
ID: 9715399
You'll have to be careful using the generic apply-templates and specifically  using a apply templates select=""

I presume that since you ve got DATE showing twice, as your 2 templates are calling two instances of DATE

rather than using the apply tempates in here....

<xsl:template match="INFO">
<div class= "coursecode"><xsl:value-of select="COURSE/@code"/></div>
<div class="coverpage"><xsl:template match="INFO">
<div class= "coursecode"><xsl:value-of select="COURSE/@code"/></div>
<div class="coverpage"><xsl:apply-templates/></div>
</xsl:template></div>
</xsl:template>

could you specifically call the ones you need instead?


If you need to apply a template independantly of heirarchy/document order you could try using moded templates.

you could build a template

<xsl:template match="INFO">
<div class= "coursecode"><xsl:value-of select="COURSE/@code"/></div>
<div class="coverpage"><xsl:template match="INFO">
<div class= "coursecode"><xsl:value-of select="COURSE/@code"/></div>
<div class="coverpage">

     <xsl:apply-templates mode="anton"/>

</div>
</xsl:template></div>
</xsl:template>

which would only apply templates in a certain mode

<xsl:template match="DATE" mode="anton">
do your moded stuff
</xsl:template>

But as im not sure what you are going to to i cant be more specific.


Can you post your XML and XSLT





0
Quiz: What Do These Organizations Have In Common?

Hint: Their teams ended up taking quizzes, too.

 

Author Comment

by:AntoniRyszard656
ID: 9715664
Thank you for replying.

Could you explain how to e-mail the code, or should I just past all the xml, xsl, and css in the message?

thanks
0
 
LVL 6

Expert Comment

by:metalmickey
ID: 9715679
yep just post it on the board.

If anyone else would care to take a look, they'll be able to.

MM
0
 

Author Comment

by:AntoniRyszard656
ID: 9715716
Thank you for replying.

I will need to prepare the code: though

I have a further question, the xsl templates below display a roman numerial and then the subquestion. I have been trying to display the subquestions on the same line as the roman numerial. But with a gap between for example: To date I can only archieve the subquestion of the line under the roman numerial.

i)          Subquestion goes here      
                                                                              [10]                              

<xsl:template match="SUBQUESTION">
<xsl:number format="i) "/>
<div class="subquestion"><xsl:apply-templates /></div>
<xsl:if test="@marks&gt;0">
<div class="marks">[Marks <xsl:value-of select="@marks"/>]</div>
</xsl:if>
</xsl:template>

Here is the XML format

<QUESTION>

       <SUBQUESTION marks="5">
       </SUBQUESTION>
       <SUBQUESTION marks="5">
       </SUBQUESTION>
       <SUBQUESTION marks="5">
       </SUBQUESTION>
       <SUBQUESTION marks="5">
       </SUBQUESTION>
</QUESTION>

And CSS

.subquestion
{
vertical-align:top;
font-family: Arial;
font-size: 12pt;
margin-left: 1.5cm;
}

.marks
{
margin-left: 16.5cm;
font-family: Arial;
font-size: 12pt;
margin-bottom: 0.3cm;
}
0
 
LVL 6

Expert Comment

by:metalmickey
ID: 9716439
try this for your marks

Ive outlined the subquestions in black and the marks in red (you can remove these once you're done. Your problem was that your numbering is outside the subquestion div, and you've used 2 divs for styling wheras you should have used a span. Your two divs were outlining a large block area one after the other. You should have nested them instead

Divs area for block elements
Spans are for inline elements

This should work, although you werent far off.



<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
  <xsl:template match="QUESTION">
    <html>
      <title/>
      <head>
      <style type="text/css">
      .subquestion
{
vertical-align:top;
font-family: Arial;
font-size: 12pt;
margin-left: 1.5cm;
border:1px solid black;

}

.marks
{
margin-left: 16.5cm;
font-family: Arial;
font-size: 12pt;
margin-bottom: 0.3cm;
border:1px solid red;
}
      </style>
      </head>
      <body>
        <xsl:apply-templates/>
      </body>
    </html>
  </xsl:template>
 
  <xsl:template match="SUBQUESTION">  
    <div class="subquestion"><xsl:number format="i) "/><xsl:apply-templates/>
      <xsl:if test="@marks&gt;0">
        <span class="marks">[Marks <xsl:value-of select="@marks"/>]</span>
      </xsl:if>
    </div>
  </xsl:template>
 
  <xsl:template match="@marks"/>
</xsl:stylesheet>


MM
0
 

Author Comment

by:AntoniRyszard656
ID: 9721969
Thank you for replying.

I tried the last code you posted to change the subquestion layout. This works thank you, though I was hoping to achieve the layout as below. Could you suggest how I could achieve this, with the almost boxed subquestins part.

Thank you

Example

i)     Pass the values entered by the user to the appreciate funtions
       and display the calculated value on the screen.

                                                                                             [5]
ii)    Next question

0
 
LVL 6

Expert Comment

by:metalmickey
ID: 9722085
You could change the number format to an  ordered list <ol type="i"> around the apply templates and build a <li> in every Subquestion.

Think about your html formatting first, build the page, they try to apply it to the xslt.

Assuming your xml looks somthing like the below

XML

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="t1.xsl"?>
<root>
<QUESTION>
Pass the values entered by the user to the appreciate funtions  and display the calculated value on the screen.
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
</QUESTION>
<QUESTION>
What number bus did i lose my moby on last night?
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
</QUESTION>
<QUESTION>
Inst the experts-exchange great? how do they do it?
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
  <SUBQUESTION marks="5"/>
</QUESTION>
</root>


your xslt would look like this

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:fo="http://www.w3.org/1999/XSL/Format">
  <xsl:template match="/">
    <html>
      <title/>
      <head>

      <style type="text/css">
      .subquestion
{
vertical-align:top;
font-family: Arial;
font-size: 12pt;
margin-left: 1.5cm;
border:1px solid black;

}

.marks
{
margin-left: 16.5cm;
font-family: Arial;
font-size: 12pt;
margin-bottom: 0.3cm;
border:1px solid red;
}
      </style>

      </head>
      <body>
<ol type="1">
        <xsl:apply-templates/>
</ol>
      </body>
    </html>
  </xsl:template>
 
  <xsl:template match="QUESTION">
  <li class="subquestion"><xsl:apply-templates/></li>
  </xsl:template>
 
<xsl:template match="SUBQUESTION">  
    <xsl:apply-templates/>  
      <xsl:if test="@marks&gt;0">
<br clear="all"/>
        <span style="float:right">[Marks <xsl:value-of select="@marks"/>]</span>
      </xsl:if>
 
  </xsl:template>
 
  <xsl:template match="@marks"/>
</xsl:stylesheet>


and your output would look like this

<html xmlns:fo="http://www.w3.org/1999/XSL/Format">
<title></title>
<head>
<META http-equiv="Content-Type" content="text/html; charset=UTF-16">
<style type="text/css">
      .subquestion
{
vertical-align:top;
font-family: Arial;
font-size: 12pt;
margin-left: 1.5cm;
border:1px solid black;

}

.marks
{
margin-left: 16.5cm;
font-family: Arial;
font-size: 12pt;
margin-bottom: 0.3cm;
border:1px solid red;
}
      </style>
</head>
<body>
<ol type="1">
<li class="subquestion">
Pass the values entered by the user to the appreciate funtions  and display the calculated value on the screen.
  <br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span></li>
<li class="subquestion">
What number bus did i lose my moby on last night?
  <br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span></li>
<li class="subquestion">
Inst the experts-exchange great? how do they do it?
  <br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span><br clear="all"><span style="float:right">[Marks 5]</span></li>
</ol>
</body>
</html>

IF YOUR XML IS NOT THE SAME AS THE ONE IVE SUGGESTED POST YOURS ON THIS Q AREA AND I'LL HAVE A CLOSER LOOK.


MM
0
 

Author Comment

by:AntoniRyszard656
ID: 9787309
Thank you for your guidance.

I would like to ask finally, would it be possible to use a xml table to name the webpages available on a site as below, and when allow the user to click the names, and the page is loaded. I have copied my xml, xsl code here for using tables.

(XML)

<TABLE>
<ROW><CELL>Home page</CELL></ROW>
<ROW><CELL>Page 1 name</CELL></ROW>
<ROW><CELL>Page 2 name</CELL></ROW>
<ROW><CELL>Page 3 name</CELL></ROW>
<ROW><CELL>Page 4 name</CELL></ROW>
<ROW><CELL>Page 5 name</CELL></ROW>
</TABLE>

(XSL)

<xsl:template match="TABLE">
<div class="table">
<table border="3">
<xsl:apply-templates select="ROW"/>
</table>
</div>
</xsl:template>


<xsl:template match="ROW">
<tr>
<xsl:apply-templates select="CELL"/>
</tr>
</xsl:template>


<xsl:template match="CELL">
<td>
<xsl:value-of select="."/>
</td>
</xsl:template>
0
 
LVL 6

Expert Comment

by:metalmickey
ID: 9796093
This will build links out of your table cells athough you'll need to get the URLS from somewhere.

<xsl:template match="CELL">
<td>
<a>
<xsl:attrubite name="href">PAGE URL GOES HERE</xsl:attribute>
<xsl:value-of select="."/>
</a>
</td>
</xsl:template>

MM
0
 

Author Comment

by:AntoniRyszard656
ID: 9800021
Thank you for replying.

The xml code here displays a table on the top left side of the screen, and the INFO tag under the table. Would it be possible to display the data and graphics from the INFO tag next to the table?

Many thanks

(XML)

<PAGES>

<TITLE>
    <TABLE>
    <ROW><CELL>Home Page</CELL></ROW>
    <ROW><CELL>Link 2</CELL></ROW>
    <ROW><CELL>Link 3</CELL></ROW>
    <ROW><CELL>Link 4</CELL></ROW>
    <ROW><CELL>Link 5</CELL></ROW>
    <ROW><CELL>Link 6</CELL></ROW>
    </TABLE>

    <INFO>
           Many tags including text and graphics
    </INFO>

</TITLE>

</PAGES>

(XSL)

<xsl:template match="TITLE">
<xsl:apply-templates select="TABLE"/>
<xsl:apply-templates select="INFO"/>
</xsl:template>


<xsl:template match="TABLE">
<div class="table">
<table border="3">
<xsl:apply-templates select="ROW"/>
</table>
</div>
</xsl:template>


<xsl:template match="ROW">
<tr>
<xsl:apply-templates select="CELL"/>
</tr>
</xsl:template>


<xsl:template match="CELL">
<td>
<a>
<xsl:attribute name="href">PAGE URL GOES HERE</xsl:attribute>
<xsl:value-of select="."/>
</a>
</td>
</xsl:template>
0
 
LVL 6

Expert Comment

by:metalmickey
ID: 9806155
I think that this is more of a HTML Q than  XML,

If you add float:left to the table style the text should sit next to the table. although it depends on your html construction. If there is a paragraph break before the INFO tag the text will always be below the table.

You should really lay out a html template before you start to code your xslt otherwise you'll find yourself fixing bot xslt and html rather than concetrating on the job in hand.

your xsl looks like its trying to build a table, but its within a div,

<xsl:template match="TABLE">
<div class="table">
<table border="3">
<xsl:apply-templates select="ROW"/>
</table>
</div>
</xsl:template>

why not just use

<table class="table">
 your div is probably preventing the INFO text from sitting next to the table.

Hope this helps and good luck with the rest of the template

MM


0
 

Author Comment

by:AntoniRyszard656
ID: 9810303
Thank you for replying.

I wondered if you could demonstrate your meaning of a html template? I removed the table div because this actually did not have any function. And pasted all the xml and xsl code. I wished the title tag containing a table to be displayed on the left hand side, and text tag to be displayed next to the table.

I would much appreciate your guidance.


<?xml version="1.0" encoding="UTF-8" ?>
<?xml-stylesheet href="transform.xsl" type="text/xsl"?>

<PAGES>
      <TITLE>
            <TABLE>
            <ROW><CELL>Home page</CELL></ROW>
            <ROW><CELL>Link 1</CELL></ROW>
            <ROW><CELL>Link 2</CELL></ROW>
            <ROW><CELL>Link 3</CELL></ROW>
            <ROW><CELL>Link 4</CELL></ROW>
            <ROW><CELL>Link 5</CELL></ROW>
            <ROW><CELL>Link 6</CELL></ROW>
            </TABLE>
      </TITLE>
      <TEXT>
            <DESCRIPTION>
            </DESCRIPTION>
      
              <DESCRIPTION>
              </DESCRIPTION>
            <EMAIL>

            </EMAIL>
            
      </TEXT>
</PAGES>


<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">

<xsl:template match="PAGES">
<html>
<head>
<title>SNJ Software</title>
<link rel="stylesheet" type="text/css" href="display.css"/>
</head>
<body>
<xsl:apply-templates/>
</body>
</html>
</xsl:template>


<xsl:template match="TITLE">
<xsl:apply-templates select="TABLE"/>
<xsl:apply-templates select="TEXT"/>
</xsl:template>


<xsl:template match="TEXT">
<xsl:apply-templates/>
</xsl:template>


<xsl:template match="DIAGRAM">
<xsl:if test="@align='center'">
<div class="diagram"><img src="{@url}"/></div>
</xsl:if>
</xsl:template>


<xsl:template match="TABLE">
<table border="3">
<xsl:apply-templates select="ROW"/>
</table>
</xsl:template>


<xsl:template match="ROW">
<tr>
<xsl:apply-templates select="CELL"/>
</tr>
</xsl:template>


<xsl:template match="CELL">
<td>
<a>
<xsl:attribute name="href">PAGE URL GOES HERE</xsl:attribute>
<xsl:value-of select="."/>
</a>
</td>
</xsl:template>

</xsl:stylesheet>
0
 
LVL 6

Expert Comment

by:metalmickey
ID: 9810336
HTML template means build a blank page with dummy stuff in it then populate it with the xml. Dot try and build the html and xml page all at once.

I think this Question has gone on long enough and i think ive answered the original Question posted amongst several others!

Now thats what i call value.

MM
0
 
LVL 6

Expert Comment

by:metalmickey
ID: 9810338
If you need html Help post a Q in the HTML area

http://oldlook-search.experts-exchange.com/Web/Web_Languages/HTML/
0

Featured Post

Major Incident Management Communications

Major incidents and IT service outages cost companies millions. Often the solution to minimizing damage is automated communication. Find out more in our Major Incident Management Communications infographic.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I was working on a PowerPoint add-in the other day and a client asked me "can you implement a feature which processes a chart when it's pasted into a slide from another deck?". It got me wondering how to hook into built-in ribbon events in Office.
Many times as a report developer I've been asked to display normalized data such as three rows with values Jack, Joe, and Bob as a single comma-separated string such as 'Jack, Joe, Bob', and vice versa.  Here's how to do it. 
Monitoring a network: how to monitor network services and why? Michael Kulchisky, MCSE, MCSA, MCP, VTSP, VSP, CCSP outlines the philosophy behind service monitoring and why a handshake validation is critical in network monitoring. Software utilized …
This is my first video review of Microsoft Bookings, I will be doing a part two with a bit more information, but wanted to get this out to you folks.

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question