JS, JSON, AJAX, VRAPTOR, YUI para tentar um AUTOCOMPLETE

0 respostas
wag_ferreira

Fala ae galera.

To fazendo um exemplo do YUI - The Yahoo! User Interface Library, para um autocomplete.

Consegui fazer funcionar direitinho, tudo beleza, mas to com problemas de funções javascript.

Meu HTML.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<%@page contentType="text/html" pageEncoding="LATIN1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<html>
    <head>
        <title>Pagina de Testes</title>   
   
		<link rel="stylesheet" type="text/css" href="/sgc/js/yui/build/fonts/fonts-min.css" />
		<link rel="stylesheet" type="text/css" href="/sgc/js/yui/build/autocomplete/assets/skins/sam/autocomplete.css" />
		<script type="text/javascript" src="/sgc/js/yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
		<script type="text/javascript" src="/sgc/js/yui/build/animation/animation-min.js"></script>
		<script type="text/javascript" src="/sgc/js/yui/build/datasource/datasource-min.js"></script>
		<script type="text/javascript" src="/sgc/js/yui/build/autocomplete/autocomplete-min.js"></script>
		<script type="text/javascript" src="/sgc/js/prototype-1.6.0.2.js"></script>
		<!--  <script type="text/javascript" src="/sgc/js/data.js"></script>-->
		
		<style type="text/css"> 
			#myAutoComplete {
			    width:15em; /* set width here or else widget will expand to fit its container */
			    padding-bottom:2em;
			}
			#mySubmit {
			    position:absolute; left:15em; margin-left:1em; /* place the button next to the input */
			}
		</style>	
    </head>
    <body class=" yui-skin-sam">
		<form id="myForm" action="#">
		
			<div id="myAutoComplete">
				<input id="myInput" type="text">
				<div id="myContainer"></div>
			</div>

		</form>
		<script type="text/javascript"> 

		var v = new Ajax.Request('/sgc/testeForm.selectAjax.ajax.logic', {
				  method:'get',
				  onSuccess: function(transport){
						var json = transport.responseText.evalJSON();
						return json;
				   }
			});
		
		alert(v);
		
		YAHOO.example.BasicLocal = function() {
		    // Use a LocalDataSource

		    var oDS = new YAHOO.util.LocalDataSource();
		    // Optional to define fields for single-dimensional array
		    oDS.responseSchema = {fields : ["name"]};

		    // Instantiate the AutoComplete
		    var oAC = new YAHOO.widget.AutoComplete("myInput", "myContainer", oDS);
		    oAC.prehighlightClassName = "yui-ac-prehighlight";
		    oAC.useShadow = true;
		    
		    return {
		        oDS: oDS,
		        oAC: oAC
		    };
		}();

		</script>
    </body>
</html>

A minha função de request ajax esta funcionando legal, mas estou com problemas em pegar o json, no caso eu tenho meu logic, e ele me retorna uma lista, e com estalista retornada no método onSuccess eu pego e faço um to json. Se eu der um alert ali dentro do meu json, ele joga na tela o certo. Beleza vem todos os meus registros, mas se eu do um alerto da minha variavel ‘v’ não vem nada.

Quero saber como eu faço para pegar esse json. Eu preciso pegar ele e largar dentro do metodo do YUI ‘new YAHOO.util.LocalDataSource();’.

Se alguem ja fez algo parecido, algo do tipo, me ajudem. To quebrando a cabeça a alguns dias ja…

Feito

Criado 7 de abril de 2009
Respostas 0
Participantes 1