Calling Javascript from XSL file - Stack Overflow

admin2025-04-19  0

I have a XML file........

<ROOT>
      <MYNODES>
           <MYNODE>A</MYNODE>
           <MYNODE>B</MYNODE>
           <MYNODE>C</MYNODE>
           <MYNODE>D</MYNODE>
      </MYNODES> 
      <DOCS>
           <DOC>1</DOC>
           <DOC>2</DOC>
           <DOC>3</DOC>
      </DOC> 
      <PICS>
           <PIC>a.jpeg</PIC>
           <PIC>b.jpeg</PIC>
           <PIC>c.jpeg</PIC>
           <PIC>d.jpeg</PIC>
           <PIC>e.jpeg</PIC>
          </PICS>
  </ROOT>

and following XSLT file.....

<?xml version="1.0"?>

<xsl:stylesheet xmlns:xhtml="" xmlns="" xmlns:xsl="" version="2.0">

<xsl:output method="xml" version="1.0" doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" doctype-system=".dtd"/>

<xsl:template match="/ROOT">
    <html lang="en" xmlns="">
        <head>
            <title>JINI  <xsl:value-of select="/ROOT/MYNODES/MYNODE/." /> </title>
        <link rel="stylesheet" type="text/css" href="jini.css" />
        <script language="JavaScript" src="monHead.js" type="text/javascript" />
        </head>
    <body>

<table style="font-size:11px" border="5" bgcolor="#FFFFFF" width="99%" align="center" cellpadding="5">
<tr>
<td>
<xsl:attribute  name="bgcolor"> #FFAAAA </xsl:attribute> <xsl:attribute  name="onMouseover" >displayColor(event, 'blue') </xsl:attribute> <xsl:attribute  name="onMouseout"> backToOriginal(event, 'yellow') </xsl:attribute> AA</td>
<td>BB </td>
</tr>
</table>
</body>
</html>
</xsl:stylesheet>

But my displayColor doesn't work in browser ... Any clue.... How to call external function of java script file in XSL file...

My Javascript file is

   /***********************************************
   * Highlight Table Cells Script- © Dynamic Drive DHTML code library (www.dynamicdrive)
   * Visit  for hundreds of DHTML scripts
   * This notice must stay intact for legal use
   ***********************************************/

   // Specify the default location for flying widget
   var xpos = -10;
   var ypos = 20;

   //Specify highlight behavior. "TD" to highlight table cells, "TR" to highlight the entire row:
   var highlightbehavior="TD"

   var ns6=document.getElementById&&!document.all
   var ie=document.all

   function displayColor(event, color){
     /* Popup is integrated within changeto */
     changeto(event, color,0,"");
   }

   function displayColorAndInfos(event, color, line){
     /* Popup is integrated within changeto */
     changeto(event, color,1,line);
   }

   function backToOriginal(event, color) {
     /* Killlink is integrated within changeback */
     changeback(event, color);
   }

   function changeto(e,highlightcolor,flag,line){
   source=ie? event.srcElement : e.target
   if (source.tagName=="TABLE")
   return
   while(source.tagName!=highlightbehavior && source.tagName!="HTML")
   source=ns6? source.parentNode : source.parentElement
   if (source.style.backgroundColor!=highlightcolor&&source.id!="ignore"){
      source.style.backgroundColor=highlightcolor
      if (flag==1) {
    poplink(line,-500,5);
    }
      }
   }

   function contains_ns6(master, slave) { //check if slave is contained by master
   while (slave.parentNode)
   if ((slave = slave.parentNode) == master)
   return true;
   return false;
   }

   function changeback(e,originalcolor){
   if (ie&&(event.fromElement.contains(event.toElement)||source.contains(event.toElement)||source.id=="ignore")||source.tagName=="TABLE")
   return
   else if (ns6&&(contains_ns6(source, e.relatedTarget)||source.id=="ignore"))
   return
   if (ie&&event.toElement!=source||ns6&&e.relatedTarget!=source) {
      source.style.backgroundColor=originalcolor
      killlink();
      }
   }

I have a XML file........

<ROOT>
      <MYNODES>
           <MYNODE>A</MYNODE>
           <MYNODE>B</MYNODE>
           <MYNODE>C</MYNODE>
           <MYNODE>D</MYNODE>
      </MYNODES> 
      <DOCS>
           <DOC>1</DOC>
           <DOC>2</DOC>
           <DOC>3</DOC>
      </DOC> 
      <PICS>
           <PIC>a.jpeg</PIC>
           <PIC>b.jpeg</PIC>
           <PIC>c.jpeg</PIC>
           <PIC>d.jpeg</PIC>
           <PIC>e.jpeg</PIC>
          </PICS>
  </ROOT>

and following XSLT file.....

<?xml version="1.0"?>

<xsl:stylesheet xmlns:xhtml="http://www.w3/1999/xhtml" xmlns="http://www.w3/1999/xhtml" xmlns:xsl="http://www.w3/1999/XSL/Transform" version="2.0">

<xsl:output method="xml" version="1.0" doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" doctype-system="http://www.w3/TR/xhtml1/DTD/xhtml1-strict.dtd"/>

<xsl:template match="/ROOT">
    <html lang="en" xmlns="http://www.w3/1999/xhtml">
        <head>
            <title>JINI  <xsl:value-of select="/ROOT/MYNODES/MYNODE/." /> </title>
        <link rel="stylesheet" type="text/css" href="jini.css" />
        <script language="JavaScript" src="monHead.js" type="text/javascript" />
        </head>
    <body>

<table style="font-size:11px" border="5" bgcolor="#FFFFFF" width="99%" align="center" cellpadding="5">
<tr>
<td>
<xsl:attribute  name="bgcolor"> #FFAAAA </xsl:attribute> <xsl:attribute  name="onMouseover" >displayColor(event, 'blue') </xsl:attribute> <xsl:attribute  name="onMouseout"> backToOriginal(event, 'yellow') </xsl:attribute> AA</td>
<td>BB </td>
</tr>
</table>
</body>
</html>
</xsl:stylesheet>

But my displayColor doesn't work in browser ... Any clue.... How to call external function of java script file in XSL file...

My Javascript file is

   /***********************************************
   * Highlight Table Cells Script- © Dynamic Drive DHTML code library (www.dynamicdrive.)
   * Visit http://www.dynamicDrive. for hundreds of DHTML scripts
   * This notice must stay intact for legal use
   ***********************************************/

   // Specify the default location for flying widget
   var xpos = -10;
   var ypos = 20;

   //Specify highlight behavior. "TD" to highlight table cells, "TR" to highlight the entire row:
   var highlightbehavior="TD"

   var ns6=document.getElementById&&!document.all
   var ie=document.all

   function displayColor(event, color){
     /* Popup is integrated within changeto */
     changeto(event, color,0,"");
   }

   function displayColorAndInfos(event, color, line){
     /* Popup is integrated within changeto */
     changeto(event, color,1,line);
   }

   function backToOriginal(event, color) {
     /* Killlink is integrated within changeback */
     changeback(event, color);
   }

   function changeto(e,highlightcolor,flag,line){
   source=ie? event.srcElement : e.target
   if (source.tagName=="TABLE")
   return
   while(source.tagName!=highlightbehavior && source.tagName!="HTML")
   source=ns6? source.parentNode : source.parentElement
   if (source.style.backgroundColor!=highlightcolor&&source.id!="ignore"){
      source.style.backgroundColor=highlightcolor
      if (flag==1) {
    poplink(line,-500,5);
    }
      }
   }

   function contains_ns6(master, slave) { //check if slave is contained by master
   while (slave.parentNode)
   if ((slave = slave.parentNode) == master)
   return true;
   return false;
   }

   function changeback(e,originalcolor){
   if (ie&&(event.fromElement.contains(event.toElement)||source.contains(event.toElement)||source.id=="ignore")||source.tagName=="TABLE")
   return
   else if (ns6&&(contains_ns6(source, e.relatedTarget)||source.id=="ignore"))
   return
   if (ie&&event.toElement!=source||ns6&&e.relatedTarget!=source) {
      source.style.backgroundColor=originalcolor
      killlink();
      }
   }
Share Improve this question edited Apr 27, 2009 at 16:26 Dimitre Novatchev 244k27 gold badges303 silver badges437 bronze badges asked Apr 27, 2009 at 10:32 OongOong 2
  • Pasting the code of the JS file here is no use because that is not relevant to the problem. A better way to find out the root problem would be to use the rendered HTML document and analyze it. If it is fine, then try to debug the Javascript using that document. – Cerebrus Commented Apr 27, 2009 at 11:35
  • @Cerebrus: The JS is relevant. A failing execution of the script simply might be an error in the embedded script. However, this didn't seem to be the problem (see my answer below). – Dirk Vollmar Commented Apr 27, 2009 at 14:26
Add a ment  | 

3 Answers 3

Reset to default 3

You haven't closed the <script> tag - you need:

<script src="monHead.js" type="text/javascript"></script>

There have been a few inconsistencies with the XML and XSLT you posted.

Try the following (please note the blank inserted inside the script tag to avoid that the node is collapsed by the XSLT engine):

XSLT:

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

  <xsl:output method="html" version="1.0" doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN" doctype-system="http://www.w3/TR/xhtml1/DTD/xhtml1-strict.dtd"/>

  <xsl:template match="/ROOT">
    
    <html lang="en" xmlns="http://www.w3/1999/xhtml">
      <head>
        <title>
          JINI <xsl:value-of select="/ROOT/MYNODES/MYNODE/." />
        </title>
        <link rel="stylesheet" type="text/css" href="jini.css" />
        <script src="monHead.js" type="text/javascript" >
            <xsl:text> </xsl:text>
        </script>
      </head>
      <body>
        <table style="font-size:11px" border="5" bgcolor="#FFFFFF" width="99%" align="center" cellpadding="5">
          <tr>
            <td bgcolor="#FFAAAA" onMouseover="displayColor(event, 'blue');" onMouseout="backToOriginal(event, 'yellow');">
              AA
            </td>
            <td>BB </td>
          </tr>
        </table>
      </body>
    </html>
  </xsl:template>
</xsl:stylesheet>

XML input document:

<?xml version="1.0" encoding="utf-8"?>
<ROOT>
  <MYNODES>
    <MYNODE>A</MYNODE>
    <MYNODE>B</MYNODE>
    <MYNODE>C</MYNODE>
    <MYNODE>D</MYNODE>
  </MYNODES>
  <DOCS>
    <DOC>1</DOC>
    <DOC>2</DOC>
    <DOC>3</DOC>
  </DOCS>
  <PICS>
    <PIC>a.jpeg</PIC>
    <PIC>b.jpeg</PIC>
    <PIC>c.jpeg</PIC>
    <PIC>d.jpeg</PIC>
    <PIC>e.jpeg</PIC>
  </PICS>
</ROOT>

Since you did not provide your JavaScript code it is however not possible to see whether there is a problem within your script. Otherwise everything should work fine with the above input / XSLT.

You also haven't closed the <ROOT> tag in your XML file:

<ROOT>
  <MYNODES>
       <MYNODE>A</MYNODE>
       <MYNODE>B</MYNODE>
       <MYNODE>C</MYNODE>
       <MYNODE>D</MYNODE>
  </MYNODES> 
  <DOCS>
       <DOC>1</DOC>
       <DOC>2</DOC>
       <DOC>3</DOC>
  </DOC> 
  <PICS>
       <PIC>a.jpeg</PIC>
       <PIC>b.jpeg</PIC>
       <PIC>c.jpeg</PIC>
       <PIC>d.jpeg</PIC>
       <PIC>e.jpeg</PIC>
  </PICS>
</ROOT>
转载请注明原文地址:http://conceptsofalgorithm.com/Algorithm/1745022009a280436.html

最新回复(0)