2008-10-16 5 views
3

J'ai un Google App Engine qui a un formulaire. Lorsque l'utilisateur clique sur le bouton Soumettre, l'opération AJAX sera appelée et le serveur affichera quelque chose à ajouter à la fin de la page même d'où elle provient. Comment, j'ai un template Django, et j'ai l'intention d'utiliser jquery. J'ai la vue suivante:Modèle Django avec jquery: Mise à jour Ajax sur la page existante

<html> 
<head> 
<title></title> 
<script type="text/javascript" src="scripts/jquery.js"></script> 
<script type="text/javascript" src="scripts/scripts.js"></script> 

</head> 
<body> 
welcome 
<form id="SubmitForm" action="/" method="POST"> 
<input type="file" name="vsprojFiles" /> 
<br/> 
<input type="submit" id="SubmitButton"/> 
</form> 

<div id="Testing"> 
{{thebest}} 
</div> 

</body> 
</html> 

Voici le script dans scripts.js:

$(function() { 
    $("#SubmitForm").click(submitMe); 
}); 

var submitMe = function(){ 
    //alert('no way'); 
    var f = $('#SubmitForm'); 
    var action = f.attr("action"); 
    var serializedForm = f.serialize(); 
    $.ajax({ 
     type: 'post', 
     data: serializedForm, 
     url: form_action, 
     success: function(result) { 
      $('#SubmitForm').after("<div><tt>" + 
            result + 
            "</tt></div>"); 
     } 
     }); 

    }; 

Et voici mon code du contrôleur:

from google.appengine.api import users 
from google.appengine.ext import webapp 
from google.appengine.ext import db 
from google.appengine.ext.webapp import template 
from google.appengine.api.urlfetch_errors import * 
import cgi 
import wsgiref.handlers 
import os 
import sys 
import re 
import urllib 
from django.utils import simplejson 

class MainPage(webapp.RequestHandler): 
    def get(self): 
     path = os.path.join(os.path.dirname(__file__), 'Index.html') 
     template_values={'thebest': 'thebest'} 
     tmplRender =template.render(path, template_values) 
     self.response.out.write(tmplRender) 
     pass 

    def Post(self): 
     print >>sys.__stderr__,'me posting' 
     result = 'grsgres' 
     self.response.out.write(simplejson.dumps(result)) 

Comme vous pouvez le voir, lorsque l'utilisateur clique Sur le bouton submit, la méthode de contrôleur Mainpage.post sera appelée.

Maintenant, je veux afficher le contenu de la variable 'résultat' juste après le formulaire, comment puis-je le faire? Sans pouvoir tester le code, quels sont vos résultats?

Répondre

2

Avez-vous vérifié les résultats renvoyés par l'appel AJAX? Je vous suggère d'exécuter Firefox avec Firebug et connectez-vous les résultats AJAX à la console Firebug pour voir ce que vous obtenez:

//... 
     success: function(result) { 
     console.log(result); 
     $('#SubmitForm').after("<div><tt>" + 
// ... 

Vous pouvez également utiliser le panneau net de Firebug pour voir ce qui est passé avant et en arrière.

En outre, qu'est-ce que "simplejson.dumps (résultat)" aboutit?

1

ici est un exemple de ma fonction de succès

success: function(json){ 
       $('#gallons_cont').html(json['gallons']); 
       $('#area_cont').html(json['area']); 
       $('#usage_cont').html(json['usage']) 
       $('#results_json').show('slow');    
      }, 

s'il vous plaît noter que vous ne devez déboguer en utilisant Firebug ou quelque chose de similaire car il pourrait y avoir un problème sérialisation qui jetteront et l'erreur, mais ne sera pas vieweable à moins vous utilisez quelque chose comme firebug ou implémentez l'erreur .ajax

Questions connexes