Buenas BlogInn,
Te he preparado un pequeño ejemplo a ver si es lo que buscas...Si me das tu correo electrónico te lo envío asi tienes los fuentes y no tienes que montarlo. De todas formas lo voy a explicar asi si le sirve a alguién más pues mucho mejor.
me he creado una base de datos de prueba
prueba.sql -->.sql file generado con Navicat 8
Código mysql:
Ver original/*
MySQL Data Transfer
Source Host: xxx.xxx.xxx.xxx
Source Database: prueba
Target Host: xxx.xxx.xxx.xxx
Target Database: prueba
Date: 15/05/2009 17:26:14
*/
SET FOREIGN_KEY_CHECKS
=0; -- ----------------------------
-- Table structure for videos
-- ----------------------------
-- ----------------------------
-- Records
-- ----------------------------
INSERT INTO `videos` VALUES ('1', 'Jota de Pepe Cester', '<object width=\"425\" height=\"344\"><param name=\"movie\" value=\"http://www.youtube.com/v/JUVehl6mf-c&hl=es&fs=1\"></param><param name=\"allowFullScreen\" value=\"true\"></param><param name=\"allowscriptaccess\" value=\"always\"></param><embed src=\"http://www.youtube.com/v/JUVehl6mf-c&hl=es&fs=1\" type=\"application/x-shockwave-flash\" allowscriptaccess=\"always\" allowfullscreen=\"true\" width=\"425\" height=\"344\"></embed></object>'); INSERT INTO `videos` VALUES ('2', 'Aguilas', '<object width=\"425\" height=\"344\"><param name=\"movie\" value=\"http://www.youtube.com/v/wRS53F8nGsg&hl=es&fs=1\"></param><param name=\"allowFullScreen\" value=\"true\"></param><param name=\"allowscriptaccess\" value=\"always\"></param><embed src=\"http://www.youtube.com/v/wRS53F8nGsg&hl=es&fs=1\" type=\"application/x-shockwave-flash\" allowscriptaccess=\"always\" allowfullscreen=\"true\" width=\"425\" height=\"344\"></embed></object>'); INSERT INTO `videos` VALUES ('3', 'Jotas de Jorge Sanchez\r\n', '<object width=\"425\" height=\"344\"><param name=\"movie\" value=\"http://www.youtube.com/v/12ZgKrRn8dU&hl=es&fs=1\"></param><param name=\"allowFullScreen\" value=\"true\"></param><param name=\"allowscriptaccess\" value=\"always\"></param><embed src=\"http://www.youtube.com/v/12ZgKrRn8dU&hl=es&fs=1\" type=\"application/x-shockwave-flash\" allowscriptaccess=\"always\" allowfullscreen=\"true\" width=\"425\" height=\"344\"></embed></object>');
primero de todo me creo la función que generará el objeto ajax
Código javascript
:
Ver original//Funcion que crea el objeto ajax
function objetoAjax(){
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
Ahora implementamos la función que enviará la petición asincrona al servidor, nota que 'ajax' la creamos como vble global inicializada a null. De esta forma podemos controlar su estado para poder realizar peticiones simultaneas. En este caso no creo que se te de el caso, pero para futuros proyectos si reutilizas este código te permitirá hacer multiple procesos ajax sin que se machaquen unos a otros
Código javascript
:
Ver originalvar ajax=null; //vble global
function peticion(url,divcontenido){
if (ajax==null) {
objDestino=document.getElementById(divcontenido)
ajax=objetoAjax();
ajax.open("POST", url, true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
objDestino.innerHTML = ajax.responseText
ajax = null
}else{
objDestino.innerHTML = '<img src="wait.gif" /><font style="font-family:Verdana;font-weight:bold;font-size-16pt;">Cargando Video...</font>'
}
}
ajax.send(null)
}else{
setTimeout("f1('"+url+"','"+divcontenido+"')",10)
}
}
Fíjate que en la función mientras la petición no esta en el estado 4 coloco una imagen en el contenido
Código javascript
:
Ver originalif (ajax.readyState==4) {
objDestino.innerHTML = ajax.responseText
ajax = null
}else{
objDestino.innerHTML = '<img src="wait.gif" /><font style="font-family:Verdana;font-weight:bold;font-size-16pt;">Cargando Video...</font>'
}
esto es puramente estetico y simplemente avisa al cliente de que se esta cargando el video. En mi caso wait.gif es un aspa que da vueltas coon un texto que dice 'Cargando video...'
Seguimos pues construyendo el select para seleccionar los vídeos y creamos un objeto contenedor, que en este caso es in <div> donde se cargarán los videos.
Código html:
Ver original<select id="videos" name="videos" onchange="if (this.value=='X') document.getElementById('reproductor').innerHTML=''; else peticion('cargarvideo.php?id='+this.value,'reproductor');"> <option value='X'> [Seleccione un Vídeo...]
</option> <?PHP
$sql = 'SELECT * FROM `videos`';
$consulta=mysql_query($sql,$db) or die ();
while ($row=mysql_fetch_array($consulta))
{
echo '<option value='.$row["id"].'>'.$row["titulo"].'
</option>';
}
?>
Solo faltaría el archivo php que procesará el servidor en la petición
cargarvideo.php
Código php:
Ver original<?PHP
header('Content-Type: text/xml; charset=ISO-8859-1'); //Para visualizar correctamente caracterés especiales
$db = mysql_connect($host,$usser,$pass) or
die ("No se puede conectar con el servidor");
$sql = "SELECT * FROM videos WHERE id='".$_REQUEST['id']."'";
echo $row['reproductor'];
?>
todo junto quedaría
index.php
Código html:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<meta http-equiv="Content-Language" content="es"> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <SCRIPT LANGUAGE="JavaScript">
var ajax=null; //vble global
//Funcion que crea el objeto ajax
function objetoAjax(){
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
function peticion(url,divcontenido){
if (ajax==null) {
objDestino=document.getElementById(divcontenido)
ajax=objetoAjax();
ajax.open("POST", url, true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
objDestino.innerHTML = ajax.responseText
ajax = null
}else{
objDestino.innerHTML = '
<img src="wait.gif" /><font style="font-family:Verdana;font-weight:bold;font-size-16pt;">Cargando Video...
</font>'
}
}
ajax.send(null)
}else{
setTimeout("f1('"+url+"','"+divcontenido+"')",10)
}
}
<?PHP
$db = mysql_connect($host,$usser,$pass) or die ("No se puede conectar con el servidor");
mysql_select_db('prueba') or die ("No se puede seleccionar la base de datos");
?>
<select id="videos" name="videos" onchange="if (this.value=='X') document.getElementById('reproductor').innerHTML=''; else peticion('cargarvideo.php?id='+this.value,'reproductor');"> <option value='X'> [Seleccione un Vídeo...]
</option> <?PHP
$sql = 'SELECT * FROM `videos`';
$consulta=mysql_query($sql,$db) or die ();
while ($row=mysql_fetch_array($consulta))
{
echo '<option value='.$row["id"].'>'.$row["titulo"].'
</option>';
}
?>
cargarvideo.php
Código php:
Ver original<?PHP
header('Content-Type: text/xml; charset=ISO-8859-1'); //Para visualizar correctamente caracterés especiales
$db = mysql_connect($host,$usser,$pass) or
die ("No se puede conectar con el servidor");
$sql = "SELECT * FROM videos WHERE id='".$_REQUEST['id']."'";
echo $row['reproductor'];
?>
Lo dicho, si quieres que te envie los fuentes y demás dime tu e-mail
Ya me dirás si te funciona. yo le he probado y me ha funcionado
Saludos
