Note that there are some explanatory texts on larger screens.

plurals
  1. PODjango form wizard with Ajax
    text
    copied!<p>I'm trying to use form wizard through ajax. I have a separated template that first is loaded when a user want to start using the form. And then is reloaded through ajax until it's completed.</p> <p>First ajax call to load the form:</p> <pre><code>$('#create-modal').click(function(){ $.ajax({ type: "GET", url:"/create/", data:{ 'csrfmiddlewaretoken': $('input[name=csrfmiddlewaretoken]').val() }, success: function(data){ $('#creation').html(data); }, dataType: 'html' }); }); </code></pre> <p>Here it is the ajax call to reload the submits:</p> <pre><code>$('#creation').on('submit', '#creation-form' , function(e){ e.preventDefault(); var fd = new FormData($('#creation-form').get(0)); $.ajax({ url: '/create/', data: fd, type: "POST", success: function(data){ $('#creation').html(data); }, processData: false, contentType: false }); }); </code></pre> <p>The form can be completed and save into the database just fine but what the previous step button isn't working, it just keeps going foward to the form when I click it.</p> <pre><code>&lt;button class="btn btn-primary" aria-hidden="true" type="submit" name="wizard_goto_step" value="{{ wizard.steps.prev }}"&gt;Previous&lt;/button&gt; </code></pre> <p>and all other variants, last, first...</p> <p>I'm not including all the code because when I call the url directly from the browser the previous button works just fine. That is when I call it form /create/ rather than the url where the ajax are.</p> <p>Request headers for both ajax (not working) and without ajax (working). <a href="http://snipt.org/AOC9" rel="nofollow">http://snipt.org/AOC9</a>.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload