2013-02-28 17 views
6

Mam problem z wysłaniem formularza z Ajax. Mam formularz, który chcę zastąpić innym formularzem asynchronicznie po kliknięciu następnego przycisku.django ajax request

Oto skrypt

$(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') 

widoki

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}) 

Chcę po kliknięciu następny przycisk w postaci powiatu, forma Ward pojawiają .

+3

Jakie jest twoje pytanie? Brakuje ci jednak cytatu po '# FORM_DIV'. –

+0

Twój JS ma błąd składni – Blender

+1

@Pavel był literówka, dzięki. – Alexxio

Odpowiedz

1

Można to rozwiązać na dwa sposoby, nie będę omawiać FormWizard, ale dam ci link do dokumentacji, która jest naprawdę dobra.

Moja rekomendacja jest taka, że ​​powinieneś wybrać się na FormWizard (w zależności od wersji Django), ale myślę, że został on przeniesiony do Django w wersji 1.2 i następnej, ale nie cytuj mnie na ten temat.

W twoim obecnym położeniu powinieneś zrobić coś zgodnie z tym.

$(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) 

Co to zrobi to, że będzie ciągnąć nową stronę HTML z wydanego formie z widoku Django i wyświetlić go. Zasadniczo to, co zrobiliście, to FormWizard. To podejście będzie miało inne skutki uboczne, więc nie polecałbym tego w ten sposób.

Sam pracuję nad tym projektem i bardziej niż przyjemnością jest bycie szczerym. Nie próbowałem tego kodu samodzielnie, ale wiesz, jak to powinno działać.

Enter FormWizard! Jest to szczególnie dobry wybór, ponieważ nie musisz na nowo definiować swoich formularzy, możesz korzystać z tych, które masz.

Here's the link to the FormWizard docs

Powodzenia!