Rendern einer ModelForm in einem Modal & Handlerfehler

Question

Ich habe eine Sicht, item_list_view, die auf GET-Anforderungen reagiert, indem eine Vorlage mainlist.html gerendert wird. Das Template macht eine Liste von Elementen zusammen mit Links, diese Elemente zu bearbeiten:

#mainlist.html 
{% for item in items %} 
    <a class='edit-link' href='#' data-form="{% url items:itemform %}?i={{item.id}}"> 
     Edit 
    </a> 
{% endfor %} 

<!-- later in mainlist.html --> 
<div class='modal fade' tabindex="-1" role="dialog" id='itemFormModal' style='display:none;'> 
</div> 

Wenn ein Bearbeitungs Link geklickt wird, wird der modale mit Inhalt geladen, um die entsprechenden data-form Attribut, dann wird die modale gezeigt:

$(".edit-link").click(function(ev){ 
    ev.preventDefault(); 
    var url = $(this).data("form"); 
    $("#itemFormModal").load(url, function() { 
     $(this).modal('show'); 
    }); 
    return false; //prevent click propogation 
}); 

An diesem Punkt wird das Modal mit der entsprechenden ModelForm angezeigt, und dieses Formular hat die Klasse item-form. Wir senden das Formular über Ajax:

$(".item-form").on('submit', function() { 
    $.ajax({ 
     type: $(this).attr('method'), 
     url: this.action, 
     data: $(this).serialize(), 
     context: this, 
     success: function(data, status) { 
      $('#itemFormModal').html(data); 
     } 
    }); 
    return false; 
}); 

Dies funktioniert ordnungsgemäß, wenn das Formular mit gültigen Daten übermittelt wird. Nach einer erfolgreichen Formularübergabe wird der Benutzer zusammen mit einer Erfolgsmeldung zur Listenansicht zurückgeleitet.

Wenn es Fehler mit dem Formular gibt, möchte ich das Formular mit diesen Fehlern in diesem ursprünglichen modal neu gerendert werden. Im Moment, wenn ich ein fehlerhaftes Formular abschicke, geht mein Browser direkt zur Aktions-URL, wo das Formular mit Fehlern gerendert wird.

Wie kann ich mein ModelForm mit Fehlern in dieses modale neu laden, anstatt umgeleitet zu werden?

---

Edit: wenn ein Link Bearbeiten wird diese Ansicht geklickt haben:

def litem_create_edit_view(request): 
    #Displays a ModelForm for an Item object 
    #if an "instance" is passed via the url, that 
    #instance is loaded into the ModelForm for editing 
    instance_id = request.GET.get('instance', None) 
    if instance_id is not None: 
     instance = Item.objects.get(id=instance_id) 
    else: 
     instance = None 

    if request.method == 'POST': 
     form = ItemForm(request.POST, instance=instance) 
     if form.is_valid(): 
      newitem = form.save() 
      messages.add_message(request, messages.SUCCESS, "Item saved!") 
      return redirect("items:mainlist") 

    else: 
     form = LeadForm(instance=instance) 

    return render(request, "leads/leadform.html", {'form':form, 'instance':instance}) 

Renders diese Vorlage in der modal:

<div class='modal-dialog modal-lg'> 
    <div class='modal-content'> 
    {% if instance %} 
    <form method="post" class='lead-form' action="{% url 'leads:leadform' %}?instance={{instance.id}}"> 
    {% else %} 
    <form method="post" class='lead-form' action="{% url 'leads:leadform' %}"> 
    {% endif %} 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal">×</button> 
     {% if instance %} 
     <h3>Editing Item</h3> 
     {% else %} 
     <h3>Add Item</h3> 
     {% endif %} 
     </div> 
     <div class="modal-body"> 
      {% csrf_token %} 
      {{ form|crispy }} 
     </div> 
     <div class="modal-footer"> 
      <button type='submit' class='btn btn-primary'>Save</button> 
      <button type='button' class='btn btn-default' data-dismiss='modal'>Close</button> 
     </div> 
    </form> 
    </div> 
</div> 

Answer 1

Ihrer Ansicht nach Gebrauch so etwas wie:

foos = Foo.objects.all() # or any other model data you want to return 
data = serializers.serialize('json', foos) # serialize it 

und JSON und nicht die Vorlage:

return HttpResponse(data, content_type='application/json') 

So diese Weise können Sie im gleichen div bleiben, ohne umgeleitet werden, sondern nur die Daten verbraucht wird und gerendert.