2010-12-12 49 views
1

J'ai réussi à rendre mon premier formulaire django dans un onglet extjs. Les données du formulaire s'affichent correctement et la validation du formulaire semble fonctionner correctement.Rendu de formulaires Django dans un onglet EXTJS

Mon problème est que django veut rendre toute la nouvelle page, pas seulement repousser les résultats dans le même onglet. Je pense que mon application fonctionnera mieux si je peux garder tout cela dans un seul onglet sans le rendu complet de la page. Contexte: J'ai utilisé l'exemple de l'onglet AJAX EXTJS pour que cela fonctionne. Alors le seul problème est que l'exemple n'a pas eu plusieurs appels get/post rendus dans le même onglet, donc je ne sais pas comment faire cela.

Comment conserver les résultats des données POST dans l'onglet EXTJS? Aussi, des experts qui développent beaucoup de ces applications, est-ce que j'utilise le modèle correct ici?

Voilà ma mise en page de base:

fichier: grid.js - Builds une grille ExtJS, de l'édition 'utilisateur clique icône qui fait un appel à django pour saisir la forme d'édition.

var createColModel = function (finish, start) { 

    var columns = [{ 
     dataIndex: 'pk', 
     header: 'Student ID', 
     filterable: true 
     //,filter: {type: 'numeric'} 
    }, { 
    // ... More column data here 
    },{ 
     header: 'Actions', 
     id: 'actions', 
     xtype: 'actioncolumn', 
     width: 50, 
     items: [{ 
      icon : '/site_media/icons/application_edit.png', 
      tooltip: 'Edit Record', 
      handler: function(grid, rowIndex, colIndex) { 
       var rec = studentStore.getAt(rowIndex); 
       mainTabPnl.add({ 
        title: rec.get('fields.first_name') + ', ' + rec.get('fields.last_name'), 
        iconCls: 'tabs', 
        autoLoad: {url: '/app/edit_student/' + rec.get('pk')}, 
        closable:true 
       }).show(); 
      } 
     }] 
    }]; 

fichier: views.py

def edit_student_view(request, sid): 
    print "Edit Student: " + sid 
    student = Student.objects.get(pk=sid) 
    if request.method == 'POST': 
    form = StudentProfileForm(request.POST, instance=student) 
    if form.is_valid(): 
     student=form.save() 
     message="Edit successful" 
     c = {'form' : form, 'student':student, 'message':message} 
     return render_to_response('app/edit_student.html', c, context_instance=RequestContext(request)) 
    else: 
     message = "The form contains errors." 
     c = {'form':form, 'student':student, 'message':message} 
     // Problem: This is now rendered as the whole page, not inside the tab 
     return render_to_response('app/edit_student.html', c, context_instance=RequestContext(request)) 
    else: 
    form = StudentProfileForm(instance=student) 
    c = {'form':form, 'student':student} 
    //Initial GET: renders in correct EXTJS window. 
    return render_to_response('app/edit_student.html', c, context_instance=RequestContext(request)) 

fichier: edit_student.html - rend la forme django

{% block mainpanel %} 

{% if form.errors %} 
    <p>The Registration form had errors. Please try again.</p> 
{% endif %} 

{% if form %} 
<form action="/app/edit_student/{{student.student_id}}/" method="post"> 
    <table> 
    {{ form.as_table }} 
    </table> 
    <input type="submit" value="Submit" /> 
</form> 
{%endif%} 

{% endblock %} 

Répondre

1

Si vous voulez le garder dans l'onglet puis vous devrez renoncer aux mécanismes de formulaire HTML standard et définir à la place l'événement onclick sur un bouton pour p Ériger un POST via AJAX.

+0

Est-ce que onClick peut toujours afficher le formulaire django? Connaissez-vous des exemples de ce comportement? – codingJoe

+0

Il ne rend pas le formulaire. Renvoyez un fragment HTML de la vue et placez-le. –