Jquery Autocomplete
597 views
Skip to first unread message
alons
Feb 16, 2011, 10:50:05 AM2/16/11
to Django-es
Hola Django-es, necesito ayuda con el Plugin de Jquery Autocomplete,
debido a que no logro entender la lógica de este y ponerlo a funcionar
en Django.
Mi situación es la siguiente: Deseo consultar una base de datos, tomar
esos valores y utilizarlos para autocompletar los datos del
formulario.
Tengo un formulario:
class C_F_RegDiario(forms.Form):
placa = forms.CharField(max_length=30)
identificacion = forms.CharField(max_length=30)
nombre = forms.CharField(max_length=30)
estacion = forms.CharField(max_length=30)
Cada uno de los campos que tiene este FORM deseo aplicarles en Plugin
de Jquery.
En el template tengo el siguiente código:
<script type="text/javascript" src="/site_media/j-ui/js/
jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/site_media/j-ui/js/jquery-
ui-1.8.8.custom.min.js"></script>
<script>
$(document).ready(function(){
$("#id_nombre").autocomplete{
'/accounts/profile',
{multiple: true, multipleSeparator: ', '}
);
});
Y en mi vista lo siguiente:
if request.POST.has_key('q'):
q = request.GET['q']
res =
C_Carrotanque_mula.objects.filter(placa=q).order_by("name")[:10]
return HttpResponse(res)
......
No estoy seguro de lo que estoy intentando hacer, por tal motivo
necesito que me indiquen (si es posible desde cero) como integrar este
Plugin con Django.
De antemano muchas gracias.
debido a que no logro entender la lógica de este y ponerlo a funcionar
en Django.
Mi situación es la siguiente: Deseo consultar una base de datos, tomar
esos valores y utilizarlos para autocompletar los datos del
formulario.
Tengo un formulario:
class C_F_RegDiario(forms.Form):
placa = forms.CharField(max_length=30)
identificacion = forms.CharField(max_length=30)
nombre = forms.CharField(max_length=30)
estacion = forms.CharField(max_length=30)
Cada uno de los campos que tiene este FORM deseo aplicarles en Plugin
de Jquery.
En el template tengo el siguiente código:
<script type="text/javascript" src="/site_media/j-ui/js/
jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/site_media/j-ui/js/jquery-
ui-1.8.8.custom.min.js"></script>
<script>
$(document).ready(function(){
$("#id_nombre").autocomplete{
'/accounts/profile',
{multiple: true, multipleSeparator: ', '}
);
});
Y en mi vista lo siguiente:
if request.POST.has_key('q'):
q = request.GET['q']
res =
C_Carrotanque_mula.objects.filter(placa=q).order_by("name")[:10]
return HttpResponse(res)
......
No estoy seguro de lo que estoy intentando hacer, por tal motivo
necesito que me indiquen (si es posible desde cero) como integrar este
Plugin con Django.
De antemano muchas gracias.
Miguel
Feb 16, 2011, 11:20:13 AM2/16/11
to djan...@googlegroups.com
Yo tengo un ejemplo usando el autocomplete de jQuery UI
html
<input id="search_box" type="text" autocomplete="off" name="search_box" onclick="setText(this)" value="BUSCAR..." onblur="getText(this)" />
javascript
jQuery("#search_box").keyup(function(){
var valor = $(this).attr('value');
var url = '/accounts/profile';
$.post(url, { valor:valor},
function(data){
var data1 = data.split(",");
$("#search_box").autocomplete({source: data1});
});
});
en views.py
def foo(request):
#haces tus consultas etc, etc
#y lo puedes regresar en un string todo junto separad por ","
#y en javascript lo spliteas para k kede en un arreglo
--
ISC. JMSM
html
<input id="search_box" type="text" autocomplete="off" name="search_box" onclick="setText(this)" value="BUSCAR..." onblur="getText(this)" />
javascript
jQuery("#search_box").keyup(function(){
var valor = $(this).attr('value');
var url = '/accounts/profile';
$.post(url, { valor:valor},
function(data){
var data1 = data.split(",");
$("#search_box").autocomplete({source: data1});
});
});
en views.py
def foo(request):
#haces tus consultas etc, etc
#y lo puedes regresar en un string todo junto separad por ","
#y en javascript lo spliteas para k kede en un arreglo
--
Ha recibido este mensaje porque está suscrito a Grupo "Grupo de Usuarios del Framework Django de habla hispana" de Grupos de Google.
Si quieres publicar en este grupo, envía un mensaje de correo
electrónico a djan...@googlegroups.com
Para anular la suscripción a este grupo, envíe un mensaje a django-es-...@googlegroups.com
Para obtener más opciones, visita este grupo en http://groups.google.com.bo/group/django-es.
--
ISC. JMSM
alons
Feb 16, 2011, 11:46:57 AM2/16/11
to Django-es
Es necesario hacer los formularios en HTML?.
Seria de gran ayuda si me enseñaras como queda tu Views completa,
puesto que en ese aspecto tengo mas dudas.
Muchas gracias
On Feb 16, 11:20 am, Miguel <figo10mex...@gmail.com> wrote:
> Yo tengo un ejemplo usando el autocomplete de jQuery UI
>
> html
>
> <input id="search_box" type="text" autocomplete="off" name="search_box"
> onclick="setText(this)" value="BUSCAR..." onblur="getText(this)" />
>
> javascript
>
> jQuery("#search_box").keyup(function(){
> var valor = $(this).attr('value');
> var url = '/accounts/profile';
> $.post(url, { valor:valor},
> function(data){
> var data1 = data.split(",");
> $("#search_box").autocomplete({source: data1});
> });
>
> });
>
> en views.py
>
> def foo(request):
> #haces tus consultas etc, etc
> #y lo puedes regresar en un string todo junto separad por ","
> #y en javascript lo spliteas para k kede en un arreglo
>
Seria de gran ayuda si me enseñaras como queda tu Views completa,
puesto que en ese aspecto tengo mas dudas.
Muchas gracias
On Feb 16, 11:20 am, Miguel <figo10mex...@gmail.com> wrote:
> Yo tengo un ejemplo usando el autocomplete de jQuery UI
>
> html
>
> <input id="search_box" type="text" autocomplete="off" name="search_box"
> onclick="setText(this)" value="BUSCAR..." onblur="getText(this)" />
>
> javascript
>
> jQuery("#search_box").keyup(function(){
> var valor = $(this).attr('value');
> var url = '/accounts/profile';
> $.post(url, { valor:valor},
> function(data){
> var data1 = data.split(",");
> $("#search_box").autocomplete({source: data1});
> });
>
> });
>
> en views.py
>
> def foo(request):
> #haces tus consultas etc, etc
> #y lo puedes regresar en un string todo junto separad por ","
> #y en javascript lo spliteas para k kede en un arreglo
>
Miguel
Feb 16, 2011, 12:29:34 PM2/16/11
to djan...@googlegroups.com
podemos probar un ejemplo.
Los formularios de django no te generan problema, siempre y cuando sepas que id utilizar.
en un html pon esto:
Sirve para la version de django 1.2.4, 1.2.3 (NO 1.2.5), jQuery y jQuery UI (las ultimas versiones)
ejemplo.html
<html>
<head>
<title> .:Prueba ajax + Django :. </title>
</head>
$.post(url, { valor:valor},
function(data){
var data1 = data.split(",");
$("#search_box").autocomplete({source: data1});
});
});
<body>
<label> Escribe algo para usar ajax-autocomplete </label>
<input id="search_box" type="text" autocomplete="off" name="search_box" />
</body>
</html>
en vistas views.py
if request.is_ajax():
valor_ajax = request.POST["valor"]
regresar = "php,python,java,c#,asp.net"
else:
regresar = "No,es,ajax"
en las urls agregas
Los formularios de django no te generan problema, siempre y cuando sepas que id utilizar.
en un html pon esto:
Sirve para la version de django 1.2.4, 1.2.3 (NO 1.2.5), jQuery y jQuery UI (las ultimas versiones)
ejemplo.html
<html>
<head>
<title> .:Prueba ajax + Django :. </title>
<script src="/media/js/jquery.js" type="text/javascript" charset="utf-8" ></script>
<script src="/media/js/jquery-ui-i18n.js" type="text/javascript" charset="utf-8"></script>
<script src="/media/js/jquery-ui.js" type="text/javascript" charset="utf-8"></script>
</head>
<script type="text/javascript" charset="utf-8">
jQuery(document).ready(function(){
jQuery("#search_box").keyup(function(){
var valor = $(this).attr('value');
var url = '/ejemplo/vista';
$.post(url, { valor:valor},
function(data){
var data1 = data.split(",");
$("#search_box").autocomplete({source: data1});
});
});
});
</script>
<body>
<label> Escribe algo para usar ajax-autocomplete </label>
<input id="search_box" type="text" autocomplete="off" name="search_box" />
</body>
</html>
en vistas views.py
from django.http import HttpResponsedef vista(request):
from django.shortcuts import render_to_response
def index(request):
return render_to_response('ejemplo/ejemplo.html.html')
if request.is_ajax():
valor_ajax = request.POST["valor"]
regresar = "php,python,java,c#,asp.net"
else:
regresar = "No,es,ajax"
return HttpResponse(regresar)en las urls agregas
(r'^index/$', 'ejemplo.views.index'),Espero te funcione
(r'^vista/$', 'ejemplo.views.vista'),
alons
Feb 16, 2011, 2:10:05 PM2/16/11
to Django-es
Listo ya estoy mas ubicado, pero sigo teniendo problemas con las
Views. Parte de mi codigo es:
def regConductor(request):
if request.is_ajax():
valor_ajax = request.POST["placa"]
#Se verifica si el formulario fue enviado utilizando el metodo
POST
if request.method == 'POST':
# Se utiliza el modelo del formulario "C_F_RegDiario" para
mostrarlo en pantalla, capturando los
#datos ingresados por el usuario
form = C_F_RegDiario(request.POST)
.
.
.
.
Ahora cada vez que entro a esa vista me redirige al mensaje:
"No,es,ajax".
Esa parte es la que mas me cuesta puesto que no comprendo como
enviarle los datos a Jquery para que los despliegue mientras que el
usuario digita la placa, el nombre o cualquier dato pedido en el
formulario.
aaah una duda el atributo autocomplete="off" es indispensable?
On 16 feb, 12:29, Miguel <figo10mex...@gmail.com> wrote:
> podemos probar un ejemplo.
>
> Los formularios de django no te generan problema, siempre y cuando sepas que
> id utilizar.
>
> en un html pon esto:
>
> Sirve para la version de django 1.2.4, 1.2.3 (NO 1.2.5), jQuery y jQuery UI
> (las ultimas versiones)
>
> ejemplo.html
>
> <html>
> <head>
> <title> .:Prueba ajax + Django :. </title>
>
> <script src="/media/js/jquery.js
> <view-source:http://127.0.0.1:8000/media/js/jquery.js>"
Views. Parte de mi codigo es:
def regConductor(request):
if request.is_ajax():
valor_ajax = request.POST["placa"]
#Se verifica si el formulario fue enviado utilizando el metodo
POST
if request.method == 'POST':
# Se utiliza el modelo del formulario "C_F_RegDiario" para
mostrarlo en pantalla, capturando los
#datos ingresados por el usuario
form = C_F_RegDiario(request.POST)
.
.
.
.
Ahora cada vez que entro a esa vista me redirige al mensaje:
"No,es,ajax".
Esa parte es la que mas me cuesta puesto que no comprendo como
enviarle los datos a Jquery para que los despliegue mientras que el
usuario digita la placa, el nombre o cualquier dato pedido en el
formulario.
aaah una duda el atributo autocomplete="off" es indispensable?
On 16 feb, 12:29, Miguel <figo10mex...@gmail.com> wrote:
> podemos probar un ejemplo.
>
> Los formularios de django no te generan problema, siempre y cuando sepas que
> id utilizar.
>
> en un html pon esto:
>
> Sirve para la version de django 1.2.4, 1.2.3 (NO 1.2.5), jQuery y jQuery UI
> (las ultimas versiones)
>
> ejemplo.html
>
> <html>
> <head>
> <title> .:Prueba ajax + Django :. </title>
>
> <script src="/media/js/jquery.js
> type="text/javascript" charset="utf-8" ></script>
> <script src="/media/js/jquery-ui-i18n.js
> <view-source:http://127.0.0.1:8000/media/js/jquery-ui-i18n.js>"
> <script src="/media/js/jquery-ui-i18n.js
> type="text/javascript" charset="utf-8"></script>
> <script src="/media/js/jquery-ui.js
> <view-source:http://127.0.0.1:8000/media/js/jquery-ui.js>"
> <script src="/media/js/jquery-ui.js
Miguel
Feb 16, 2011, 2:24:49 PM2/16/11
to djan...@googlegroups.com
1 .- aaah una duda el atributo autocomplete="off" es indispensable?
R-> Si, es una propiedad del input text no tiene nada que ver con el jQuery Autocomplete
Creo o pienso que te estas confundiendo un poco con los formularios y validarlos.
No nos vamos a llevar el formluario completo por ajax, solamente un campo el valor del campo de texto
por eso no es necesario usar "form = C_F_RegDiario(request.POST)"
fijate aki
var valor = $(this).attr('value');
var url = '/ejemplo/vista';
(1) $.post(url, { valor:valor},
function(data){
var data1 = data.split(",");
$("#search_box").autocomplete({source: data1});
*(1) url ="Es la url o vista a donde van" (Eso ya lo entendimos bien)
{valor:valor} = valor(1): Es el nombre de la variable de como se va a recueperar en el POST de la vista
valor(2): Es el valor introducido por el usuario en la caja de texto
.
Para debuger si no hace el ajax a la hora de entrar a la vista puedes hacer
print request.POST['valor']
si si te imprime algo, vamos bien.
Para regresarlo lo puedes regresar de muchas maneras. pero primero hay que ver si entra a tu vista.
Saludoss
R-> Si, es una propiedad del input text no tiene nada que ver con el jQuery Autocomplete
Creo o pienso que te estas confundiendo un poco con los formularios y validarlos.
No nos vamos a llevar el formluario completo por ajax, solamente un campo el valor del campo de texto
por eso no es necesario usar "form = C_F_RegDiario(request.POST)"
fijate aki
var valor = $(this).attr('value');
var url = '/ejemplo/vista';
function(data){
var data1 = data.split(",");
$("#search_box").autocomplete({source: data1});
});
{valor:valor} = valor(1): Es el nombre de la variable de como se va a recueperar en el POST de la vista
valor(2): Es el valor introducido por el usuario en la caja de texto
.
Para debuger si no hace el ajax a la hora de entrar a la vista puedes hacer
print request.POST['valor']
si si te imprime algo, vamos bien.
Para regresarlo lo puedes regresar de muchas maneras. pero primero hay que ver si entra a tu vista.
Saludoss
alons
Feb 16, 2011, 2:54:48 PM2/16/11
to Django-es
def regConductor(request):
if request.is_ajax():
valor_ajax = request.POST["placa"]
regresar = "php,python,java,c#,asp.net"
else:
regresar = "No,es,ajax"
return HttpResponse(regresar)
#Se verifica si el formulario fue enviado utilizando el metodo
POST
if request.method == 'POST':
# Se utiliza el modelo del formulario "C_F_RegDiario" para
mostrarlo en pantalla, capturando los
#datos ingresados por el usuario
form = C_F_RegDiario(request.POST)
#Se valida el contenido del formulario
if request.is_ajax():
valor_ajax = request.POST["placa"]
regresar = "php,python,java,c#,asp.net"
else:
regresar = "No,es,ajax"
return HttpResponse(regresar)
#Se verifica si el formulario fue enviado utilizando el metodo
POST
if request.method == 'POST':
# Se utiliza el modelo del formulario "C_F_RegDiario" para
mostrarlo en pantalla, capturando los
#datos ingresados por el usuario
form = C_F_RegDiario(request.POST)
if form.is_valid():
#Se asignan los valores a las variables del formulario
f_placa = form.cleaned_data['placa']
f_cedula = form.cleaned_data['identificacion']
f_nombrec = form.cleaned_data['nombre']
f_estacion = form.cleaned_data['estacion']
hora2 = datetime.datetime.now()
.
.
.
Lo anteriormente expuesto es un porcion mas amplia de la vista en
cuestion.
1- Esa vista se encarga de Registrar a los usuarios que realizan
visitas diarias, el formulario tiene 4 campos. La funcion de esa vista
es registrar pero no entiendo donde ubicar la parte que tu me
enviaste.... ???
Estoy un tanto desesperado con este asunto puesto que me tiene
atrasado :(, agradezco tu ayuda y disculpa la molestia
chipocrudos
Feb 17, 2011, 11:13:07 AM2/17/11
to Django-es
revisa la documentacion del plugin de jqueryui. este es el que uso.
http://jqueryui.com/demos/autocomplete/#remote-jsonp
uno de los problemas que puedes tener es tu retorno usa json es ligero
facil de usar.
http://www.json.org/json-es.html
de todas formas te mando un ejemplo espero te ayude:
Modelo:
class Localidad(models.Model):
cve_ent = models.IntegerField(max_length=10)
nom_ent = models.CharField(max_length=300)
nom_abr = models.CharField(max_length=10)
cve_mun = models.CharField(max_length=20)
nom_mun = models.CharField(max_length=300)
siglas_mun = models.CharField(max_length=20)
nommunabr27 = models.CharField(max_length=200)
cve_loc = models.CharField(max_length=20)
nom_loc = models.CharField(max_length=500)
cve_carta = models.CharField(max_length=20)
ambito = models.CharField(max_length=2)
def __unicode__(self):
return U'%s - %s - %s' %(self.nom_abr, self.cve_loc,
self.nom_loc)
Vista:
from django.utils import simplejson
from django.db.models import Q
#mas lo que requieras en tu vista
def localidad(request):
dic = []
if request.method == "GET":
if 'q' in request.GET:
buscalugar = request.GET['q']
if len(buscalugar) > 3:
consulta = ""
for x in buscalugar.split():
if consulta:
consulta = consulta &
Q(nom_loc__istartswith=buscalugar) | Q(nom_ent__istartswith=x)
else:
consulta =
Q(nom_loc__istartswith=buscalugar) | Q(nom_ent__istartswith=x)
datos =
Localidad.objects.filter(consulta).order_by("nom_loc")[:30]
if datos.count():
for x in datos:
dic.append({
'id':x.id,
'cve_ent':x.cve_ent,
'nom_ent':x.nom_ent,
'nom_abr':x.nom_abr,
'cve_mun':x.cve_mun,
'nom_mun':x.nom_mun,
'siglas_mun':x.siglas_mun,
'nommunabr27':x.nommunabr27,
'cve_loc':x.cve_loc,
'nom_loc':x.nom_loc,
'cve_carta':x.cve_carta,
'ambito':x.ambito,
})
return HttpResponse(simplejson.dumps(dic), mimetype='application/
json')
jquery:
$('#id_lugar').autocomplete({
source: function(request, response) {
$.ajax({
url: "/inegi/",
dataType: "json",
data: {
q: request.term
},
success: function(data) {
response($.map(data, function(item) {
return {
label: "<span style='color: green; font-size:
12;'> " + item.nom_loc + ", </span><span style='font-size:10;'>" +
item.nom_mun + ",</span><span style='font-size:11;'> " + item.nom_ent
+ "</span>",
value: item.nom_loc + ", " + item.nom_mun + ",
" + item.nom_ent,
}
}))
}
})
},
minLength: 4,
delay: 700,
});
Bueno con esto podras darte una idea de como me funciona. saludos.
> ...
>
> leer más »
http://jqueryui.com/demos/autocomplete/#remote-jsonp
uno de los problemas que puedes tener es tu retorno usa json es ligero
facil de usar.
http://www.json.org/json-es.html
de todas formas te mando un ejemplo espero te ayude:
Modelo:
class Localidad(models.Model):
cve_ent = models.IntegerField(max_length=10)
nom_ent = models.CharField(max_length=300)
nom_abr = models.CharField(max_length=10)
cve_mun = models.CharField(max_length=20)
nom_mun = models.CharField(max_length=300)
siglas_mun = models.CharField(max_length=20)
nommunabr27 = models.CharField(max_length=200)
cve_loc = models.CharField(max_length=20)
nom_loc = models.CharField(max_length=500)
cve_carta = models.CharField(max_length=20)
ambito = models.CharField(max_length=2)
def __unicode__(self):
return U'%s - %s - %s' %(self.nom_abr, self.cve_loc,
self.nom_loc)
Vista:
from django.utils import simplejson
from django.db.models import Q
#mas lo que requieras en tu vista
def localidad(request):
dic = []
if request.method == "GET":
if 'q' in request.GET:
buscalugar = request.GET['q']
if len(buscalugar) > 3:
consulta = ""
for x in buscalugar.split():
if consulta:
consulta = consulta &
Q(nom_loc__istartswith=buscalugar) | Q(nom_ent__istartswith=x)
else:
consulta =
Q(nom_loc__istartswith=buscalugar) | Q(nom_ent__istartswith=x)
datos =
Localidad.objects.filter(consulta).order_by("nom_loc")[:30]
if datos.count():
for x in datos:
dic.append({
'id':x.id,
'cve_ent':x.cve_ent,
'nom_ent':x.nom_ent,
'nom_abr':x.nom_abr,
'cve_mun':x.cve_mun,
'nom_mun':x.nom_mun,
'siglas_mun':x.siglas_mun,
'nommunabr27':x.nommunabr27,
'cve_loc':x.cve_loc,
'nom_loc':x.nom_loc,
'cve_carta':x.cve_carta,
'ambito':x.ambito,
})
return HttpResponse(simplejson.dumps(dic), mimetype='application/
json')
jquery:
$('#id_lugar').autocomplete({
source: function(request, response) {
$.ajax({
url: "/inegi/",
dataType: "json",
data: {
q: request.term
},
success: function(data) {
response($.map(data, function(item) {
return {
label: "<span style='color: green; font-size:
12;'> " + item.nom_loc + ", </span><span style='font-size:10;'>" +
item.nom_mun + ",</span><span style='font-size:11;'> " + item.nom_ent
+ "</span>",
value: item.nom_loc + ", " + item.nom_mun + ",
" + item.nom_ent,
}
}))
}
})
},
minLength: 4,
delay: 700,
});
Bueno con esto podras darte una idea de como me funciona. saludos.
>
> leer más »
alons
Feb 18, 2011, 4:25:00 PM2/18/11
to Django-es
Adapte ese codigo a mi aplicacion pero no logre hacerlo funcionar. Lo
particular es que no me muestra ningun error simplemente no
AUTOCOMPLETA, les envio el codigo para recibir ayudas.
URLs, buscar_placa es la vista que deberia obtener los datos para
autocompletar.
urlpatterns = patterns('',
(r'^buscar_placa/$', buscar_placa),
(r'^site_media/(?P<path>.*)$',
'django.views.static.serve',
{'document_root': '/home/alons/workspace/
GestionDC/templates/T_general', 'show_indexes': True}),
(r'^admin/', include(admin.site.urls)),
VISTA.
def buscar_placa(request):
if len(busca_placa) > 3:
consulta = ""
for x in busca_placa.split():
if consulta:
consulta = consulta &
Q(nom_loc__istartswith=busca_placa) | Q(nom_ent__istartswith=x)
else:
consulta = Q(nom_loc__istartswith=busca_placa)
| Q(nom_ent__istartswith=x)
datos =
C_Carrotanque_mula.objects.filter(consulta).order_by("id")[:30]
'es_mula':x.es_mula,
'placa':x.placa,
'tanque_o_r':x.tanque_o_r,
'empresaTrans':x.empresaTrans,
class C_Carrotanque_mula(models.Model):
esMula = (
('1', 'Si'),
('0', 'No'),
)
es_mula = models.CharField(max_length=2, choices=esMula) # Si este
campo esta en 1, sera mula si es 0, sera carrotanque
placa = models.CharField(max_length=20)
tanque_o_r = models.ManyToManyField('C_Tanque_R', blank=True)
empresaTrans = models.CharField(max_length=50)
def __unicode__(self):
return self.placa
TEMPLATE. Este template es el que se utiliza para REGISTRAR LOS DATOS
que quiero autocompletar
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Gestión - DC</title>
<link rel="stylesheet" type="text/css" href="/site_media/style.css" />
<link type="text/css" href="/site_media/j-ui/css/ui-lightness/jquery-
ui-1.8.8.custom.css" rel="Stylesheet" />
jquery:$('#id_placa').autocomplete({
source: function(request, response) {
$.ajax({
url: "/appSoft/buscar_placa/",
</head>
<body>
<div id="main_container">
<div id="header">
<div class="logo"><img src="/site_media/images/logo.png"
border="0" alt="" title="" /></div>
</div>
<div class="menu">
<ul>
<li class="selected"><a href="/accounts/profile/">Registrar
Conductor</a></li>
<li><a href="/l_conductor/">Listado de Conductores</a></li>
<li><a href="/historico/">Histórico</a></li>
<li><a href="/accounts/logout/">Cerrar Sesión</a></li>
</ul>
</div>
<div class="center_content">
<div class="center_left">
<div class="title_welcome"><span class="red">Gestión de
datos de distribución de combustible</span> </div>
<br>
<br>
<form action="" method="post">
<table>
{{ form.as_table }}
</table>
<br>
<br>
<input type="submit" value="Guardar" />
</form>
</div>
<div class="center_right">
<div class="software_box"><img src="/site_media/images/3dbox.gif"
alt="" title="" /></div>
</div>
<div class="center_left">
</div>
<div class="clear"></div>
</div>
<div id="footer">
<div class="left_footer"><a href="#">Inicio</a> <a href="#">Politicas
de Privacidad</a></div>
<div class="right_footer"><a href="http://csstemplatesmarket.com"
target="_blank"><img
src="/site_media/images/csstemplatesmarket.gif" border="0" alt=""
title="" /></a></div>
</div>
</div>
</body>
</html>
> > > > > });...
>
> leer más »
particular es que no me muestra ningun error simplemente no
AUTOCOMPLETA, les envio el codigo para recibir ayudas.
URLs, buscar_placa es la vista que deberia obtener los datos para
autocompletar.
urlpatterns = patterns('',
(r'^buscar_placa/$', buscar_placa),
(r'^site_media/(?P<path>.*)$',
'django.views.static.serve',
{'document_root': '/home/alons/workspace/
GestionDC/templates/T_general', 'show_indexes': True}),
(r'^admin/', include(admin.site.urls)),
VISTA.
def buscar_placa(request):
dic = []
if request.method == "GET":
if 'q' in request.GET:
busca_placa = request.GET['q']
if request.method == "GET":
if 'q' in request.GET:
if len(busca_placa) > 3:
consulta = ""
for x in busca_placa.split():
if consulta:
consulta = consulta &
else:
consulta = Q(nom_loc__istartswith=busca_placa)
| Q(nom_ent__istartswith=x)
datos =
C_Carrotanque_mula.objects.filter(consulta).order_by("id")[:30]
'es_mula':x.es_mula,
'placa':x.placa,
'tanque_o_r':x.tanque_o_r,
'empresaTrans':x.empresaTrans,
})
return HttpResponse(simplejson.dumps(dic), mimetype='application/
json')
MODELO
return HttpResponse(simplejson.dumps(dic), mimetype='application/
json')
class C_Carrotanque_mula(models.Model):
esMula = (
('1', 'Si'),
('0', 'No'),
)
es_mula = models.CharField(max_length=2, choices=esMula) # Si este
campo esta en 1, sera mula si es 0, sera carrotanque
placa = models.CharField(max_length=20)
tanque_o_r = models.ManyToManyField('C_Tanque_R', blank=True)
empresaTrans = models.CharField(max_length=50)
def __unicode__(self):
return self.placa
TEMPLATE. Este template es el que se utiliza para REGISTRAR LOS DATOS
que quiero autocompletar
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Gestión - DC</title>
<link rel="stylesheet" type="text/css" href="/site_media/style.css" />
<link type="text/css" href="/site_media/j-ui/css/ui-lightness/jquery-
ui-1.8.8.custom.css" rel="Stylesheet" />
<script type="text/javascript" src="/site_media/j-ui/js/
jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/site_media/j-ui/js/jquery-
ui-1.8.8.custom.min.js"></script>
<script type="text/javascript" charset="utf-8">
jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/site_media/j-ui/js/jquery-
ui-1.8.8.custom.min.js"></script>
jquery:$('#id_placa').autocomplete({
source: function(request, response) {
$.ajax({
url: "/appSoft/buscar_placa/",
dataType: "json",
data: {q: request.term},
success: function(data) {
response($.map(data, function(item) {
return {
label: "<span style='color: green; font-size:
12;'> " + item.nom_loc + ", </span><span style='font-size:10;'>" +
item.nom_mun + ",</span><span style='font-size:11;'> " + item.nom_ent
+ "</span>",
value: item.nom_loc + ", " + item.nom_mun + ",
" + item.nom_ent,
}
}))
}
})
},
minLength: 4,
delay: 700,
});
</script>
data: {q: request.term},
success: function(data) {
response($.map(data, function(item) {
return {
label: "<span style='color: green; font-size:
12;'> " + item.nom_loc + ", </span><span style='font-size:10;'>" +
item.nom_mun + ",</span><span style='font-size:11;'> " + item.nom_ent
+ "</span>",
value: item.nom_loc + ", " + item.nom_mun + ",
" + item.nom_ent,
}
}))
}
})
},
minLength: 4,
delay: 700,
});
</head>
<body>
<div id="main_container">
<div id="header">
<div class="logo"><img src="/site_media/images/logo.png"
border="0" alt="" title="" /></div>
</div>
<div class="menu">
<ul>
<li class="selected"><a href="/accounts/profile/">Registrar
Conductor</a></li>
<li><a href="/l_conductor/">Listado de Conductores</a></li>
<li><a href="/historico/">Histórico</a></li>
<li><a href="/accounts/logout/">Cerrar Sesión</a></li>
</ul>
</div>
<div class="center_content">
<div class="center_left">
<div class="title_welcome"><span class="red">Gestión de
datos de distribución de combustible</span> </div>
<br>
<br>
<form action="" method="post">
<table>
{{ form.as_table }}
</table>
<br>
<br>
<input type="submit" value="Guardar" />
</form>
</div>
<div class="center_right">
<div class="software_box"><img src="/site_media/images/3dbox.gif"
alt="" title="" /></div>
</div>
<div class="center_left">
</div>
<div class="clear"></div>
</div>
<div id="footer">
<div class="left_footer"><a href="#">Inicio</a> <a href="#">Politicas
de Privacidad</a></div>
<div class="right_footer"><a href="http://csstemplatesmarket.com"
target="_blank"><img
src="/site_media/images/csstemplatesmarket.gif" border="0" alt=""
title="" /></a></div>
</div>
</div>
</body>
</html>
>
> leer más »
chipocrudos
Feb 21, 2011, 8:30:32 AM2/21/11
to Django-es
ya nada mas falta que cheques lo que retorna json, es decir si tu
diccionario lo que trae es
$.ajax({url: "/appSoft/buscar_placa/",
dataType: "json",
data: {q: request.term},
success: function(data) {
response($.map(data, function(item) {
return {
label: "<span style='color: green; font-
size:
12;'> " + item.id + ", </span><span style='font-size:10;'>" +
item.es_mula + ",</span><span style='font-size:11;'> " +
item.placa
+ "</span>",
value: item.id + ", " + item.es_mula + ", " + item.placa,
Saludos
> ...
>
> leer más »
diccionario lo que trae es
'id':x.id,
'es_mula':x.es_mula,
'placa':x.placa,
'tanque_o_r':x.tanque_o_r,
'empresaTrans':x.empresaTrans,
la forma que tienes que presentarlo es diferente
'es_mula':x.es_mula,
'placa':x.placa,
'tanque_o_r':x.tanque_o_r,
'empresaTrans':x.empresaTrans,
$.ajax({url: "/appSoft/buscar_placa/",
dataType: "json",
data: {q: request.term},
success: function(data) {
response($.map(data, function(item) {
return {
label: "<span style='color: green; font-
size:
item.es_mula + ",</span><span style='font-size:11;'> " +
item.placa
+ "</span>",
value: item.id + ", " + item.es_mula + ", " + item.placa,
}
}))
}
})
},
minLength: 4,
delay: 700,
});
para dar un ejemplo.
}))
}
})
},
minLength: 4,
delay: 700,
});
Saludos
>
> leer más »
Axel Díaz
Nov 10, 2012, 6:47:47 PM11/10/12
to djan...@googlegroups.com
Revisa esto a ver si te funciona: https://github.com/twidi/django-ajax-select
--
Axel Díaz
San Juan de los Morros - Edo. Guárico
diaz....@gmail.com
Linux User #531976
El 10 de noviembre de 2012 00:08, Serena <sereni...@gmail.com> escribió:
Hola, que tal? He estado tratando de integrar un widget de autocompletado a mi projecto de django, pero no he tenido éxito. Sería posible que me pasaran un ejemplo completo, que haga el autocompletado de uno de los campos de un modelos en un formulario. Muchas gracias de antemano por su ayuda.
--
Ha recibido este mensaje porque está suscrito a Grupo "Grupo de Usuarios del Framework Django de habla hispana" de Grupos de Google.
Si quieres publicar en este grupo, envía un mensaje de correo
electrónico a djan...@googlegroups.com
Para anular la suscripción a este grupo, envíe un mensaje a django-es-...@googlegroups.com
Para obtener más opciones, visita este grupo en http://groups.google.com.bo/group/django-es.
Axel Díaz
San Juan de los Morros - Edo. Guárico
diaz....@gmail.com
Linux User #531976
Usuario Canaima #1057
Huella de clave = D580 D9A2 41B0 412A E9A5 D778 DB05 8F60 BED7 96FB
Carlos Luis Jordán Murillo
Nov 10, 2012, 6:50:41 PM11/10/12
to djan...@googlegroups.com
Serena que error te sale utilizas firebug???Saludos
Carlos Jordán
Ingeniero
Escuela Superior Politécnica del Litoral
Ciencias Computacionales especialización Sistemas de Información
Carlos Jordán
Ingeniero
Escuela Superior Politécnica del Litoral
Ciencias Computacionales especialización Sistemas de Información
Reply all
Reply to author
Forward
0 new messages