Tema: Ajax con ASP
Ver Mensaje Individual
  #12 (permalink)  
Antiguo 29/12/2009, 08:29
darkmcloud
 
Fecha de Ingreso: octubre-2007
Mensajes: 191
Antigüedad: 17 años, 6 meses
Puntos: 0
Respuesta: Ajax con ASP
compadres...sigo con problemas...
probe con request.form y request.querystring
este es el codigo con las modificaciones que me dijo Adler:

SelectUsuariosAjax.asp
Código ASP: 
Ver original
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html xmlns="http://www.w3.org/1999/xhtml"lang="es" xml:lang="es">
  3. <head>
  4. <meta name="http-equiv" content="Content-type: text/html; charset=UTF-8"/>
  5. <STYLE TYPE="text/css">
  6. #contenedor div.seleccionado {font-weight:bold; background:#F0F0F0; color:#black;}
  7. #contenedor div.deseleccionado {background:#FFFFFF; color:#000000;}
  8. #contenedor div{font:11px verdana; color:#000000; cursor:pointer; text-align:left; padding:2px 5px;}
  9. .capa {
  10. background: #FFFFFF;
  11. border:1px solid rgb(120,120,120);
  12. width: 150px;
  13. _width: 250px;
  14. text-align: left;
  15. position: absolute;
  16. top: 30px;
  17. _top:38px;
  18. left: 117px;
  19. _left: 119px;
  20. }
  21. </STYLE>
  22. <script type="text/javascript">
  23. var SelUsuario = {
  24.  
  25. Evento: function (elemento,nomevento,funcion) {
  26.   if (elemento.attachEvent)
  27.   {
  28.       var f=function(){
  29.         funcion.call(elemento,window.event);
  30.     }
  31.     elemento.attachEvent('on'+nomevento,f);
  32.     return true;
  33.   }
  34.   else  
  35.     if (elemento.addEventListener)
  36.     {
  37.       elemento.addEventListener(nomevento,funcion,false);
  38.       return true;
  39.     }
  40.     else
  41.       return false;
  42. },
  43.  
  44. init: function(){
  45. var elem1 = document.getElementById("txt");
  46. var elem2 = document.getElementById("contenedor");
  47.         SelUsuario.Evento(elem1, 'keyup', SelUsuario.Empieza);
  48.         SelUsuario.Evento(elem2, 'mouseover', SelUsuario.Seleccionar);
  49.         SelUsuario.Evento(elem1, 'keydown', SelUsuario.Pegar2);
  50.         SelUsuario.Evento(window, 'click', SelUsuario.Cerrar);
  51. },
  52.  
  53. creaAjax: function (){
  54.     var ajaxs = ["Msxml2.XMLHTTP","Msxml2.XMLHTTP.4.0","Msxml2.XMLH TTP.5.0","Msxml2.XMLHTTP.3.0","Microsoft.XMLHTTP"];
  55.     var ajax = false;
  56.     for(var i=0 ; !ajax && i<ajaxs.length ; i++){
  57.         try{ 
  58.             ajax = new ActiveXObject(ajaxs[i]);   // Internet Explorer
  59.         }
  60.         catch(e) { 
  61.             ajax = false; 
  62.         }
  63.     }
  64.     if(!ajax && typeof XMLHttpRequest!='undefined') {
  65.         ajax = new XMLHttpRequest();  // Firefox, Opera 8.0+, Safari
  66.     }
  67.     return ajax;
  68. },
  69.  
  70. Empieza: function (ev) {
  71. var str = document.getElementById(this.id).value;
  72. var obj = document.getElementById("contenedor");
  73. var obj2 = document.getElementById("campo").value;
  74. var ref = obj.getElementsByTagName('DIV');
  75. var keyCode = document.layers ? ev.which : document.all ? event.keyCode : document.getElementById ? ev.keyCode : 0;
  76.  
  77.  if (keyCode == 40) {
  78. //alert("flecha abajo")
  79.     SelUsuario.BajaOpt ()
  80.  } else if (keyCode == 38) {
  81. //alert("flecha arriba")
  82.     SelUsuario.SubeOpt ()
  83.  
  84. } else if (keyCode == 13) {
  85.  
  86. for (var i = 0; i <= ref.length-1; i++) {
  87. if (ref[i].className == "seleccionado") { 
  88.  
  89.         document.getElementById("txt").value = ref[i].id;
  90.         if (obj.style.display == "block"); obj.style.display= "none";
  91.         break;
  92.         }
  93.  
  94.     }
  95.  
  96.     try{ // DOM;
  97.         ev.preventDefault();
  98.         }catch(e){ // iexplore;
  99.         ev.returnValue = false;
  100.         }
  101.  
  102. } else {
  103.  
  104.     if (str.length < 2) { 
  105.         //obj.innerHTML = "";
  106.         if (obj.style.display == "none")  obj.style.display= "none";
  107.                 else obj.style.display= "none"; 
  108.         return;
  109.     }
  110.     ajax = SelUsuario.creaAjax()
  111.     if (ajax==null) {
  112.         alert ("Tu navegador no soporta Ajax");
  113.         return;
  114.      } 
  115. var url="SelecUsuarios.asp?q="+escape(str) + "&variable=" +obj2;
  116.     ajax.open("GET",url,true);
  117.     ajax.onreadystatechange = SelUsuario.Despliega;
  118.     //ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
  119.             ajax.send(null);
  120.             return
  121. }
  122. },
  123.  
  124. Despliega: function () { 
  125. var obj = document.getElementById("contenedor");
  126.     
  127.         if (ajax.readyState==1 || ajax.readyState==2 || ajax.readyState==3) {
  128.                                         obj.innerHTML = "<p align='center'><img src='../images/cargando.gif' border='0px' widht='15px' height='15px'/></p>";
  129.             obj.style.display= "block";
  130.                 }
  131.  
  132.                 else if (ajax.readyState==4) {
  133.             if (ajax.status==200) {
  134.             obj.innerHTML = unescape(ajax.responseText);
  135.  
  136.             }else {
  137.                                     obj.innerHTML = "<p>Se ha producido un error</p>";
  138.             }
  139.  
  140.         if (obj.style.display == "none")  obj.style.display= "block";
  141.         }
  142. },
  143.  
  144. Seleccionar: function () {
  145. var ref = document.getElementById(this.id).getElementsByTagName('DIV');
  146. //alert(ref);
  147. for (var i = 0; i < ref.length; i++) {
  148.  
  149. SelUsuario.Evento(ref[i], 'click', function() {
  150. SelUsuario.Pegar(this.id);
  151. //alert(this.id);
  152. })   
  153.  
  154. SelUsuario.Evento(ref[i], 'mouseover',  function() {
  155. SelUsuario.Marcar(this.id);
  156. })
  157.  
  158. //SelUsuario.Evento(ref[i], 'mouseout',  function() {
  159. //SelUsuario.DesMarcar(this.id);
  160. //})
  161. }
  162. },
  163.  
  164. Pegar: function (valor) {
  165. //alert("el val " +valor);
  166. var obj = document.getElementById("contenedor")
  167.         document.getElementById("txt").value = valor;
  168.                 if (obj.style.display == "block"); obj.style.display= "none";       
  169. },
  170.  
  171.  
  172. Pegar2: function (ev) {
  173. var obj = document.getElementById("contenedor")
  174. var ref = obj.getElementsByTagName('DIV');
  175. var keyCode = document.layers ? ev.which : document.all ? event.keyCode : document.getElementById ? ev.keyCode : 0;
  176.  
  177. // enter 13 tab 9
  178. if ((keyCode == 13) || (keyCode == 9)) {
  179. //alert("enter")
  180.  
  181. for (var i = 0; i <= ref.length-1; i++) {
  182. if (ref[i].className == "seleccionado") { 
  183.  
  184.         document.getElementById("txt").value = ref[i].id;
  185.         //window.focus();
  186.         if (obj.style.display == "block"); obj.style.display= "none";
  187. break;
  188. //alert(ref[i].id);
  189.  
  190.  
  191. }
  192. }
  193.  
  194. if (keyCode == 13) {
  195.     try{ // DOM;
  196.         ev.preventDefault();
  197.         }catch(e){ // iexplore;
  198.         ev.returnValue = false;
  199.         }
  200. }
  201.  
  202.  
  203. }   
  204. },
  205.  
  206. BajaOpt: function() {
  207. var ref = document.getElementById("contenedor").getElementsByTagName('DIV');
  208. for (var i = 0; i <= ref.length-1; i++) {
  209. if (ref[i].className == "seleccionado") { 
  210. ref[i].className = "deseleccionado";
  211. if (i < ref.length-1){
  212. i++;
  213. }else{
  214. i = 0;
  215. }
  216. //alert("Largo: " +(ref.length-1)+ " Valor: " +i);
  217. ref[i].className = "seleccionado"
  218. }
  219. }
  220. },
  221.  
  222. SubeOpt: function() {
  223. var ref = document.getElementById("contenedor").getElementsByTagName('DIV');
  224. for (var i = 0; i <= ref.length-1; i++) {
  225. if (ref[i].className == "seleccionado") { 
  226. ref[i].className = "deseleccionado";
  227. if (i < ref.length && i > 0){
  228. i--;
  229. }else{
  230. i = ref.length-1;
  231. }
  232. //alert("Largo: " +(ref.length-1)+ " Valor: " +i);
  233. ref[i].className = "seleccionado"
  234. }
  235. }
  236. },
  237.  
  238. Marcar: function (id) {
  239. var selecionado = document.getElementById(id);
  240. var ref = document.getElementById("contenedor").getElementsByTagName('DIV');
  241. for (var i = 0; i <= ref.length-1; i++) {
  242. if (ref[i].id != id) { 
  243. ref[i].className = "deseleccionado";
  244. selecionado.className = "seleccionado";
  245. } 
  246. }
  247. },
  248.  
  249. //DesMarcar: function (id) {
  250. //var ref = document.getElementById(id);
  251. //alert(ref);
  252. //ref.className = "deseleccionado"
  253. //alert("el " +id);         
  254. //},
  255.  
  256.  
  257. Cerrar: function () {   
  258. var obj = document.getElementById("contenedor")
  259.             if (obj.style.display == "block"); obj.style.display= "none";   
  260.     
  261. }
  262. }
  263.  
  264. SelUsuario.Evento(window, 'load', SelUsuario.init); 
  265. </script> 
  266. </head>
  267. <body>
  268. <form method="post" action=""> 
  269. Nombre Usuario: <input name="txt" type="text" id="txt" tabindex="1" value="" size="40" autocomplete="off" />
  270. <div class="vink" style="margin:5px 0px 0px 10px">
  271. <div id="contenedor" class="capa" style="display:none;"></div></div> 
  272. Filtrar: <select id="stock" name="stock">
  273.          <option selected>Solo con Stock</option>
  274.          <option>Sin Stock</option>
  275.           </select><br>
  276.  
  277. <div class="vink" style="margin:5px 0px 0px 10px">
  278. <div id="campo" class="capa" style="display:none;"></div></div> 
  279.       
  280. <input type="submit" value="Enviar">
  281. </form>
  282. </body>
  283. </html>


SelecUsuarios.asp:

Código ASP: 
Ver original
  1. <%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
  2. <%' Option Explicit %>
  3. <% Response.Buffer=True %>
  4. <% On Error Resume Next  %>
  5. <%Response.charset="utf-8"%>
  6. <%
  7. Response.addHeader "pragma", "no-cache"
  8. Response.CacheControl = "Private"
  9. Response.Expires = -1000
  10. %>
  11. <%
  12. nombre = 0
  13.  
  14. usuario = CStr(Request.QueryString("q"))
  15. combox = CStr(Request.QueryString("variable"))
  16.  
  17. IF Len(usuario) >= 2 then
  18. set Cnn = Server.CreateObject("ADODB.Connection") 
  19. set rs = Server.CreateObject ("ADODB.Recordset")
  20. Cnn.Open Session("cnx")
  21.  
  22. SQL="Select descrip FROM Producto WHERE descrip LIKE '"&usuario&"%' and stock >0 ORDER BY Descrip asc"
  23. set rs = Cnn.Execute(SQL)
  24. If not rs.eof then
  25. registros = rs.getrows()
  26. Else 
  27. Response.Write "<p class=""deseleccionado""><strong>Sin resultados</strong></p>"
  28. Response.End ()
  29. End If
  30. rs.Close
  31.     set rs = nothing
  32.     Cnn.Close
  33.     set Cnn = nothing
  34. END IF
  35.  
  36. For i = 0 to Ubound(registros,2)
  37. If i = 0 then
  38. Response.Write "<div id="""& registros(nombre,i) &""" class=""seleccionado"">"& ResaltarSubStr(registros(nombre,i)) & "</div>"
  39. Else
  40. Response.Write "<div id="""& registros(nombre,i) &""" class="""">" & ResaltarSubStr(registros(nombre,i)) & "</div>"
  41. End If
  42. Next
  43.  
  44. ' ========= Funciones ===========
  45. Function ResaltarSubStr(texto)
  46. Dim objRegExp
  47.  
  48. Set objRegExp= New RegExp 
  49. objRegExp.IgnoreCase = True
  50. 'objRegExp.Global = True
  51.  
  52. objRegExp.Pattern = "\b("&usuario&")+(\w)"
  53. texto = objRegExp.Replace(texto, "<strong>$1</strong>$2") 
  54. Set objRegExp = Nothing
  55.  
  56.  ResaltarSubStr = texto
  57.  
  58. End Function
  59. ' ========= Fin Funciones ===========%>

El problema es que no recibo el valor seleccionado en el combobox....

De antemano muchas gracias

PD: Felices fiestas y año nuevo !!!