bueno aqui ta la solucion como se los dije fue como lo plantie pero agradesco al joven que me intento ayudar
mcom()
descripcion:
bueno mcom es la respuesta para cargar interfaces en una pagina web, haber como lo explico bueno digamos que tengo un menu con los siguientes elementos.
-nuevo usuario.
-modificar usuario.
-ver usuario.
y asi tengo cientos de elementos en mi menu.
por tanto aquellos que me digan que por que no cargo todo al principio pues este de... imaginen que solo queria ver si un usario se conecto al sistema y tener que cargarme todos los js y css de cada uno de esas interfaces solo pa ver si se conecto el mentado usuario... seria una #######
bueno sin mas preambulos pongamos las cartas en la mesa.
existen los siguientes archivos y la tabla de mysql
servidor/contestadora.php
servidor/interfaces/nuevo_usuario/n_user.php
servidor/interfaces/nuevo_usuario/n_user.js
servidor/interfaces/nuevo_usuario/n_user.css
servidor/interfaces/mod_usuario/m_user.php
servidor/interfaces/mod_usuario/m_user.js
servidor/interfaces/mod_usuario/m_user.css
tabla interface
campos:
id,nombre,ruta,archivo(solo el nombre del archivo sin extension)
registros agregados:
1,'agregar un usuario',/interfaces/nuevo_usuario,'n_user'
2,'modificar un usuario',/interfaces/mod_usuario,'m_user'
Código :
function mcom(interface,documento,_target)
{
//extraemos las variables del documento estan en tipo hidden pa que no molesten al usuario
//es exclusivamente para mi proyecto 
pero si quieren pueden utilizar esos elementos
var user=document.getElementById("user");
var pass=document.getElementById("pass");
//la variable param carga los valores post para enviar usuario y contraseña para verificar.
var param='interface='+interface+'&documento='+documento+'&usuario='+user.value+'&passwd='+pass.value;
//nombre del archivo en el servidor que nos dira que documentos cargar
var arch="contestadora.php";
/*capa donde alojamos los resultados aqui se pone el clasico load. o si es un iframe vale lo que sea*/
var capa=_target;
// mensajes que van a salir en la div donde se pondra el contenido
var error="<div align='center'>Problemas en la conexion</div>";
var errorx="<div align='center'>Problemas desconocidos en la trasmision</div>";
var loading="div align='center'><img src='loader.gif'>cargando...<img></div>";
//conexion asincrona con el servidor enviando datos a ..... contestadora.php
ajax=nuevoAjax();
//creamos la conexion asincrona con el servidor
ajax.open("POST",arch+param,true);
//verificamos el estado de la conexion
ajax.onreadystatechange=function()
{
//escribimos el clasico cargando con el gif animado clasico lo chulo de ajax
if (ajax.readyState==1) { document.getElementById(capa).innerHTML = loading; }
//ya llego la respuesta del servidor contestadora.php ha emitido su dictamen.
if (ajax.readyState==4)
{
//si logramos conectarnos y contestadora.php nos envio la info que querioamos todo ira bien
if (ajax.status==200)
{
//cargamos la respuesta en la variable req
var req=ajax.responseText;
/*separamos la respuesta en un array, si lo se pude hacerlo con XML y darle mas gracia al
asunto..*/
var ruta = req.split(",");
/*yo se que se pueden cargar css o js ccomo elementos en una pagina
asi que si desean cargarse mas pues aqui anotenlos tipos y en la contestadora le ponen que
responda con esos tipos si asi quieren es asu gusto*/
for (M=0;M<ruta.length;M++)
{
if (ruta[M].indexOf("js"))
{
importar('script','type,src','text/javascript,'+ruta[M]);
}
if (ruta[M].indexOf("css"))
{
importar('link', 'type,rel,href','text/css,stylesheet,'+ruta[M]);
}
}
/*bueno ya cargue los archivos js y css pero de todos modos me falta cargar los elementos de
esa interfaz entonces volvemos a llamar asincronamente al servidor pero esta vez vamos a buscar
el archivo que queremos fijense que el usuario por mas que lea este js nunca sabra de que
demonios archivo php va a cargar jaja por este motivo fue creado.*/
var metodo=6;
cargar(param,ruta[2],capa,metodo,loading,error,errorx);
//con este metodo vuelvo a cargar el archivo php que contestadora.php me dijo que cargara.
}
else if(ajax.status==404){capa.innerHTML = error;}
else {capa.innerHTML = errorx;}
}
}
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send(valores);
}
bueno ufffff esa es la funcion mas cabrona.... pero ahi ta jejeje a no todavia falta la otra carga asincrona. bueno yo pongo esas 2 cargas asincronas por que yo las uso cada rato en mi doc ya no tengo mas cargadores asincronos solo esas 2 y puras funciones js y puros php.
siguiente funcion:
Código :
/*clasico chascarrillo pa crear la conexion asincrona no le muevan nada .... esta regla no es valida
en productos IE. esos pend"·~€¬3.
*/
function nuevoAjax(){
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;
}
siguiente funcion
Código :
//funcion para importar archivos
function importar(elemento,p,v)
{
//creamos el tipo de documento
var Elem = document.createElement(elemento);
//separamos los valores y los param en array
var param = p.split(",");
var value = v.split(",");
//agregamos los parametros con valores al objeto creado
for (i=0;i<param.length;i++)
{
Elem.setAttribute(param[i],value[i]);
}
//agregamos el objeto al tag head.
document.getElementsByTagName('head')[0].appendChild(Elem);
//verificamos como es el estado del archivo
Elem.onreadystatechange = function ()
{
if (Elem.readyState == 'complete') {
alert('Archivo onreadystatechange fallo');
}
}
}
siguiente funcion
Código :
//Escrito: por Randy Abiel Cabrera Guillen.
//funcion para carga asincrona
function cargar(val,archivo,capa,metodo,Es,Er,Xr)
{
/*
Es= cadena de esperando.
Er= cadena de error de existencia.
Xr cadena de otro tipo de error.
*/
ajax=nuevoAjax();
/*
metodo 1= GET y val es un formulario.
metodo 2= POST y val es un formulario.
metodo 3= GET y val es una cadena de valores divido por ,.
metodo 4= POST y val es una cadena de valores divido por ,.
metodo 5= GET y val es un unico valor.
metodo 6= POST y val es un unico valor.
*/
switch(metodo)
{
case 1:{
var valores=valorForm(val);
ajax.open("GET",archivo+valores,true);
break;}
case 2:{
var valores=valorForm(val);
ajax.open("POST",archivo+valores,true);
break;}
case 3:{
var valores=valorString(val);
ajax.open("GET",archivo+valores,true);
break;}
case 4:{
var valores=valorString(val);
ajax.open("POST",archivo+valores,true);
break;}
case 5:{
ajax.open("GET",archivo+val,true);
break;}
case 6:{
ajax.open("POST",archivo+val,true);
break;}
}
ajax.onreadystatechange=function()
{
//adjuntar el famoso loader.
if (ajax.readyState==1) { document.getElementById(capa).innerHTML = Es; }
//termina la solicitud al servidor
if (ajax.readyState==4) {
//la solicitud es exitosa
if (ajax.status==200){
//aqui poner todo lo necesario.
document.getElementById(capa).innerHTML=ajax.responseText;
}
//error en la precarga
else if(ajax.status==404){capa.innerHTML = Er;}
else {capa.innerHTML = Xr;}
}
}
if(metodo==2 || metodo==4 || metodo==6)
{
ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajax.send(valores);
}
else {
ajax.send(null);
}
}
siguiente funcion
Código :
//Escrito: por Randy Abiel Cabrera Guillen.
//construccion de cadenas de valores para enviar al servidor via string
function valorString(val)
{
var valor = val.split(",");
var valores="";
for (var i=0; i<valor.length;i++)
{
valores=valores+"&"+valor[i];
}
valores="?obj="+i+valores;
return(valores);
}
//Escrito: por Randy Abiel Cabrera Guillen.
//construccion de cadenas de valores para enviar al servidor via estructura de formulario(con o sin restriccion de objetos)
function valorForm(formulario,exc,tipos)
{
var form= document.getElementById(formulario);
var valores="";
var num=0;
for ( i=0; i<form.elements.length;i++)
{
//si existe restriccion de campos a enviar al servidor
if (exc =="S")
{
if (tipos.indexOf(form.elements[i].type)!=-1)
{
//verificar valores del tipo texto
//concatenacion de valores
valores=valores+"&"+form.elements[i].name+"="+form.elements[i].value;
num++;
}
}
else
{
valores=valores+"&"+form.elements[i].name+"="+form.elements[i].value;
num++;
}
}
valores="?obj="+num+valores;
return(valores);
}
estas ultimas eran 2 pero hacen lo mismo solo crean las cadenas para enviar valores por post o get.
bueno estos son solo las funciones js, faltan todavia los php.
contestadora.php
Código :
<?php
session_start();
require_once('conect.php');
if ($_POST['usuario']==$_SESSION['username'] && $_POST['passwd']==$_SESSION['password'])
{
//conectar con el servidor.
$cn=@mysql_connect(DB_HOST,DB_USER,DB_PASSWORD);
if (!$cn){$result='<div align="center" class="returnresp"> '.error000.' </div>';}
//seleccionar la base de datos
if(!@mysql_select_db(DB_NAME, $cn)){$result='<div align="center" class="returnresp"> '.error001.' </div>';}
//realizar consulta
$data=@mysql_query('select * from '.PREFIJO.'interfaces where id ="'.$_POST['interface'].'"',$cn);
if(!$data){$result='<div align="center" class="returnresp"> '.error002.' </div>';}
//verificar si existe el usuario y si el password es correcto.
if (mysql_num_rows($data)!=0)
{
$rw=mysql_fetch_array($data);
$file=$rw['directorio'].'/'.$rw['archivo'];
if (file_exists ('../'.$file.'.js')){echo $file.'.js,';}
else {echo "none,";}
if (file_exists ('../'.$file.'.css')){echo $file.'.css,';}
else {echo "none,";}
if (file_exists ('../'.$file.'.php')){echo $file.'.php,';}
else {echo "none,";}
echo'end';
}
}
else
{
echo "el usuario no concide";
}
?>
el archivo conect.php bueno ese no se que decirles pero bueno ahi tiene que crear las variables
de conexion con el servidor mmm con el metodo define
por ejemplo
Código :
define('DB_HOST','189.168.43.4');
define('DB_USER','root'); //clasico no cambia
define('DB_PASSWORD','180485');//xd tambien un clasico poner su fecha de nac
define('DB_NAME,'base_de_datos');//jejeje no jueguen pongale bien el nombre
en este tipo de documentos tambien pueden agregar variables fijas que no cambian o
variables cargadas desde la base de datos para su uso del usuario siempre con valores fijos.
bueno y los otros docs. como son el js el php y css que se van a cargar es a gusto del cliente.
espero y les sirva.. si tienen dudas agreguenle comentarios jejeje si tienen mejoras tambien se aceptan.
yo estoy a favor del codigo reutilizable.[/code]
