Carrito compra javascript xml

EUROJAIME · #1 (**permalink**) 11/05/2005, 09:42

Hola a todos alguien me puede ayudar en como hacer un carrito de la compra usando javascripit y xml, donde el xml estará toda la informacion para mostrar, algo parecido como se muestra en el siguiente enlace:

http://www.ceeteesoft.com/photo_search/

Gracias saludos
Jaime

E*M*P*I*C*A*L · #2 (**permalink**) 11/05/2005, 10:48

Entiendo mas o menos lo que quieres, estas dos funciones generan tags <img> con valores sacados desde un archivo xml, el único problema es que solo funciona para IE :/, una auténtica lastima...

Código:

function xmlPost(pUrl)
{
  xmlDoc = new ActiveXObject("Msxml2.DOMDocument.3.0"); 
	xmlDoc.async = false;
	xmlDoc.resolveExternals = false; 	
	xmlDoc.load(pUrl);
	return(xmlDoc);
}

function CargaImg(archivo)
{
 var img = "";
 var res = xmlPost(archivo);
 var elems = res.getElementsByTagName("img");
 for (var i = 0; i < elems.length; i ++) 
 {
  var el = elems.item(i)
  ruta = el.getAttribute("ruta");
  titulo = el.getAttribute("titulo");
  alt = el.getAttribute("alt");
  var evento = 'O['+i+'].clic()';
  var clase= "img";
  img+="<img onclick='" + evento + "' class='" + clase + "' src='" + ruta + "' title='" + titulo + "' alt='" + alt + "' />";
 }
document.all["box"].innerHTML = img;
img = "";
}

EUROJAIME · #3 (**permalink**) 11/05/2005, 15:02

estoy intentando hacer lo que me mandas, como sería el xml para el caso que me escribes?

gracias y saludos
Jaime

EUROJAIME · #4 (**permalink**) 11/05/2005, 22:36

Perdona por las molestias, pero aparte de un ejemplo del xml, me podrías mandar un ejemplo de html con tus funciones ayer estuve hasta la una de la noche y no me salia

gracias
jaime

E*M*P*I*C*A*L · #5 (**permalink**) 12/05/2005, 10:26

Aqui va un ejemplo de xml:

Código:

<?xml version="1.0" encoding='ISO-8859-1'?>
<imagenes>
<img ruta="imagenes/galerias/modelos/menuclaudiaar.jpg" titulo="atitulo de la imagen" alt="texto alternativo" />
<img ruta="imagenes/galerias/modelos/menudolo.jpg" titulo="btitulo de la imagen" alt="texto alternativo" />
<img ruta="imagenes/galerias/modelos/menufla.jpg" titulo="ctitulo de la imagen" alt="texto alternativo" />
<img ruta="imagenes/galerias/modelos/menugise.jpg" titulo="dtitulo de la imagen" alt="texto alternativo" />
<img ruta="imagenes/galerias/modelos/menujas.jpg" titulo="etitulo de la imagen" alt="texto alternativo" />
<img ruta="imagenes/galerias/modelos/menujuli.jpg" titulo="ftitulo de la imagen" alt="texto alternativo" />
<img ruta="imagenes/galerias/modelos/menunic.jpg" titulo="gtitulo de la imagen" alt="texto alternativo" />
<img ruta="imagenes/galerias/modelos/menupan.jpg" titulo="htitulo de la imagen" alt="texto alternativo" />
<img ruta="imagenes/galerias/modelos/menuvale.jpg" titulo="ititulo de la imagen" alt="texto alternativo" />
</imagenes>

EUROJAIME · #6 (**permalink**) 12/05/2005, 11:13

Gracias por el xml, pero lo que me sigue sin funcionar es las llamas de las funciones en mi html, perdona por ser plasta un ejemplo del html, para ver donde fallo.

GRacias

Jaime

E*M*P*I*C*A*L · #7 (**permalink**) 12/05/2005, 12:08

No te preocupes, debi haberlo puesto al principio :)

Mira este es un ejemplo completo que estuve usando, debe de funcionar si estan bien defeinidas las rutas a las imagenes. Lo unico que no funciona es el evento del objeto O[] ya que aqui no existen las funciones que lo crean...

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<script>
function xmlPost(pUrl){
  xmlDoc = new ActiveXObject("Msxml2.DOMDocument.3.0"); 
	xmlDoc.async = false;
	xmlDoc.resolveExternals = false; 	

	xmlDoc.load(pUrl);
	return(xmlDoc);
}

function x(archivo)
{
var img = "";
var res = xmlPost(archivo);
var elems = res.getElementsByTagName("img");
for (var i = 0; i < elems.length; i ++) {
var el = elems.item(i)
ruta = el.getAttribute("ruta");
titulo = el.getAttribute("titulo");
alt = el.getAttribute("alt");
var evento = 'O['+i+'].clic()';
img+=("<img onclick=" + evento + " class=img src=" + ruta + " title=" + titulo + " alt=" + alt + ">");

}
document.all["cuadro"].innerHTML = img;
img = "";
}
</script>
</head>
<body>

<div id="cuadro" style="border:1px solid #000000; width:300px;">
</div>
<script>var archivo = 'imagenes.xml'; x(archivo)</script>
<a href="#" onclick=x('imagenes.xml')>1</a>
<a href="#" onclick=x('arte.xml')>2</a>
</body>
</html>

EUROJAIME · #8 (**permalink**) 12/05/2005, 14:00

gracias por la respuesta, lo que pasa, es que tengo que hacer un carro de la compra, si es con asp o asp.net, perfecto lo puedo hacer, pero mi cliente lo quiere através de un CD y mandarlo a los clientes, y creo que esta forma podría funcionar, sin pasar por ASP y base de datos en el cd, y necesitaría un ejemplo con inputs para poner cantidades etc. Espero que me puedas ayudar, gracias
JAime

EUROJAIME · #9 (**permalink**) 12/05/2005, 16:02

Hola de nuevo, he podido avanzar algo más te dejo el código :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<script>
function xmlPost(pUrl){
xmlDoc = new ActiveXObject("Msxml2.DOMDocument.3.0");
xmlDoc.async = false;
xmlDoc.resolveExternals = false;
xmlDoc.load(pUrl);
return(xmlDoc);
}

function msg ()
{
alert ("grabar en un archivo xml");
}

function x(archivo)
{
var img = "";
var tablaInicio = "";
var tablaFin = "";
var datos = "";
var res = xmlPost(archivo);
var elems = res.getElementsByTagName("img");
var inputs = "";
var codigo = "";

tablaInicio += ("<table border=1 align=center>")
for (var i = 0; i < elems.length; i ++)
{
var el = elems.item(i)
ruta = el.getAttribute("ruta");
titulo = el.getAttribute("titulo");
alt = el.getAttribute("alt");
var evento = 'O['+i+'].clic()';
precio = el.getAttribute("precio");
embalaje = el.getAttribute("embalaje");
codigo = el.getAttribute("id");
datos +=("Precio : " + precio + "  " + "Embalaje : " + embalaje + "<br>")
inputs += ("<input type='text' maxlength='10' value='1' name=text_" + codigo + " size='8' onClick='msg()'>  <input type=button name=" + codigo + " value='Enviar Carro'>")
img+=("<tr><td>" + titulo + "</tr></td><tr><td><img onclick=" + evento + " class=img height=250 width=350 src=" + ruta + "></td></tr><tr><td>" + datos + inputs +"</td></tr>");
datos = "";
inputs = "";
}
tablaFin += ("</table>")
document.all["cuadro"].innerHTML = tablaInicio + img + tablaFin;

img = "";
tablaInicio = "";
tablaFin = "";

}
</script>
</head>
<body>
<div id="cuadro" align="center"></div>
<script>var archivo = 'imagenes.xml'; x(archivo)</script>
<a href="#" onclick=x('imagenes.xml')>1</a>
<a href="#" onclick=x('arte.xml')>2</a>
</body>
</html>

Y este es el xml :

<?xml version="1.0" encoding='ISO-8859-1'?>
<imagenes>
<img id="030101010011" ruta="imagenes/030101010011.jpg" titulo="BOLSA BASURA AUTOCIERRE AZUL" precio="0,45" embalaje="50"/>
<img id="030101010013" ruta="imagenes/030101010013.jpg" titulo="BOLSA BASURA AUTOCIERRE NEGRA" precio="0,43" embalaje="60"/>
<img id="031555000045" ruta="imagenes/031555000045.jpg" titulo="BOLSA RAFIA 40X46X20" precio="0,45" embalaje="12" />
<img id="065035010045" ruta="imagenes/065035010045.jpg" titulo="BLISTER BATIDOR CROMADO" precio="0,45" embalaje="12" />
<img id="065085100045" ruta="imagenes/065085100045.jpg" titulo="BATIDOR CROMADO PILAS" precio="0,45" embalaje="12" />
<img id="120205056010" ruta="imagenes/120205056010.jpg" titulo="BOMBILLA PEQUEñA CLARA E27 60W " precio="0,23" embalaje="10" />
<img id="120205155038" ruta="imagenes/120205155038.jpg" titulo="BOMBILLA ESF. JUPITER MATE E-27 60 W" precio="0,29" embalaje="10" />
<img id="120210015039" ruta="imagenes/120210015039.jpg" titulo="BOMBILLA VELA JUPITER CLARA E-14 60 W" precio="0,29" embalaje="10" />
<img id="120605010046" ruta="imagenes/120605010046.jpg" titulo="BROCHAS X 5" precio="0,45" embalaje="12" />
</imagenes>

Como te comentaba antes he puedo los inputs de textbox para poner cantidad y un botón, mi idea es seguir usando el xml, pero otro donde los articulos seleccionados lo guardo en el xml. ¿que te parece?.

En el código que te paso, me pasa dos cosas:
1.Las imágenes con sus datos están en una tabla, pero me gustaría que en vez de dejarlo todo en una columna que sean tres, para tenerlo más repartido.

2.He puesto una funcion para probar que se llama msg, fijate donde la llamo en inputs += ("<input type='text' maxlength='10' value='1' name=text_" + codigo + " size='8' onClick='msg()'>  <input type=button name=" + codigo + " value='Enviar Carro'>"), pero cuando la ejecuto no me salta el alert.

Espero que me puedas ayudar, gracias, y si puedes pasame un ejemplo completo me ha servido mucho los pasos que me dejaste. Te dejo mi email, [email protected].

Gracias
Jaime

EUROJAIME · #10 (**permalink**) 13/05/2005, 05:00

EMPICAL espero que no te aburra con mis problemillas, se que es un tema complejo, y lo que es con javascript he tocado poquillo.

Saludos
Jaime

EUROJAIME · #11 (**permalink**) 13/05/2005, 15:44

alguien me puede ayudar?