AJAX - problema para mostrar busquedas en mi buscador json

   
Vista:

problema para mostrar busquedas en mi buscador json

Publicado por Sam (7 intervenciones) el 02/03/2016 23:18:56
Hola amigas y amigos,, veran tengo un problema con un codigo que tengo.


Intento hacer un buscador que nada mas meter una letra en el input me muestra palabras que la contengan de manera automatica con ajax.

Y creo que todo esta bien pero en mi archivo llamado: "222---script.js" me dice:

var dato , esta "unused", osea que no esta siendo usada esa variable y claro deberia hacerlo.

Miren este es el codigo:

archivo 1 llamado: "222---index_form_buscador_post_bbddarray_json.php":

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<!DOCTYPE html>
 
<html lang="es">
 
	<head>
			<meta charset="utf-8" />
			<title>Buscador ajax + jquery + php</title>
	</head>
 
 
	<body>
 
		<h1>Buscador ajax + jquery + php</h1>
 
		<form>
 
			<input type="buscador" name="buscador" id="buscador" placeholder="Nombre o Info" />
 
		</form>
 
		<div id="elresultado"></div>
 
		<script type="text/javascript" src="jquery-1.10.1.min.js"></script>
		<!--<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>-->
		<script src="222---script.js"></script>
 
	</body>
 
</html>



archivo 2 llamado "222---script.js"; (que aqui es donde esta la variable no usada)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
$('#buscador').keyup(function()
{
	var dato = $('#buscador').val();
 
	//Expresion regular que ignora mayusculas o minusculas
	var myExp = new RegExp(dato_a_buscar, 'i');
 
	//$.getJSON('2---data.php?callback=?', function(dato)
	$.getJSON('222---data.json', function(dato)
 
	{
		var salida = '<ul>';
 
		$.each(dato, function(clave, valor)
		{
 
			if((valor.name.search(myExp) != -1))
			{
				salida +='<li>';
				salida +='<h2>' + valor.name + '</h2>';
				//salida +='<img src="images/' + valor.shortname + '_tn.jpg" alt="'+ valor.name +'" />';
				//salida +='<p>' + valor.bio + '</p>';
				salida +='</li>';
			}
		});
 
 
		salida += '</ul>';
 
 
		$('#elresultado').html(salida);
	});
});


archivo 3 llamado "222---data.json";

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
[
{
"name":"Barot Bellingham",
"shortname":"Barot_Bellingham",
"reknown":"Royal Academy of Painting and Sculpture",
"bio":"Barot has just finished his final year at The Royal Academy of Painting and Sculpture, where he excelled in glass etching paintings and portraiture. Hailed as one of the most diverse artists of his generation, Barot is equally as skilled with watercolors as he is with oils, and is just as well-balanced in different subject areas. Barot's collection entitled 'The Un-Collection' will adorn the walls of Gilbert Hall, depicting his range of skills and sensibilities - all of them, uniquely Barot, yet undeniably different"
},
{
"name":"Jonathan G. Ferrar II",
"shortname":"Jonathan_Ferrar",
"reknown":"Artist to Watch in 2012",
"bio":"The Artist to Watch in 2012 by the London Review, Johnathan has already sold one of the highest priced-commissions paid to an art student, ever on record. The piece, entitled Gratitude Resort, a work in oil and mixed media, was sold for $750,000 and Jonathan donated all the proceeds to Art for Peace, an organization that provides college art scholarships for creative children in developing nations"
}
 
]


gracias de antemano.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Vainas

problema para mostrar busquedas en mi buscador json

Publicado por Vainas (71 intervenciones) el 03/03/2016 09:33:25
Buenas:

1
var dato = $('#buscador').val();

no lo estas usando en ningun sitio. ese dato no tiene nada que ver con:

1
$.getJSON('222---data.json', function(dato)

ya que esa function es llamada por el propio ajax cuando regresa la peticion http al navegador.

Para hacer un "autocomplete" en jQuery y ajax puedes usar este: https://www.devbridge.com/sourcery/components/jquery-autocomplete/

Es algo que ya esta hecho y lo puedes reutilizar.

Sobre tu codigo piensa que si quieres hacer un autocomplete tienes que enviar al servidor ese valor algo asi:

1
2
var dato1 = $('#buscador').val();
	$.getJSON('2---data.php?valor='+dato1, function(dato)

Espero que te ayude. Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar