Ver Mensaje Individual
  #7 (permalink)  
Antiguo 01/10/2008, 08:15
Avatar de mgusdl
mgusdl
 
Fecha de Ingreso: abril-2007
Ubicación: Malaga, España
Mensajes: 190
Antigüedad: 17 años, 1 mes
Puntos: 5
Respuesta: ayuda validando NIE

Pues posiblemente sea por el evento onBlur.
Podrias hacerte una funcion que pida el dato con prompt, pero esto da una alerta de seguridad en IE7. Yo en la aplicación que estoy haciendo los campos NIF, NSS y CIF los solicito mediante un panel flotante donde se valida al pulsar un boton, como puedes ver en la imagen:


Te incluyo también las funciones para hacer el panel movible (drag).

Código javascript:
Ver original
  1. function getNIF(field, field2, chk) {
  2.     var panelid = 'panelNIF';
  3.     if (!field2 && !chk)
  4.         {
  5.         if (document.getElementById(panelid)) return;
  6.         var dv = crearPanel(50, 300, panelid, 'NIF', field);
  7.         dv.appendChild(document.createElement('br'));
  8.         dv.style.textAlign = 'center';
  9.         var lbl = document.createElement('label');
  10.         lbl.setAttribute('for', 'txtNIF');
  11.         lbl.appendChild(document.createTextNode('NIF: '));
  12.         dv.appendChild(lbl);
  13.         var txtfld = document.createElement('input');
  14.         txtfld.type = 'text';
  15.         txtfld.id = 'txtNIF'
  16.         txtfld.size = 12;
  17.         txtfld.maxLength = 9;
  18.         txtfld.value = field.value;
  19.         txtfld.onkeyup = function(e) { if(window.event) key = window.event.keyCode; else if(e.which) key = e.which; if (key == 13) getNIF(document.getElementById(field.id), document.getElementById('txtNIF'), 1); }
  20.         dv.appendChild(txtfld);
  21.         var btn = document.createElement('input');
  22.         btn.type = 'button';
  23.         btn.value = 'comprueba';
  24.         btn.onclick = function() { getNIF(document.getElementById(field.id), document.getElementById('txtNIF'), 1); }
  25.         dv.appendChild(btn);
  26.         var dv2 = document.createElement('div');
  27.         dv2.id = 'msg'+panelid;
  28.         dv2.className = 'warn2';
  29.         dv.appendChild(dv2);
  30.         document.body.appendChild(dv);
  31.         txtfld.focus();
  32.         }
  33.     else
  34.         {
  35.         if (checkNIF(field2.value))
  36.             {
  37.             field.value = field2.value.toUpperCase();
  38.             cerrar(panelid);
  39.             }
  40.         else
  41.             {
  42.             document.getElementById(panelid).style.height = '60px';
  43.             document.getElementById('msg'+panelid).innerHTML = 'Numero incorrecto!';
  44.             }
  45.         }
  46.     }
  47.  
  48. function cerrar(elm) { document.body.removeChild(document.getElementById(elm)); }
  49.  
  50. function crearPanel(alto, ancho, ident, titulo, elmOrig)
  51.     {
  52.     if (!alto) alto = 100;
  53.     if (!ancho) ancho = 200;
  54.     if (!ident) ident = 'popwindow';
  55.     if (!titulo) titulo = ' ';
  56.     elmOrig = document.getElementById('meca');
  57.     var tbl = document.getElementById('tablaPpal');
  58.     var eDiv = document.createElement('div');
  59.     eDiv.id = ident;
  60.     eDiv.className = 'ventana';
  61.     eDiv.style.width = ancho + 'px';
  62.     eDiv.style.height = alto + 'px';
  63.     eDiv.style.left = (elmOrig.offsetLeft + tbl.offsetLeft  + 100) + 'px';
  64.     eDiv.style.top = (elmOrig.offsetTop + tbl.offsetTop + 100) + 'px';
  65.     sp = document.createElement('span');
  66.     sp.onclick = function() { cerrar(ident); }
  67.     sp.className = 'cerrar';
  68.     sp.appendChild(document.createTextNode("X"));
  69.     eDiv.appendChild(sp);
  70.            
  71.     var cabeza = document.createElement('div');
  72.     cabeza.className = 'cabeza';
  73.     cabeza.onmousedown = function (evt) { dragStart(evt || window.event, ident); }
  74.     cabeza.appendChild(document.createTextNode(titulo));
  75.     eDiv.appendChild(cabeza);
  76.     return eDiv;
  77.     }
  78.  
  79. /*************************************************************************/
  80. /* Copyright 2001 by Mike Hall */
  81. /* Please see [url]http://www.brainjar.com[/url] for terms of use. */
  82. /*************************************************************************/
  83. // Determine browser and version.
  84.  
  85. function Browser() {
  86.     var ua, s, i;
  87.     this.isIE = false;
  88.     this.isNS = false;
  89.     this.version = null;
  90.     ua = navigator.userAgent;
  91.     s = "MSIE";
  92.     if ((i = ua.indexOf(s)) >= 0) { this.isIE = true; this.version = parseFloat(ua.substr(i + s.length)); return; }
  93.     s = "Netscape6/";
  94.     if ((i = ua.indexOf(s)) >= 0) { this.isNS = true; this.version = parseFloat(ua.substr(i + s.length)); return;   }
  95.     // Treat any other "Gecko" browser as NS 6.1.
  96.     s = "Gecko";
  97.     if ((i = ua.indexOf(s)) >= 0) { this.isNS = true; this.version = 6.1; return; }
  98.     }
  99.  
  100. var browser = new Browser();
  101.  
  102. var dragObj = new Object();
  103. dragObj.zIndex = 0;
  104.  
  105. function dragStart(event, id) {
  106.     var el;
  107.     var x, y;
  108.     // If an element id was given, find it. Otherwise use the element being
  109.     // clicked on.
  110.     if (id) dragObj.elNode = document.getElementById(id);
  111.     else {
  112.         if (browser.isIE) dragObj.elNode = window.event.srcElement;
  113.         if (browser.isNS) dragObj.elNode = event.target;
  114.     // If this is a text node, use its parent element.
  115.         if (dragObj.elNode.nodeType == 3) dragObj.elNode = dragObj.elNode.parentNode;
  116.         }
  117.     // Get cursor position with respect to the page.
  118.     if (browser.isIE) { x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft; y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop; }
  119.     if (browser.isNS) { x = event.clientX + window.scrollX; y = event.clientY + window.scrollY; }
  120.     // Save starting positions of cursor and element.
  121.  
  122.     dragObj.cursorStartX = x;
  123.     dragObj.cursorStartY = y;
  124.     dragObj.elStartLeft = parseInt(dragObj.elNode.style.left, 10);
  125.     dragObj.elStartTop = parseInt(dragObj.elNode.style.top, 10);
  126.  
  127.     if (isNaN(dragObj.elStartLeft)) dragObj.elStartLeft = 0;
  128.     if (isNaN(dragObj.elStartTop)) dragObj.elStartTop = 0;
  129.  
  130.     // Update element's z-index.
  131.     dragObj.elNode.style.zIndex = ++dragObj.zIndex;
  132.  
  133.     // Capture mousemove and mouseup events on the page.
  134.     if (browser.isIE) { document.attachEvent("onmousemove", dragGo); document.attachEvent("onmouseup", dragStop); window.event.cancelBubble = true; window.event.returnValue = false; }
  135.     if (browser.isNS) { document.addEventListener("mousemove", dragGo, true); document.addEventListener("mouseup", dragStop, true); event.preventDefault(); }
  136.     }
  137.  
  138. function dragGo(event) {
  139.     var x, y;
  140.     // Get cursor position with respect to the page.
  141.     if (browser.isIE) { x = window.event.clientX + document.documentElement.scrollLeft + document.body.scrollLeft; y = window.event.clientY + document.documentElement.scrollTop + document.body.scrollTop; }
  142.     if (browser.isNS) { x = event.clientX + window.scrollX; y = event.clientY + window.scrollY; }
  143.     // Move drag element by the same amount the cursor has moved.
  144.     dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
  145.     dragObj.elNode.style.top = (dragObj.elStartTop + y - dragObj.cursorStartY) + "px";
  146.     if (browser.isIE) { window.event.cancelBubble = true; window.event.returnValue = false; }
  147.     if (browser.isNS) event.preventDefault();
  148.     }
  149.  
  150. function dragStop(event) {
  151.     // Clear the drag element global.
  152.     dragObj.elNode = null;
  153.     // Stop capturing mousemove and mouseup events.
  154.     if (browser.isIE) { document.detachEvent("onmousemove", dragGo); document.detachEvent("onmouseup", dragStop); }
  155.     if (browser.isNS) { document.removeEventListener("mousemove", dragGo, true); document.removeEventListener("mouseup", dragStop, true); }
  156.     }
Y los estilos del panel
Código css:
Ver original
  1. .ventana { position:absolute; z-index:999px; border-top:1px solid #000; border-left:1px solid #000; border-bottom:3px solid #000; border-right:3px solid #000; width:500px; top:300px; left:300px; padding:2px; padding-top:0px; background:#FFF; }
  2. .cerrar { float:right; overflow:auto; background:#F60; color:#FFF; border:1px solid #000; font-weight:bold; cursor:pointer; }
  3. .cabeza { background:#336; color:#FFF; text-align:center; font-weight:bold; }

Y el campo:
Código HTML:
<input type="text" size="12" id="nif" onBlur="getNif(this)" readonly="readonly">