?
Solved

XSL:IF statement needs to show jpg picture when condition meets criteria

Posted on 2008-10-07
8
Medium Priority
?
983 Views
Last Modified: 2013-11-18
I have a SQL 2005 database that I am showing on a Sharepoint 2007 web page using the data view. I have a status column that holds a single character G, Y, R, or C. When the column has a G I have it set to show the field as a greem background. Y = Yellow and R=Red.

However, when the column has a 'C' in it I need to display a jpg picture that is loaded on the web site. I have the URL and can access the picture no problem.
I have attached the code that I am using for the conditional statements, all of them work except the picture. The picture does not show up, it still shows the 'C'.

Thanks for you help.
<xsl:attribute name="style">
 
<xsl:if test="normalize-space(@Status) = 'G'">color: #00FF00; background-color: #00FF00; width: 20px; height: 20px;</xsl:if>
 
<xsl:if test="normalize-space(@Status) = 'Y'">color: #FFFF00; background-color: #FFFF00; width: 20px; height: 20px;</xsl:if>
 
<xsl:if test="normalize-space(@Status) = 'R'">color: #FF0000; background-color: #FF0000; width:20px; height: 20px;</xsl:if>
 
<xsl:if test="normalize-space(@Status) = 'C'">img src="http://URL_TO_PICTURE/complete.jpg"</xsl:if>
 
</xsl:attribute>

Open in new window

0
Comment
Question by:gsfc
[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
  • 4
  • 3
8 Comments
 
LVL 11

Expert Comment

by:kmartin7
ID: 22659978
Try:
<xsl:if test="normalize-space(@Status) = 'C'">background-image:url(http://URL_TO_PICTURE/complete.jpg)</xsl:if>

It is better to wrap with xsl:text tags:

<xsl:if test="normalize-space(@Status) = 'C'"><xsl:text>background-image:url(http://URL_TO_PICTURE/complete.jpg)</xsl:text></xsl:if>
0
 
LVL 18

Accepted Solution

by:
zc2 earned 2000 total points
ID: 22660010
You can try to put the image on the background as well.

<xsl:if test="normalize-space(@Status) = 'C'">background:  url(http://URL_TO_PICTURE/complete.jpg); background-repeat: no-repeat;  background-position: center;</xsl:if>
0
 

Author Comment

by:gsfc
ID: 22670021
I have tried all three of these above...
the first one does nothing - just a 'C'  with no color
the second one does nothing - just a 'C'  with no color
the third one shows the image in Sharepoint designer but does not show on the page itself. But even in designer it only shows a piece of the image. the image I am trying to use is a small green star and in designer it shows the green center of the star but not the whole image.

So the third one is the closest....soooo close...:)
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 18

Expert Comment

by:zc2
ID: 22670912
Are you sure, the URL to the image is correct?
Could you please show it here?
You may try also take the result html and publish a new question in a HTML/CSS zone.
0
 

Author Comment

by:gsfc
ID: 22671018
I got it to view correctly in designer by resizing the image, setting a width and height, and setting the 'C' to white so it does not show up (see code below). However,  it still does not show in the web page...only in Sharepoint designer.
So now the web page shows nothing in that cell. Meaning it is taking the 'C' as white but not displaying the jpg image.

Thanks again for your help.
Chris.
<xsl:if test="normalize-space(@Status) = 'C'">background:  url(http://gsfcnet3/_layouts/images/misc/wigs/complete.jpg); width: 50px; height: 50px; background-repeat: no-repeat;  background-position: center; background-attachment: fixed; color: #008000;</xsl:if>
					

Open in new window

0
 
LVL 18

Expert Comment

by:zc2
ID: 22671054
Do you see the image if you put http://gsfcnet3/_layouts/images/misc/wigs/complete.jpg to the browser's address bar?
0
 

Author Comment

by:gsfc
ID: 22671633
Yes, as a matter of fact if I remove the repeat line in the code I can see multiple stars. So right now I have it set to repeat-x and have three stars going across the cell. If I change it to no-repeat than it shows up as a single star in designer but does not show on the data view.
0
 
LVL 18

Expert Comment

by:zc2
ID: 22671813
What is the browser you use?
Did you try to view it using different browsers?
If you use FireFox, try to use its FireBug plugin to
investigate the styles of the element.
btw, what is the html element you adding the style to?
a TD?
Could you zip and provide the full or at least most significant
part of the resulting HTML code to analyse ?
0

Featured Post

Office 365 Training for IT Pros

Learn how to provision tenants, synchronize on-premise Active Directory, implement Single Sign-On, customize Office deployment, and protect your organization with eDiscovery and DLP policies.  Only from Platform Scholar.

Question has a verified solution.

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

I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
JavaScript has plenty of pieces of code people often just copy/paste from somewhere but never quite fully understand. Self-Executing functions are just one good example that I'll try to demystify here.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

752 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