2013-02-28 13 views
6

Ich habe ein Problem beim Senden eines Formulars mit Ajax. Ich habe ein Formular, das ich mit einem anderen Formular asynchron beim Klicken auf die nächste Schaltfläche ersetzen möchte.django ajax Anfrage

Hier das Skript

$(document).ready(function() { 
    $('#MY_FORM').submit(function() { 
     $.ajax({ 
      data: $(this).serialize(), 
      type: $(this).attr('method'), 
      url: $(this).attr('action'), 
      success: function(response) { 
       $('#FORM_DIV').html(response); 
      } 
     }); 
     return false; 
    }); 
}); 

form.py

class CountyForm(forms.Form): 
    county = forms.ModelChoiceField(queryset=County.objects.all(), 
       empty_label='---Select a county---', required=False) 
    other = forms.CharField(required=False) 

    def __init__(self, *args, **kwargs): 
     super(CountyForm, self).__init__(*args, **kwargs) 
     self.helper = FormHelper(self) 
     self.helper.html5_required = True 
     self.helper.form_id = 'MY_FORM' 
     self.helper.add_input(Submit('next', 'Next', css_class='classfinish')) 
     self.helper.layout = Layout('county','other') 


class WardForm(forms.Form): 
    ward = forms.ModelChoiceField(queryset=Ward.objects.all(), 
      empty_label='Select a ward') 
    other = forms.CharField() 

    def __init__(self, *args, **kwargs): 
     super(WardForm, self).__init__(*args, **kwargs) 
     self.helper = FormHelper(self) 
     self.helper.html5_required = True 
     self.helper.add_input(Submit('save', 'Finish')) 
     self.helper.add_input(Submit('cancel', 'Cancel')) 
     self.helper.layout = Layout('ward','other') 

Ansichten

def location(request): 
    if request.is_ajax() : 
     wardform = WardForm() 
     return HttpResponse(wardform) 
    countyform = CountyForm() 
    c = {} 
    c.update(csrf(request)) 
    return render(request,'location.html', {'countyform': countyform}) 

I will, wenn ich nächste Schaltfläche in der Kreisform klicken, um die Station Form zu erscheinen .

+3

Was ist Ihre Frage? Sie verpassen jedoch ein Zitat nach '# FORM_DIV'. –

+0

Ihr JS hat einen Syntaxfehler – Blender

+1

@Pavel war ein Tippfehler, danke. – Alexxio

Antwort

1

Dies könnte auf zwei Arten gelöst werden, ich werde FormWizard nicht abdecken, aber ich gebe Ihnen den Link zu der Dokumentation, die wirklich gut ist.

Meine Empfehlung ist, dass Sie für einen FormWizard gehen sollten (je nachdem, welche Version von Django Sie haben), aber ich denke, dass es nach 1.2 in Django migriert wurde, aber zitieren Sie mich nicht darauf.

In Ihrer derzeitigen misslichen Lage sollten Sie etwas in diesem Sinne tun.

$(document).ready(function() { 
    $('#MY_FORM').submit(function() { 
     $.ajax({ 
      data: $(this).serialize(), 
      type: $(this).attr('method'), 
      url: $(this).attr('action'), 
      success: function(response) { 
       $('#FORM_DIV').load('/some/url/to/a/wardform'); //new code 
      } 
     }); 
     return false; 
    }); 
}); 

views.py

def ward_form_renderer(request): 
    if request.is_ajax(): 
     ward_form = WardForm() 
     #depending on version of django 
     context = {'wardform': ward_form} 
     context.update(csrf(request)) 
     render(request, 'wardform_template', c) 

Was wird dies tun, ist, dass es eine neue HTML-Seite mit einer gerenderten Form aus Ihrer Django Ansicht ziehen wird und anzeigen. Was Sie dann getan haben, ist ein FormWizard. Dieser Ansatz wird andere Nebenwirkungen haben, so würde ich nicht empfehlen, es auf diese Weise zu tun.

Ich selbst bin in einem Projekt, das dies tut und es ist mehr Schmerz als Vergnügen, ehrlich zu sein. Ich habe diesen Code nicht selbst ausprobiert, aber Sie bekommen den Kern davon, wie es funktionieren sollte.

Geben Sie FormWizard ein! Dies ist eine besonders gute Wahl für Sie, da Sie Ihre Formulare nicht neu definieren müssen, Sie können die Formulare verwenden, die Sie haben.

Here's the link to the FormWizard docs

Viel Glück!