Solved

XSL, XML display problem

Posted on 2003-11-09
16
479 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
  • 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
 

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
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 
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

Threat Intelligence Starter Resources

Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

Join & Write a Comment

Suggested Solutions

The Client Need Led Us to RSS I recently had an investment company ask me how they might notify their constituents about their newsworthy publications.  Probably you would think "Facebook" or "Twitter" but this is an interesting client.  Their cons…
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.
It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.
Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…

708 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

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now