Display image on HTML page using XML

143 New Member

I have this product catalog. I am to scroll through the catalog on the HTML page and use data from the XML page to display the different products with a picture of each. I have the data and the scoll functions working great, but I can't tie my pictures to the products. Here's what I have so far:

HTML part:
[HTML]<body>

<xml id="product_cat " src="products.x ml"></xml>

<table border="6" bordercolordark ="green" bordercolorligh t="#CCCCFF" cellpadding="2" >

<tr><td rowspan="5" align="center" width="110" bgcolor="#CCCCF F">
<img datasrc="#produ ct_cat" datafld="Photo" ><br>
<span datasrc="#produ ct_cat" datafld="Name"> </span>
</td>
<td width="120" bgcolor="green" >
<span class="rowhead" >Part Number:</span>
</td>
<td width="240" bgcolor="white" >
<span datasrc="#produ ct_cat" datafld="CPN"></span>
</td>
</tr>
</table>
</body>
[/HTML]

Here's the XML file:

[HTML]<?xml version="1.0" encoding="utf-8" ?>

<CATALOG>

<PROD>
<CPN>TAB1015-10</CPN>
<NAME>Vented Pull Tabs</NAME>
<DESC>These pull tabs are vented.</DESC>
<PRICE>5.00</PRICE>
<HANDLING>0.2 0</HANDLING>
<Photo><img url="images/VentedPullTabs. jpg" /></Photo>
</PROD>
</CATALOG>[/HTML]

I think the problem is with the <Photo><img url="images/VentedPullTabs. jpg" /></Photo> line in the XML file.

Any Ideas?

Oct 3 '07 #1

Subscribe Reply

13681

Dököll

2,364

Recognized Expert Top Contributor

I have this product catalog. I am to scroll through the catalog on the HTML page and use data from the XML page to display the different products with a picture of each. I have the data and the scoll functions working great, but I can't tie my pictures to the products. Here's what I have so far:

Any Ideas?

How about this teddarr!

See if below can be salvaged. Perhaps using img src will do the trick for you:

[HTML]

<a href="index.htm ">
<img border="0" src="images/VentedPullTabs. jpg" />
</a>
[/HTML]

Let us know if that works...Welcome !

Oct 4 '07 #2

jkmyoung

2,057

Recognized Expert Top Contributor

I see you're using xml data islands.

I don't know if that ever worked with images, especially when the src url is embedded in another node.

To be honest, Xml Data Islands are only supported by IE, and are being phased out. I would suggest that you consider switching to XSL, or another alternative that works cross-browser.

Oct 4 '07 #3

teddarr

143

New Member

In the real world I would consider this, but in the class I am taking, data islands is required for step 1. The professor did warn us not to get upset if the data islands wouldn't work for firefox.

Step 2 uses XSL as part of a search function.

Oct 4 '07 #4

jkmyoung

2,057

Recognized Expert Top Contributor

1st guess then: change path:
<Photo><img url="images/VentedPullTabs. jpg" /></Photo>
<img datasrc="#produ ct_cat" datafld="Photo/img/@url"><br>

2nd guess: use entire data field seperately.
<Photo><span datasrc="#produ ct_cat" datafld="Photo"/></Photo>

Personally doubt either of these work. Haven't used data islands in years.

Oct 4 '07 #5

teddarr

143

New Member

OK, Here's what finally worked

In the HTML page:

[HTML]<table border="6" bordercolordark ="green" bordercolorligh t="#CCCCFF" cellpadding="2" >

<tr><td rowspan="5" align="center" width="110" bgcolor="#CCCCF F">
<img datasrc="#produ ct_cat" datafld="graphi c" alt="product" height="100px" width="100px">
<span datasrc="#produ ct_cat" datafld="Name"> </span>
</td>
<td width="120" bgcolor="green" >
<span class="rowhead" >Part Number:</span>
</td>
<td width="240" bgcolor="white" >
<span datasrc="#produ ct_cat" datafld="CPN"></span>
</td>
</tr> [/HTML]

In the XML page:

[HTML]<PROD>
<CPN>TAB1015-10</CPN>
<NAME>Vented Pull Tabs</NAME>
<DESC>These pull tabs are vented.</DESC>
<PRICE>5.00</PRICE>
<HANDLING>0.2 0</HANDLING>
<graphic>imag es/VentedPullTabs. jpg</graphic>
</PROD>[/HTML]

Now the next problem:

On an XSL file, I take in a product name as a search string in a text box. I press the search button. Then the xslProc.output property will not display in the document.write( xslProc.output) statement. Everything works good down to the alert box that is commented out, and for a brief second, I can see that the output property does hold what I am looking for. But then it goes null.

Here's what I have so far:

[HTML]function Button1_onclick () {
var xslt = new ActiveXObject(" Msxml2.XSLTempl ate");
var xslDoc = new ActiveXObject(" Msxml2.FreeThre adedDOMDocument ");
var xslProc;
var txtsearch = form1.Text1.val ue;
xslDoc.async = false;
xslDoc.resolveE xternals = false;
xslDoc.load("se arch.xsl");
xslt.stylesheet = xslDoc;
var xmlDoc = new ActiveXObject(" Msxml2.DOMDocum ent");
xmlDoc.async = false;
xmlDoc.resolveE xternals = false;
xmlDoc.load("pr oducts.xml");
xslProc = xslt.createProc essor();
xslProc.input = xmlDoc;
// alert(form1.Tex t1.value);
xslProc.addPara meter("NAME",tx tsearch);
xslProc.transfo rm();
document.write( xslProc.output) ;
}[/HTML]

Oct 5 '07 #6

Similar topics

3143

Breaks in between display: inline's ?

by: Mat | last post by:

<div id="container"> <div id="main"> <div id="header"> <p class="Address">123 Fake Street, </p> <p class="City">Crazy City, </p> <p class="Province">Ontario </p> <p class="PostalCode">H0H 0H0</p> <p class="Telephone">Telephone: 555-1234 </p> <p class="Fax">Fax: 555-4321</p> </div>

HTML / CSS

2490

display an html file within a web form?

by: Victor | last post by:

Hi I need to open an html file from the file system and embed that html file within my main aspx form. I have 2 questions: 1) How do I open the html file? I tried the File.open(Path, mode) didnt work. 2) I would like to display the html file at a certain location in my main aspx page. How can I achieve this? I'm brain dead and I have to...

.NET Framework

3480

display new bitmap

by: Tina | last post by:

I'm in a button clicked event on mainpage.aspx. I want to display a new webpage that has just my image, which is a jpg. I want the page to be a ..jpg not an aspx so that it will be easy for the user to save to disk. How can I do this? Thanks, T

ASP.NET

1517

Image Display

by: Meena Desai | last post by:

Hi, In my .aspx page there are some .jpg images. When I browse the page using IE6, it goes into an infinite loop in downloading the image. No image is displayed after that. If I browse .htm page with same images, it downloads immediately. I found one solution to this problem, that is install KB889293 patch for IE6. But this is not the...

ASP.NET

2941

How to display multiple images in one browser window?

by: david | last post by:

Can I use WriteFile methods? It seems that it does not work. For example, the following code only dispay one figure. Response.WriteFile("images/image002.jpg") Response.Write("<br><p>") Response.WriteFile("images/image003.jpg") Response.Write("<br><p>") Any help? Thanks

ASP.NET

5025

Display Images vertically via web service

by: Peter Lapic | last post by:

I have to create a image web service that when it receives an imageid parameter it will return a gif image from a file that has been stored on the server. The client will be an asp.net web page that calls the web service to render a vertical strip of images. After doing some research I am unable to find some vb.net code that can assist...

ASP.NET

2574

Problem with Image display on separate window

by: tshad | last post by:

This was posted before but the message got messed up (all NLs were stripped out for some reason). I have 2 labels that hold the name of different images on my .aspx page. <asp:Label ID="Logo" runat="server"/> <asp:Label ID="CompanyPicture" runat="server"/> I have 2 links that open the windows to preview these images. The previewed...

ASP.NET

2980

How to retrive image file from MS access database and display this in another JSPpage

by: amritranjan | last post by:

How to retrive image file from MS access database and display this in another JSPpage -------------------------------------------------------------------------------- This is my Jsp code for image upload in database: -----------Upload.jsp---------------- <html> <head> <title>Account Details </title>

Java

8319

Using jS to display an image from file

by: Tim Streater | last post by:

The following test page is intended to allow the user to choose an image file, and then display it. It works as expected in Safari 3.1.1, FF 2.0.0.14 (Mac), and IE7 (XP). But, it fails in FF 2.0.0.14 (Win-XP) - the image doesn't appear. The error console shows no errors and Page Info, under the media tab, shows no loaded image (in contrast...

Javascript

2837

How to access and display the jpg file on the fly using js in clie

by: =?Utf-8?B?QmlsbHkgWmhhbmc=?= | last post by:

I have a asp.net app, in the page there is a scan activex which could scan and save a jpg file in client harddisk. How could we access and display this jpg file on the fly using js in the client IE? Thanks, -Billy zhang

ASP.NET

7915

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...

General

8205

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. ...

C / C++

8339

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...

Online Marketing

7967

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...

Windows Server

6619

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...

Career Advice

3840

Trying to create a lan-to-lan vpn between two differents networks

by: TSSRALBI | last post by:

Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...

Networking - Hardware / Configuration

2347

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp

1452

How to add payments to a PHP MySQL app.

by: muto222 | last post by:

How can i add a mobile payment intergratation into php mysql website.

PHP

1185

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

General