<STYLE TYPE="text/css">
#contenedorOpt div.seleccionado {font-weight:bold; background:#F0F0F0; color:#FF6600;}
#contenedorOpt div.deseleccionado {background:#FFFFFF; color:#000000;}
#contenedorOpt div {font:11px verdana; color:#000000; cursor:pointer; text-align:left; padding:2px 5px;}
.capa {
background: #FFFFFF;
border:1px solid rgb(120,120,120);
width: 144px;
_width: 146px;
text-align: left;
position: absolute;
}
</STYLE>
<script type="text/javascript">
var ns4 = (document.layers)? true:false
var ie4 = (document.all)? true:false
var ns6 = (document.getElementById)? true:false
var TxtId = '';
var SelUsuario = {
captura_objeto : function(idnombre) {
if (ns6) {
return document.getElementById(idnombre);
}else if (ie4){
return document.all[idnombre];
}else if (ns4){
return document.layers[idnombre];
}else{
return null;
}
},
Evento: function (elemento,nomevento,funcion) {
if (elemento.attachEvent) {
var f=function() {
funcion.call(elemento,window.event);
}
elemento.attachEvent('on'+nomevento,f);
return true;
} else if (elemento.addEventListener) {
elemento.addEventListener(nomevento,funcion,false);
return true;
}else{
return false;
}
},
creaAjax: function (){
var ajaxs = ["Msxml2.XMLHTTP","Msxml2.XMLHTTP.4.0","Msxml2.XMLH TTP.5.0","Msxml2.XMLHTTP.3.0","Microsoft.XMLHTTP"];
var ajax = false;
for(var i=0 ; !ajax && i<ajaxs.length ; i++){
try{
ajax = new ActiveXObject(ajaxs[i]); // Internet Explorer
}
catch(e) {
ajax = false;
}
}
if(!ajax && typeof XMLHttpRequest!='undefined') {
ajax = new XMLHttpRequest(); // Firefox, Opera 8.0+, Safari
}
return ajax;
},
init: function(){
var tablas = document.body.getElementsByTagName('table');
for (i=0; i < tablas.length; i++) {
var inpt = tablas[i].getElementsByTagName('input');
SelUsuario.Evento(SelUsuario.captura_objeto(inpt[2].id), 'keyup', SelUsuario.Empieza);
SelUsuario.Evento(SelUsuario.captura_objeto('contenedorOpt'), 'mouseover', SelUsuario.Seleccionar);
SelUsuario.Evento(SelUsuario.captura_objeto(inpt[2].id), 'keydown', SelUsuario.Pegar2);
SelUsuario.Evento(SelUsuario.captura_objeto(inpt[2].id), 'blur', SelUsuario.Cerrar);
}
},
PosicionAbsolutaElemento: function(elTxtBox) {
if (typeof elTxtBox == "string")
var elTxtBox = SelUsuario.captura_objeto(elTxtBox);
if (!elTxtBox) return { top:0,left:0 };
var y = 0;
var x = 0;
while (elTxtBox.offsetParent) {
x += elTxtBox.offsetLeft;
y += elTxtBox.offsetTop;
elTxtBox = elTxtBox.offsetParent;
}
return {top:y,left:x};
},
Desplieaga: function(posLeft,posTop) {
var elDiv = SelUsuario.captura_objeto('contenedorOpt');
elDiv.style.left = posLeft+'px';
elDiv.style.top = parseInt(posTop+21) +'px';
elDiv.style.display = 'block';
elDiv.style.zIndex = 100;
},
Empieza: function (ev) {
TxtId = SelUsuario.captura_objeto(this.id).id;
var elTxtBox = SelUsuario.captura_objeto(this.id);
var str = elTxtBox.value;
var elDiv = SelUsuario.captura_objeto('contenedorOpt');
var opt = elDiv.getElementsByTagName('DIV');
var keyCode = document.layers ? ev.which : document.all ? event.keyCode : document.getElementById ? ev.keyCode : 0;
if (keyCode == 40) {
SelUsuario.BajaOpt ('contenedorOpt')
}else if (keyCode == 38) {
SelUsuario.SubeOpt ('contenedorOpt')
}else if (keyCode == 13) {
for (var i = 0; i <= opt.length-1; i++) {
if (opt[i].className == "seleccionado") {
str = opt[i].id;
if (elDiv.style.display == "block"); elDiv.style.display= "none";
break;
}
}
try{ // DOM;
ev.preventDefault();
}catch(e){ // iexplore;
ev.returnValue = false;
}
} else {
if (str.length < 2) {
if (elDiv.style.display == "none") elDiv.style.display= "none";
else elDiv.style.display= "none";
return;
}
ajax = SelUsuario.creaAjax()
if (ajax==null) {
alert ("Tu navegador no soporta Ajax");
return;
}
var url="SelecUsuarios.php?q="+escape(str);
ajax.open("GET",url,true);
ajax.onreadystatechange = function () {
var PosElemento = SelUsuario.PosicionAbsolutaElemento(elTxtBox);
var posicionInicialLeft = parseInt(PosElemento.left);
var posicionInicialTop = parseInt(PosElemento.top);
if (ajax.readyState==1 || ajax.readyState==2 || ajax.readyState==3) {
elDiv.innerHTML = "<p align='center'><img src='precarga.gif' border='0px' widht='15px' height='15px'/></p>";
elDiv.style.display= "block";
}else if (ajax.readyState==4) {
if (ajax.status==200) {
elDiv.innerHTML = unescape(ajax.responseText);
}else {
elDiv.innerHTML = "<p>Se ha producido un error</p>";
}
if (elDiv.style.display == "none") elDiv.style.display= "block";
}
SelUsuario.Desplieaga(posicionInicialLeft, posicionInicialTop);
}
ajax.send(null);
return
}
},
Seleccionar: function () {
var opt = SelUsuario.captura_objeto('contenedorOpt').getElementsByTagName('DIV');
for (var i = 0; i < opt.length; i++) {
SelUsuario.Evento(opt[i], 'click', function() {SelUsuario.Pegar(this.id);})
SelUsuario.Evento(opt[i], 'mouseover', function() {SelUsuario.Marcar(this.id);})
}
},
Pegar: function (valor) {
var elDiv = SelUsuario.captura_objeto('contenedorOpt')
SelUsuario.captura_objeto(TxtId).value = valor;
if (elDiv.style.display == "block"); elDiv.style.display= "none";
},
Marcar: function (valor) {
var selecionado = SelUsuario.captura_objeto(valor);
var opt = SelUsuario.captura_objeto('contenedorOpt').getElementsByTagName('DIV');
for (var i = 0; i < opt.length; i++) {
if (opt[i].className == "seleccionado") {
opt[i].className = "deseleccionado";
selecionado.className = "seleccionado";
break;
}
}
},
Pegar2: function (ev) {
var elDiv = SelUsuario.captura_objeto('contenedorOpt')
var opt = elDiv.getElementsByTagName('DIV');
var keyCode = document.layers ? ev.which : document.all ? event.keyCode : document.getElementById ? ev.keyCode : 0;
if ((keyCode == 13) || (keyCode == 9)) {
for (var i = 0; i <= opt.length-1; i++) {
if (opt[i].className == "seleccionado") {
SelUsuario.captura_objeto(this.id).value = opt[i].id;
if (elDiv.style.display == "block"); elDiv.style.display= "none";
break;
}
}
if (keyCode == 13) {
try{ // DOM;
ev.preventDefault();
}catch(e){ // iexplore;
ev.returnValue = false;
}
}
}
},
BajaOpt: function() {
var opt = SelUsuario.captura_objeto('contenedorOpt').getElementsByTagName('DIV');
for (var i = 0; i <= opt.length-1; i++) {
if (opt[i].className == "seleccionado") {
opt[i].className = "deseleccionado";
if (i < opt.length-1){
i++;
}else{
i = 0;
}
opt[i].className = "seleccionado"
}
}
},
SubeOpt: function() {
var opt = SelUsuario.captura_objeto('contenedorOpt').getElementsByTagName('DIV');
for (var i = 0; i <= opt.length-1; i++) {
if (opt[i].className == "seleccionado") {
opt[i].className = "deseleccionado";
if (i < opt.length && i > 0){
i--;
}else{
i = opt.length-1;
}
opt[i].className = "seleccionado"
}
}
},
Cerrar: function () {
setTimeout("var elDiv = SelUsuario.captura_objeto('contenedorOpt'); if (elDiv.style.display == 'block'); elDiv.style.display= 'none';", 1000);
}
}
SelUsuario.Evento(window, 'load', SelUsuario.init);
</script>