Mucho les agradeceria si pueden ver esta pagina en la que intento scanear los codigos de barra de paquetes que van a ser entregados, me retorna lla descripcion del articulo, el peso y habra de calcular la tarifa o precio.
Mi problema es:
1- Cómo, despues de escanear un primer paquete retorno el cursor en "focus" al campo de texto de "scan" para que este listo para el proximo escaneo?
2- Como hago para escanear repetidamente y que el sistema agregue los datos del segundo paquete a la segunda fila, y asi sucesivamente?
Agradezco sus opiniones y comentarios!
A continuacion el codigo de la pagina en cuestion:
Código:
<script language="javascript" type="text/javascript"> <!-- // Get the HTTP Object function getHTTPObject(){ if (window.ActiveXObject) return new ActiveXObject("Microsoft.XMLHTTP"); else if (window.XMLHttpRequest) return new XMLHttpRequest(); else { alert("Your browser does not support AJAX."); return null; } } // Change the value of the outputText field function setOutput(){ if(httpObject.readyState == 4){ var respuesta = httpObject.responseText.split(","); document.getElementById('outputText0').value = httpObject.innerHTML= respuesta[0]; document.getElementById('outputText1').value = httpObject.innerHTML= respuesta[1]; document.getElementById('outputText2').value = httpObject.innerHTML= respuesta[2]; document.getElementById('articulo').innerHTML = httpObject.innerHTML= respuesta[0]; document.getElementById('peso').innerHTML = httpObject.innerHTML= respuesta[1]; document.getElementById('precio').innerHTML = httpObject.innerHTML= respuesta[2]; } } // Implement business logic function doWork(){ httpObject = getHTTPObject(); if (httpObject != null) { httpObject.open("GET", "procesador.php?inputText=" +document.getElementById('inputText').value, true); httpObject.send(null); httpObject.onreadystatechange = setOutput; } } var httpObject = null; //--> </script> <form name="testForm"> Scan: <input type="text" onkeyup="doWork();" name="inputText" id="inputText" /> <input type="text" name="outputText0" id="outputText0"/> <input type="text" name="outputText1" id="outputText1" /> <input type="text" name="outputText2" id="outputText2" /> </form> <p> <script language="JavaScript"> <!-- document.testForm.inputText.focus(); //--> </script> </p> <p>Pruebe insertando el codigo <strong>8802946000357</strong> (copie y pegue el codigo en "Scan" y presione "Enter")<br /> <br /> </p> <div id='resultadosScan1'> <div id="articulo" class="articulo">Articulo</div> <div id="peso" class="peso">Peso</div><div id="precio" class="precio">Precio</div></div><br /> <div id='resultadosScan2'> <div id="articulo2" class="articulo">Articulo</div> <div id="peso2" class="peso">Peso</div><div id="precio2" class="precio">Precio</div></div><br />
Los estilos son estos, por si acaso:
Código:
<style type="text/css" media="screen"> <!-- BODY { margin: 10px; padding: 0; font: 1em "Trebuchet MS", verdana, arial, sans-serif; } BODY { font-size: 100%; } H1 { margin-bottom: 2px; font-family: Garamond, "Times New Roman", Times, Serif;} DIV.selHolder { float: left; border: 3px solid #ccc; margin: 10px; padding: 5px;} TEXTAREA { width: 80%;} FIELDSET { border: 1px solid #ccc; padding: 1em; margin: 0; } LEGEND { color: #ccc; font-size: 120%; } INPUT, TEXTAREA { font-family: Arial, verdana; padding: 3px; border: 1px solid #999; } LABEL { display: block; margin-top: 10px; } IMG { margin: 5px; } SELECT { margin: 10px; width: 200px; } #resultadosScan1, #resultadosScan2, #resultadosScan3 { width:750px; border: 3px solid #ccc; padding:10px; } .articulo {width: 350px; border:1px solid #309; float:left; margin-left: 10px; text-align:center;} .peso {width: 150px; border:1px solid #309; float:left; margin-left:20px; text-align:center;} .precio {width: 150px; border:1px solid #309; float:right; margin-left:20px; text-align:center;} #outputText0 { width:1px; border:0px; color:#ffffff;} #outputText1 { width:1px; border:0px; color:#ffffff;} #outputText2 { width:1px; border:0px; color:#ffffff;} --> </style>