Sei sulla pagina 1di 2

AJAX en Django usando jQuery Recientemente he creado un proyecto paralelo para explorar algunas reas de alta tecnologa que

quera conocer ms a fondo. Una de esas reas era cmo implementar AJAX en Django usando jQuery. En pocas palabras, el sitio, TruthTruthLie.me (update 05.03.2013: el sitio est temporalmente fuera de lnea como cambiar mi Facebook Connect aplicacin de django-socialregistration a django-social-auth) presenta tres hechos acerca de usted y desafa a tus amigos a haga clic en el que es una mentira. Cuando su amigo haga clic sobre un hecho, yo enviar la fact_id hecho clic a travs de AJAX a una url. A Django rutas patrn de URL el clic a una vista donde puedo comprobar lo que "escribe" el hecho es devolver el resultado a travs de JSON al cliente y actualizar la pgina de forma dinmica y sin actualizar la pgina. A continuacin se presentan la pgina simplificada, patrn de url y la vista que utilizo para hacer esto. Tambin puede visitar mi sencilla pero trabajando AJAX en Django usando jQuery pgina de demostracin. ajax_in_django.html:
view sourceprint?

01.<html> 02.<head> 03.<script type="text/javascript" 04.src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"> 05.</script> 06.<script type="text/javascript"> 07.$(document).ready(function() { 08.$('.fact').bind('click', function () { 09.$.get("/test/"+this.id+"/", function(data) { 10.if (data.fact_type=="T") { 11.guess_result="This fact is true! " + data.fact_note; 12.} else { 13.guess_result="This fact is false! " + data.fact_note; 14.} 15.$('#result')[0].innerHTML=guess_result; 16.}); 17.}); 18.}); 19.</script> 20.</head> 21.<body> 22.<div id="1" class="fact">I love bugs</div> 23.<div id="2" class="fact">I love hugs</div> 24.<div id="3" class="fact">I love pugs</div> 25.<div id="result">Click on the lie!</div> 26.</body> 27.</html>

url.py:
view sourceprint?

1.# Process a quiz guess 2.url(r'^test/(?P<fact_id>\d+)/$', 3.quiz_guess,

4.name='quiz_guess'),

views.py:
view sourceprint?

01.from django.utils import simplejson 02. 03.def quiz_guess(request, fact_id): 04.message = {"fact_type": "", "fact_note": ""} 05.if request.is_ajax(): 06.fact = get_object_or_404(Fact, id=fact_id) 07.message['fact_type'] = fact.type 08.message['fact_note'] = fact.note 09.else: 10.message = "You're the lying type, I can just tell." 11.json = simplejson.dumps(message) 12.return HttpResponse(json, mimetype='application/json')

Esto, por supuesto, asume que ha definido un modelo llamado "Realidad", un hecho que tiene un "tipo" y "nota", y que ha creado los tres hechos mencionados y tienen los ID de 1, 2 y 3. En mi punto de vista real, me hago algunas otras cosas como guardar el clic y comprobar si es el primero en el concurso. Asimismo, en la pgina que haga ms de actualizar el texto de la div "nmero". Tambin puedo actualizar los facepiles de los guessors correctas e incorrectas, cambie el porcentaje de los que acert / mal y cambiar el fondo del hecho clic. Si quieres ver AJAX en Django usando jQuery tal como se aplica plenamente, por favor, seguir adelante y crear una prueba de muestra por s mismo yendo aqu y haciendo clic en "Haga su propio concurso". Usted tendr que conectarse al sitio a travs de Facebook para crear una prueba, pero si esto te hace sentir incmodo, puede conectar temporalmente, ver cmo funciona todo y luego ir a "Facebook> Cuenta> Configuracin de privacidad> Aplicaciones y sitios web> Editar su configuracin "y revocar el privilegio de conexin.

Potrebbero piacerti anche