Help to incorporate an html code in xslt

joefawcett · January 7th, 2008, 11:42 AM

You seem to be doing something drastically wrong. Can you (a) state what exactly you are doing and (b) provide example files so that I can try to reproduce your problem. I suspect that you are somewhat confused about when and where script is executed etc.

--

Joe (Microsoft MVP - XML)

ismailc · January 8th, 2008, 04:40 AM

Hi, My apolgies Joe & Michael: I did not ignore the advice & I am really gratefull for the help & desperate to get this working.

I added the CDATA but it then did not seem to find the function as it was greyed out! (as said it was more colorfull) but no erros at all but just did not work or find the function onmouseover.
In my previous post where i did not add the cdata was only to reply to the reply of Bones to indicate that i also only used the script but it complains about several lines.
So my aplogies Please Assist.

[u]Joe: This how it started: </u>
The existing xslt have an image ALT used as an tooltip, the problem is that the users have lengthy tooltips & the alt dissapears after a few seconds which they don't want.
I found a workaround for a tooltip which works great in HTML now I'm trying to add the code to the xslt but having the problems of the script. Tried CDate but the code turns gray untill the end of the script but other scripts in the xslt is black.

Your can copy this cope directly in HTML and it works, I'm trying to add this anyware in xslt to just to get it going then i will remove the alt & add onmouseover image like the <a>: I tried to highlight th errors i get (red) as i see in my xslt file but in HTML it works fine, with the CDATA its totally gray.

  <html>
    <head>
      <style type="text/css">

        #dhtmltooltip{
        position: absolute;
        width: 150px;
        border: 2px solid black;
        padding: 2px;
        background-color: lightyellow;
        visibility: hidden;
        z-index: 100;
        /*Remove below line to remove shadow. Below line should always appear last within this CSS*/
        filter: progid:DXImageTransform.Microsoft.Shadow(color=gra y,direction=135);
        }

      </style>
    </head>
    <body>
      <div id="dhtmltooltip"></div>
      <SCRIPT TYPE='text/javascript'>

        var offsetxpoint=-60 //Customize x offset of tooltip
        var offsetypoint=20 //Customize y offset of tooltip
        var ie=document.all
        var ns6=document.getElementById && !document.all
        var enabletip=false
        if (ie||ns6)
        var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

        function ietruebody(){
        return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
        }

        function ddrivetip(thetext, thecolor, thewidth){
        if (ns6||ie){
        if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
        if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
        tipobj.innerHTML=thetext
        enabletip=true
        return false
        }
        }

        function positiontip(e){
        if (enabletip){
        var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
        var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
       //Find out how close the mouse is to the corner of the window
       var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
       var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20

       var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000

       //if the horizontal distance isn't enough to accomodate the width of the context menu
      if (rightedge<tipobj.offsetWidth)
      //move the horizontal position of the menu to the left by it's width
      tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
      else if (curX<leftedge)
      tipobj.style.left="5px"
      else
      //position the horizontal position of the menu where the mouse is positioned
      tipobj.style.left=curX+offsetxpoint+"px"

      //same concept with the vertical position
      if (bottomedge<tipobj.offsetHeight)
      tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
      else
      tipobj.style.top=curY+offsetypoint+"px"
      tipobj.style.visibility="visible"
      }
      }

      function hideddrivetip(){
      if (ns6||ie){
      enabletip=false
      tipobj.style.visibility="hidden"
      tipobj.style.left="-1000px"
      tipobj.style.backgroundColor=''
      tipobj.style.width=''
      }
      }

      document.onmousemove=positiontip

       </SCRIPT>
      <tr>
        <td>
          <a href="ajax.htm" onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300);" onMouseout="hideddrivetip();">?</a>
        </td>
      </tr>
    </body>
</html>

ismailc · January 9th, 2008, 03:24 AM

Please Any Help, i need to get this working!

I tried replacing the && but still no luck!

joefawcett · January 9th, 2008, 08:48 AM

You still refuse to do what you were asked. Show a basic example with XML, XSLT and desired output. Then describe how you run the transform and view the output. What you're trying to do has been done thousands of times, there's some step in the process that you're not following but we can't see what it is until we know exactly what you are doing.

--

Joe (Microsoft MVP - XML)

ismailc · January 9th, 2008, 10:19 AM

Hi, I'm not really following ! I have an existing xslt file that i did not create so i'm clueless in that regard. Flowcentric uses the xslt file to load it's objects (stylesheet) which is viewed by IE, so what i want to do is add the code to the xslt & remove the alt of tooltip to onmouseover

Here is the entire file code, at the bottom being the HTML (blue) i want to add: I'm trying to just get the onmouseover function to work first before i replace the tooltip alt

Hope this is okay!

<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0" xmlns:asp="remove" xmlns:igchart="remove" xmlns:igsch="remove">
<xsl:output omit-xml-declaration = "yes" />
<xsl:template match="/">
<table width="100%" class="tbDetail">

    <tr>
        <td>
            <SCRIPT TYPE='text/javascript'>
                function hideHist()
                {
                    if (typeof fcHist != 'undefined')
                    {
                        fcHist.style.display = 'none';
                    }
                }
            </SCRIPT>
        </td>
    </tr>
    <xsl:variable name="cHist" select="count(Activity/myTracking/Activity[ DateResolved != '0' ])" />
    <xsl:if test="$cHist > '0'">
        <tr width="100%">
            <td colspan="6" class="row1">
                <SCRIPT TYPE='text/javascript'>
                    function toggleHist(srcElement, srcArrow) {
                        if (srcElement.style.display == 'none')
                        {
                            srcElement.style.display = '';
                            srcArrow.src = 'images/expand.gif';
                        } else
                        {
                            srcElement.style.display = 'none';
                            srcArrow.src = 'images/collapse.gif';
                        }
                    }
                </SCRIPT>
                <span id='fcHistMain' style='cursor:hand;' onclick='toggleHist(fcHist, fcExpand)'>
                    <span style="vertical-align:middle;">
                        <img src='images/collapse.gif' id='fcExpand' align="middle" />#160;Expand to view the History
                    </span>
                </span>
            </td>
        </tr>
        <tr>
            <td colspan="6">
                <div id='fcHist'>
                    <table width='100%' class='tbList'>
                    <xsl:for-each select="Activity/myTracking/Activity[ DateResolved != '0' ]">
                        <xsl:sort select='@id' />
                        <tr>
                            <td width='5%'><xsl:attribute name='class'><xsl:if test="position() mod 2 = 1">on</xsl:if><xsl:if test="position() mod 2 != 1">off</xsl:if></xsl:attribute><xsl:value-of select="position()" />.#160;</td>
                            <td width='55%'><xsl:attribute name='class'><xsl:if test="position() mod 2 = 1">on</xsl:if><xsl:if test="position() mod 2 != 1">off</xsl:if></xsl:attribute>
                                <xsl:if test="TrackValues = 'False'">
                                    <xsl:value-of select="Description" />
                                </xsl:if>
                                <xsl:if test="TrackValues = 'True' or TrackValues = ''">
                                    <a>
                                        <xsl:attribute name='href'>myTrackingPage.aspx?type=a&id=<xsl :value-of select="@id" /></xsl:attribute>
                                        <xsl:attribute name='class'>bn</xsl:attribute>
                                        <xsl:value-of select="Description" />
                                    </a>
                                </xsl:if>
                            </td>
                            <td width='20%'><xsl:attribute name='class'><xsl:if test="position() mod 2 = 1">on</xsl:if><xsl:if test="position() mod 2 != 1">off</xsl:if></xsl:attribute>
                                <xsl:if test="CreatorEMail[. = '']"><xsl:value-of select="Creator" /></xsl:if>
                                <xsl:if test="CreatorEMail[. != '']">
                                <a>
                                    <xsl:attribute name='class'>bn</xsl:attribute>
                                    <xsl:attribute name='href'>mailto:<xsl:value-of select="CreatorEMail" />?Subject=<xsl:value-of select="Description" /></xsl:attribute>
                                    <xsl:value-of select="Creator" />
                                </a>
                                </xsl:if>
                            </td>
                            <td width='20%'>
                                <xsl:attribute name='class'><xsl:if test="position() mod 2 = 1">on</xsl:if><xsl:if test="position() mod 2 != 1">off</xsl:if></xsl:attribute>
                                <xsl:value-of select="substring(DateResolved,1,4)"/>/<xsl:value-of select="substring(DateResolved,5,2)"/>/<xsl:value-of select="substring(DateResolved,7,2)" />#160;
                                <xsl:value-of select="substring(TimeResolved,1,2)" />:<xsl:value-of select="substring(TimeResolved,3,2)" />:<xsl:value-of select="substring(TimeResolved,5,2)" />
                            </td>
                        </tr>
                    </xsl:for-each>
                    </table>
                </div>
            </td>
        </tr>
    </xsl:if>

    <xsl:for-each select="Activity/ObjectGroup[@type='default']/Object">
    <xsl:sort select="@index" data-type="number" />
    <xsl:variable name="index" select="@index" />
    <xsl:variable name="nextNode" select="../Object[ @index > $index ][1]" />
    <xsl:variable name="nextCol" select="$nextNode/@columnNo" />
    <xsl:variable name="vis" select="string(Attributes/Attribute[ @name='visible'])" />
    <xsl:variable name="visNextCol" select="string($nextNode/Attributes/Attribute[ @name='visible'])" />
    <xsl:if test="($vis != 'False') or ($nextCol = '2' and ($vis != 'False' or $visNextCol != 'False'))">
    <xsl:if test="(@columnNo != '2')">
    <tr class="rowDetail">

        <xsl:choose>
        <xsl:when test="(string(Attributes/Attribute[ @name='visible']) = '') or (Attributes/Attribute[ @name='visible'] != 'False')">

            <td width='15%' align='left' class='rowDet'>
                <xsl:value-of select="Description" disable-output-escaping="yes" />#160;
                <xsl:if test="Mask[. != '']">(<xsl:value-of select="Mask" />)#160;</xsl:if>

        <xsl:if test=" @required[. = 'true']"></xsl:if>#160;
            </td>
            <td valign="middle">
                <xsl:if test="($nextCol != '2') or (count(following-sibling::*) = 0) or ($nextCol = '2' and $visNextCol = 'False')">
                    <xsl:attribute name='colspan'>4</xsl:attribute>
                    <xsl:attribute name='width'>70%</xsl:attribute>
                </xsl:if>
                <xsl:call-template name="CreateObject">
                    <xsl:with-param name="Object" select="." />
                </xsl:call-template>
                <xsl:if test="Tooltip != ''">
                #160;
                <xsl:element name="asp:image">
                    <xsl:attribute name='id'>ttip_<xsl:value-of select='@name' /></xsl:attribute>
                    <xsl:attribute name='runat'>server</xsl:attribute>
                    <xsl:attribute name='imageurl'>images/tooltip.gif</xsl:attribute>
                    <xsl:attribute name='alt'><xsl:value-of select="Tooltip" /></xsl:attribute>
                </xsl:element>
                </xsl:if>
            </td>
            <td width='5%' align="right">
      
            </td>

        </xsl:when>
        <xsl:otherwise>
            <td width='15%' align='right' class='rowDet'>#160;</td>
            <td valign="middle">#160;</td>
            <td width='5%' align="right">#160;</td>
        </xsl:otherwise>
        </xsl:choose>

        <xsl:if test="($nextCol = '2') and $visNextCol != 'False'">

            <td width='15%' align='left' class='rowDet'>
                <xsl:value-of select="$nextNode/Description" disable-output-escaping="yes" />#160;
                <xsl:if test="$nextNode/Mask[. != '']">(<xsl:value-of select="$nextNode/Mask" />)#160;</xsl:if>

        <xsl:if test=" @required[. = 'true']"></xsl:if>#160;
            </td>
            <td width='30%' valign="middle">
                <xsl:call-template name="CreateObject">
                    <xsl:with-param name="Object" select="$nextNode" />
                </xsl:call-template>
                <xsl:if test="$nextNode/Tooltip != ''">
                #160;
                <xsl:element name="asp:image">
                    <xsl:attribute name='id'>ttip_<xsl:value-of select='$nextNode/@name' /></xsl:attribute>
                    <xsl:attribute name='runat'>server</xsl:attribute>
                    <xsl:attribute name='imageurl'>images/tooltip.gif</xsl:attribute>
                    <xsl:attribute name='alt'><xsl:value-of select="$nextNode/Tooltip" /></xsl:attribute>
                </xsl:element>
                </xsl:if>
            </td>
            <td width='5%' align="right">
            
            </td>
        </xsl:if>
    </tr>
    </xsl:if>
    </xsl:if>
    </xsl:for-each>

    <xsl:for-each select="Activity/ObjectGroup[@type='group'][ @visible='true' ]">
    <xsl:sort select="@name" />
    <xsl:variable name="tmpGroup" select="@id" />
    <tr>
        <td colspan='6' width='100%'>
            <table width='100%' cellpadding='0' cellspacing='0' style='border: 1 solid #000000'>
                <tr>
                    <td width='80%' class='rowDet'><b><xsl:value-of select="Description" /></b></td>
                    <td class='rowDet' align='right'>
                        <xsl:if test="count(Object[ @dynamic='true' ]) > 0">
                            <xsl:element name="asp:imageButton">
                                <xsl:attribute name='id'>reloadGroup_<xsl:value-of select='@id' /></xsl:attribute>
                                <xsl:attribute name='runat'>server</xsl:attribute>
                                <xsl:attribute name='imageurl'>images/reloadGroup.gif</xsl:attribute>
                                <xsl:attribute name='alt'>Reload <xsl:value-of select="Description" /></xsl:attribute>
                            </xsl:element>
                        </xsl:if>#160;
                        <xsl:if test="@allowadd[ .='true']">
                            <xsl:element name="asp:imageButton">
                                <xsl:attribute name='id'>lia_<xsl:value-of select='@id' /></xsl:attribute>
                                <xsl:attribute name='runat'>server</xsl:attribute>
                                <xsl:attribute name='src'>images/add.gif</xsl:attribute>
                                <xsl:attribute name='alt'>Add <xsl:value-of select="Description" /></xsl:attribute>
                            </xsl:element>
                        </xsl:if>#160;
                        <xsl:if test="@allowdelete[ .='true']">
                            <xsl:element name="asp:imageButton">
                                <xsl:attribute name='id'>lid_<xsl:value-of select='@id' /></xsl:attribute>
                                <xsl:attribute name='runat'>server</xsl:attribute>
                                <xsl:attribute name='src'>images/delete.gif</xsl:attribute>
                                <xsl:attribute name='alt'>Delete <xsl:value-of select="Description" /></xsl:attribute>
                            </xsl:element>
                        </xsl:if>
                    </td>
                </tr>

                <tr>
                    <td colspan='2' width='100%'>
                        <table cellspacing='1' cellpadding='3'>
                            <tr>
                                <xsl:if test="@count > 0">

                                    <td></td>
                                    <xsl:for-each select="Object">
                                    <xsl:sort select="@index" data-type="number" />
                                        <xsl:if test="(string(Attributes/Attribute[ @name='visible']) = '') or (Attributes/Attribute[ @name='visible'] != 'False')">
                                            <td class='rowdet'>
                                                <xsl:attribute name='align'>center</xsl:attribute>
                                                <b><xsl:value-of select="Description" disable-output-escaping="yes" /></b>
                                            </td>
                                        </xsl:if>
                                    </xsl:for-each>
                                    <td></td>
                                </xsl:if>
                                <xsl:if test="@count = 0">
                                    <td>( No items found )</td>
                                </xsl:if>
                            </tr>

                            <xsl:if test="@count > 0">

                                <xsl:variable name="obj" select="Object[ position()=1 ]/@name" />
                                <xsl:for-each select="Object[ @name=$obj ]/Value/@instance">
                                    <xsl:variable name="line" select="." />
                                    <tr>

                                        <xsl:choose>
                                                <xsl:when test="//ObjectGroup[@id=$tmpGroup][@allowadd='true']">
                                                    <td>
                                                        <xsl:element name="asp:CheckBox">
                                                            <xsl:attribute name='id'>__linecheck_<xsl:value-of select='$tmpGroup' />_<xsl:value-of select='$line' /></xsl:attribute>
                                                            <xsl:attribute name='runat'>server</xsl:attribute>
                                                        </xsl:element>
                                                    </td>
                                                </xsl:when>
                                                <xsl:otherwise>
                                                    <td></td>
                                                </xsl:otherwise>
                                        </xsl:choose>

                                        <xsl:for-each select="//ObjectGroup[@id=$tmpGroup]/Object">
                                        <xsl:sort select="@index" data-type="number" />
                                        <xsl:variable name="name" select="concat('li_',concat($tmpGroup,concat('_',c oncat($line,concat('_',@name)))))" />
                                        <xsl:choose>
                                        <xsl:when test="(string(Attributes/Attribute[ @name='visible']) = '') or (Attributes/Attribute[ @name='visible'] != 'False')">
                                        <td>
                                            <xsl:call-template name="CreateLineItemObject">
                                                <xsl:with-param name="Object" select="." />
                                                <xsl:with-param name="name" select="$name" />
                                                <xsl:with-param name="line" select="$line" />
                                                <xsl:with-param name="tmpGroup" select="$tmpGroup" />
                                            </xsl:call-template>
                                        </td>
                                        </xsl:when>
                                        <xsl:otherwise>
                                            <xsl:call-template name="ReferenceLabel">
                                                <xsl:with-param name="Name" select="$name" />
                                                <xsl:with-param name="Attributes" select="Attributes" />
                                                <xsl:with-param name="Value" select="Value[ @instance=$line ]" />
                                            </xsl:call-template>
                                        </xsl:otherwise>
                                        </xsl:choose>
                                        </xsl:for-each>
                                    </tr>
                                </xsl:for-each>
                            </xsl:if>
                        </table>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    </xsl:for-each>

    
    <tr>
        <td colspan="6">
            <xsl:for-each select="Activity/ObjectGroup[@type='default']/Object[ ./Attributes/Attribute[ @name='visible' ] = 'False' ]">
                <xsl:call-template name="ReferenceLabel">
                    <xsl:with-param name="Name" select="@name" />
                    <xsl:with-param name="Attributes" select="Attributes" />
                    <xsl:with-param name="Value" select="Value" />
                </xsl:call-template>
            </xsl:for-each>
        </td>
    </tr>

    <xsl:variable name="cTrigger" select="count(Activity/ObjectGroup[@type='trigger']/Object)" />

    <xsl:if test="$cTrigger='1'">
        <xsl:for-each select="Activity/ObjectGroup[@type='trigger']/Object">
        <tr>

            <td width='30%' align='right' class='rowTrg'>
                <xsl:value-of select="Description" disable-output-escaping="yes" />#160;
            </td>
            <td colspan="4">
                <xsl:element name="asp:CheckBox">
                    <xsl:attribute name='id'><xsl:value-of select='@name' /></xsl:attribute>
                    <xsl:attribute name='runat'>server</xsl:attribute>
                    <xsl:if test="Value[. = 'on']">
                        <xsl:attribute name='Checked'>True</xsl:attribute>
                    </xsl:if>
                </xsl:element>
            </td>
            <td>
            </td>
        </tr>
        </xsl:for-each>
    </xsl:if>

    <xsl:if test="$cTrigger > '1'">
        <xsl:for-each select="Activity/ObjectGroup[@type='trigger']/Object">
        <tr>

            <td width='30%' align='right' class='rowTrg'>
                <xsl:value-of select="Description" disable-output-escaping="yes" />#160;
            </td>
            <td colspan="4">
                <xsl:element name="asp:RadioButton">
                    <xsl:attribute name='id'><xsl:value-of select='@name' /></xsl:attribute>
                    <xsl:attribute name='runat'>server</xsl:attribute>
                    <xsl:attribute name='GroupName'>triggers</xsl:attribute>
                    <xsl:if test="Valu

joefawcett · January 12th, 2008, 08:00 AM

One of the problems is that the original XSLT only creates a table whereas the stuff you want added creates a whole new HTML document.
People on the list are obviously willing to help but few are prepared to read through dozens and dozens of lines of code. Is it not possible to show the base XML that you are trying to transform?

There is nothing wrong with the script being greyed out when the XSLT is viewed in IE, all you care about is what the HTML looks like at the end of the process.

I would think that the following code only needs to be added to the start of the template that matches /.

The CSS:

Code:

<style type="text/css">

        #dhtmltooltip{
        position: absolute;
        width: 150px;
        border: 2px solid black;
        padding: 2px;
        background-color: lightyellow;
        visibility: hidden;
        z-index: 100;
        /*Remove below line to remove shadow. Below line should always appear last within this CSS*/
        filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
        }

      </style>

The script in a CDATA section:

Code:

<SCRIPT TYPE='text/javascript'>
        //<![CDATA[ 
       var offsetxpoint=-60 //Customize x offset of tooltip
        var offsetypoint=20 //Customize y offset of tooltip
        var ie=document.all
        var ns6=document.getElementById &amp;&amp; !document.all
        var enabletip=false
        if (ie||ns6)
        var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

        function ietruebody(){
        return (document.compatMode &amp;&amp; document.compatMode!="BackCompat")? document.documentElement : document.body
      }

      function ddrivetip(thetext, thecolor, thewidth){
      if (ns6||ie){
      if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
      if (typeof thecolor!="undefined" &amp;&amp; thecolor!="") tipobj.style.backgroundColor=thecolor
        tipobj.innerHTML=thetext
        enabletip=true
        return false
        }
        }

        function positiontip(e){
        if (enabletip){
        var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
        var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
       //Find out how close the mouse is to the corner of the window
       var rightedge=ie&amp;&amp;!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
      var bottomedge=ie&amp;&amp;!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20

       var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000

       //if the horizontal distance isn't enough to accomodate the width of the context menu
      if (rightedge<tipobj.offsetWidth)
      //move the horizontal position of the menu to the left by it's width
      tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
      else if (curX<leftedge)
      tipobj.style.left="5px"
      else
      //position the horizontal position of the menu where the mouse is positioned
      tipobj.style.left=curX+offsetxpoint+"px"

      //same concept with the vertical position
      if (bottomedge<tipobj.offsetHeight)
      tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
      else
      tipobj.style.top=curY+offsetypoint+"px"
      tipobj.style.visibility="visible"
      }
      } 

      function hideddrivetip(){
      if (ns6||ie){
      enabletip=false
      tipobj.style.visibility="hidden"
      tipobj.style.left="-1000px"
      tipobj.style.backgroundColor=''
      tipobj.style.width=''
      }
      }

      document.onmousemove=positiontip
 //]]>
       </SCRIPT>

The div for the surrogate tooltip:

Code:

<div id="dhtmltooltip"></div>

You then need to use this code:

Code:

<a href="ajax.htm" onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300);" onMouseout="hideddrivetip();">?</a>

wherever in the XSLT the current code outputs the td which requires the new tooltip.

--

Joe (Microsoft MVP - XML)

ismailc · January 14th, 2008, 05:16 AM

Sorry for being such a pain & a nuisance!

Thank You for all Your help - Really appreciate it & very gratefull for your kindness & patience.

I don't know what to do - as it's taking so much time & my project is running way in the red!

I just dont get it going at all! - Thank You
I keep on getting the error - does not even display the page
This document already has a DocumentElement node.

<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0" xmlns:asp="remove" xmlns:igchart="remove" xmlns:igsch="remove">
<xsl:output omit-xml-declaration = "yes" />
<xsl:template match="/">
<style type="text/css">

    #dhtmltooltip{
    position: absolute;
    width: 150px;
    border: 2px solid black;
    padding: 2px;
    background-color: lightyellow;
    visibility: hidden;
    z-index: 100;
    /*Remove below line to remove shadow. Below line should always appear last within this CSS*/
    filter: progid:DXImageTransform.Microsoft.Shadow(color=gra y,direction=135);
    }

  </style>

  <SCRIPT TYPE='text/javascript'>
  <![CDATA[
       var offsetxpoint=-60 //Customize x offset of tooltip
        var offsetypoint=20 //Customize y offset of tooltip
        var ie=document.all
        var ns6=document.getElementById && !document.all
        var enabletip=false
        if (ie||ns6)
        var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

        function ietruebody(){
        return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
      }

      function ddrivetip(thetext, thecolor, thewidth){
      if (ns6||ie){
      if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
      if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
        tipobj.innerHTML=thetext
        enabletip=true
        return false
        }
        }

        function positiontip(e){
        if (enabletip){
        var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
        var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
       //Find out how close the mouse is to the corner of the window
       var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
      var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20

       var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000

       //if the horizontal distance isn't enough to accomodate the width of the context menu
      if (rightedge<tipobj.offsetWidth)
      //move the horizontal position of the menu to the left by it's width
      tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
      else if (curX<leftedge)
      tipobj.style.left="5px"
      else
      //position the horizontal position of the menu where the mouse is positioned
      tipobj.style.left=curX+offsetxpoint+"px"

      //same concept with the vertical position
      if (bottomedge<tipobj.offsetHeight)
      tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
      else
      tipobj.style.top=curY+offsetypoint+"px"
      tipobj.style.visibility="visible"
      }
      }

      function hideddrivetip(){
      if (ns6||ie){
      enabletip=false
      tipobj.style.visibility="hidden"
      tipobj.style.left="-1000px"
      tipobj.style.backgroundColor=''
      tipobj.style.width=''
      }
      }

      document.onmousemove=positiontip
   ]]>
  </SCRIPT>

  <table width="100%" class="tbDetail">

    <tr>
        <td>
            <SCRIPT TYPE='text/javascript'>
                function hideHist()
                {
                    if (typeof fcHist != 'undefined')
                    {
                        fcHist.style.display = 'none';
                    }
                }
            </SCRIPT>
     
        
        </td>
    </tr>
    <xsl:variable name="cHist" select="count(Activity/myTracking/Activity[ DateResolved != '0' ])" />
    <xsl:if test="$cHist > '0'">
        <tr width="100%">
            <td colspan="6" class="row1">
                <SCRIPT TYPE='text/javascript'>
                    function toggleHist(srcElement, srcArrow) {
                        if (srcElement.style.display == 'none')
                        {
                            srcElement.style.display = '';
                            srcArrow.src = 'images/expand.gif';
                        } else
                        {
                            srcElement.style.display = 'none';
                            srcArrow.src = 'images/collapse.gif';
                        }
                    }
                </SCRIPT>
                <span id='fcHistMain' style='cursor:hand;' onclick='toggleHist(fcHist, fcExpand)'>
                    <span style="vertical-align:middle;">
                        <img src='images/collapse.gif' id='fcExpand' align="middle" />#160;Expand to view the History
                    </span>
                </span>
            </td>
        </tr>
        <tr>
            <td colspan="6">
                <div id='fcHist'>
                    <table width='100%' class='tbList'>
                    <xsl:for-each select="Activity/myTracking/Activity[ DateResolved != '0' ]">
                        <xsl:sort select='@id' />
                        <tr>
                            <td width='5%'><xsl:attribute name='class'><xsl:if test="position() mod 2 = 1">on</xsl:if><xsl:if test="position() mod 2 != 1">off</xsl:if></xsl:attribute><xsl:value-of select="position()" />.#160;</td>
                            <td width='55%'><xsl:attribute name='class'><xsl:if test="position() mod 2 = 1">on</xsl:if><xsl:if test="position() mod 2 != 1">off</xsl:if></xsl:attribute>
                                <xsl:if test="TrackValues = 'False'">
                                    <xsl:value-of select="Description" />
                                </xsl:if>
                                <xsl:if test="TrackValues = 'True' or TrackValues = ''">
                                    <a>
                                        <xsl:attribute name='href'>myTrackingPage.aspx?type=a&id=<xsl :value-of select="@id" /></xsl:attribute>
                                        <xsl:attribute name='class'>bn</xsl:attribute>
                                        <xsl:value-of select="Description" />
                                    </a>
                                </xsl:if>
                            </td>
                            <td width='20%'><xsl:attribute name='class'><xsl:if test="position() mod 2 = 1">on</xsl:if><xsl:if test="position() mod 2 != 1">off</xsl:if></xsl:attribute>
                                <xsl:if test="CreatorEMail[. = '']"><xsl:value-of select="Creator" /></xsl:if>
                                <xsl:if test="CreatorEMail[. != '']">
                                <a>
                                    <xsl:attribute name='class'>bn</xsl:attribute>
                                    <xsl:attribute name='href'>mailto:<xsl:value-of select="CreatorEMail" />?Subject=<xsl:value-of select="Description" /></xsl:attribute>
                                    <xsl:value-of select="Creator" />
                                </a>
                                </xsl:if>
                            </td>
                            <td width='20%'>
                                <xsl:attribute name='class'><xsl:if test="position() mod 2 = 1">on</xsl:if><xsl:if test="position() mod 2 != 1">off</xsl:if></xsl:attribute>
                                <xsl:value-of select="substring(DateResolved,1,4)"/>/<xsl:value-of select="substring(DateResolved,5,2)"/>/<xsl:value-of select="substring(DateResolved,7,2)" />#160;
                                <xsl:value-of select="substring(TimeResolved,1,2)" />:<xsl:value-of select="substring(TimeResolved,3,2)" />:<xsl:value-of select="substring(TimeResolved,5,2)" />
                            </td>
                        </tr>
                    </xsl:for-each>
                    </table>
                </div>
            </td>
        </tr>
    </xsl:if>

    <xsl:for-each select="Activity/ObjectGroup[@type='default']/Object">
    <xsl:sort select="@index" data-type="number" />
    <xsl:variable name="index" select="@index" />
    <xsl:variable name="nextNode" select="../Object[ @index > $index ][1]" />
    <xsl:variable name="nextCol" select="$nextNode/@columnNo" />
    <xsl:variable name="vis" select="string(Attributes/Attribute[ @name='visible'])" />
    <xsl:variable name="visNextCol" select="string($nextNode/Attributes/Attribute[ @name='visible'])" />
    <xsl:if test="($vis != 'False') or ($nextCol = '2' and ($vis != 'False' or $visNextCol != 'False'))">
    <xsl:if test="(@columnNo != '2')">
    <tr class="rowDetail">

        <xsl:choose>
        <xsl:when test="(string(Attributes/Attribute[ @name='visible']) = '') or (Attributes/Attribute[ @name='visible'] != 'False')">

            <td width='15%' align='left' class='rowDet'>
                <xsl:value-of select="Description" disable-output-escaping="yes" />#160;
                <xsl:if test="Mask[. != '']">(<xsl:value-of select="Mask" />)#160;</xsl:if>

        <xsl:if test=" @required[. = 'true']"></xsl:if>#160;
            </td>
            <td valign="middle">
                <xsl:if test="($nextCol != '2') or (count(following-sibling::*) = 0) or ($nextCol = '2' and $visNextCol = 'False')">
                    <xsl:attribute name='colspan'>4</xsl:attribute>
                    <xsl:attribute name='width'>70%</xsl:attribute>
                </xsl:if>
                <xsl:call-template name="CreateObject">
                    <xsl:with-param name="Object" select="." />
                </xsl:call-template>
                <xsl:if test="Tooltip != ''">
                #160;
          

          <a>

            <xsl:attribute name='href'>ajax.htm?width=375</xsl:attribute>
            <xsl:attribute name='id'>one</xsl:attribute>
            <xsl:attribute name='style'>border : none;</xsl:attribute>
            <xsl:attribute name='class'>jTip</xsl:attribute>
            <xsl:attribute name='name'><xsl:value-of select="Tooltip" /></xsl:attribute>
            
           ??
          </a>
          
                </xsl:if>
            </td>
            <td width='5%' align="right">
      
            </td>

        </xsl:when>
        <xsl:otherwise>
            <td width='15%' align='right' class='rowDet'>#160;</td>
            <td valign="middle">#160;</td>
            <td width='5%' align="right">#160;</td>
        </xsl:otherwise>
        </xsl:choose>

        <xsl:if test="($nextCol = '2') and $visNextCol != 'False'">

            <td width='15%' align='left' class='rowDet'>
                <xsl:value-of select="$nextNode/Description" disable-output-escaping="yes" />#160;
                <xsl:if test="$nextNode/Mask[. != '']">(<xsl:value-of select="$nextNode/Mask" />)#160;</xsl:if>

        <xsl:if test=" @required[. = 'true']"></xsl:if>#160;
            </td>
            <td width='30%' valign="middle">
                <xsl:call-template name="CreateObject">
                    <xsl:with-param name="Object" select="$nextNode" />
                </xsl:call-template>
                <xsl:if test="$nextNode/Tooltip != ''">
                #160;
         <div id="dhtmltooltip">
          <xsl:element name="asp:image">
                    

            <xsl:attribute name='href'>ajax.htm</xsl:attribute>
            <xsl:attribute name='id'>ttip_<xsl:value-of select='$nextNode/@name' /></xsl:attribute>
            <xsl:attribute name='onMouseover'>ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300);</xsl:attribute>
            <xsl:attribute name='onMouseout'>hideddrivetip();</xsl:attribute>

                </xsl:element>
        </div>
                </xsl:if>
            </td>

mhkay · January 14th, 2008, 05:35 AM

At one time you were getting failures because you were not escaping the ampersands (&&) in the <SCRIPT> element. Now you seem to have swung the other way - you are double-escaping them (first by writing &, then by putting the result in a CDATA section).

I would suggest (again) that you try to produce a cut-down example that demonstrates exactly what the problem is and cuts out the extraneous noise. Create a small stylesheet that illustrates the problem, present it in full, explain how you are running it and exactly how it fails, so that other people can easily try it and see if they get the same failure.

Michael Kay
http://www.saxonica.com/
Author, XSLT Programmer's Reference and XPath 2.0 Programmer's Reference

ismailc · January 14th, 2008, 06:39 AM

Hi - getting a bit excited here - close to a solution!

I found another tooltip that refers to a js file instead of the source code being in the xslt!

The problem i now have that it works, but i can't seem to loop or direct it to the proper value:
The tooltip displays the first value only for all the tooltips
Please, Please Assist!

<link rel="stylesheet" type="text/css" href="balloontip.css" />

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

<xsl:if test="Tooltip != ''">

  

<a>
  <xsl:attribute name='href'>ajax.htm</xsl:attribute>
  <xsl:attribute name='rel'>balloon1</xsl:attribute>??
</a>

<div id="balloon1" class="balloonstyle">
<xsl:value-of select="Tooltip" />
</div>

</xsl:if>
</td>

mhkay · January 14th, 2008, 07:22 AM

I asked you to show a complete stylesheet, and once again you have only shown a fragment. Your error is almost certainly that you have got the context wrong, but since you haven't shown enough of your code to see the context, it's impossible to be sure.

Michael Kay
http://www.saxonica.com/
Author, XSLT Programmer's Reference and XPath 2.0 Programmer's Reference