Displaying HTML forms through AJAX

[Arun Kaushik]

I am a newbie. I am learning Django by developing a web application. There is use-case where I got stuck. 

there are 3 buttons on a html page

Personal info

Education

Work Experience

It is desired when the user click any of the button, respective html form shall be displayed on right-half of web-page.

What I have tried is this, onclick function of buttons:

    function myfun()

{

var xmlhttp;

if (window.XMLHttpRequest)

  {

  xmlhttp=new XMLHttpRequest();

  }

else

  {

  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

  }

xmlhttp.onreadystatechange=function()

  {

  if (xmlhttp.readyState==4 && xmlhttp.status==200)

    {

    document.getElementById("rightpan").innerHTML=xmlhttp.responseText;

    }

  }

xmlhttp.open("GET","{% url "polls:demo_test" %}",true);

xmlhttp.send();

}

</script>

in views.py, demo test does this:

def demo_test(request):

return HttpResponse("<form name='reg' onsubmit='return ValidateForm(this)' action='{% url 'polls:signupexec' %}'  method='post'><tr><td><div>Firstname:</div></td><td><input type='text' name='first_name' /></td></tr><tr><td><div>Lastname:</div></td><td><input type='text' name='last_name' /></td></tr><tr><td><input name='submit' type='submit' value='Submit' /></td></tr></form>")

1. First of all, it works fine except that it does not embed CSRF_TOKEN in the form, which is important.
2. Secondly, I feel that this approach is against the philosophy of django.

Please give some suggestions on how can I do this. Loading HTML Forms dynamically through AJAX.

[Thomas]

My initial recommendation would be to read up on the Forms section of the Django manual. 

A lot of the logic you've written here is abstracted away in Django's built-in methods. 

Also, I'd replace that messy HTML in views.py with a call to a separate partial. 

In fact, that partial would probably being in a form from your forms.py. 

<!--

Sincerely,

Thomas Murphy

646.957.6115

-->

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at http://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/48e438cc-d82d-41ed-ab95-aad10fbe1403%40googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

[Aaron Decker]

Arun,

Do yourself some favors.

1. use jQuery for Ajax (or some other lib). You are doing it the very hard and not cross-browser compatible way.
2. use Django's template system for HTML generation.
3. if you do number 2 you can embed the CSRF token in the template render like you are supposed to.

-Aaron

[Arun Kaushik]

Well Thank you very much Aaron for your suggestions, I am working on them. I am stuck in another problem here, please suggest your opinion

I am using jquery to load specific HTML Form on page (in a div).

I am using django Template generation technique to render them.

Here is the problem: I want to send a parameter in my ajax call, as form-fields need to be auto-populated with some values from DB specific to that parameter. My intention is to use .load function of jquery which passes parameters through POST (am i right?). But it is not working at all. without passing any parameter it works fine.

What I am doing:

Jquery function:

<script>

$(document).ready(function(){

  $("button").click(function(event){

  alert("ok1");

  event.preventDefault();

  var target = "{% url 'polls:demo_test'%}";

  $("#rightpan").load(target, {

  username : "arun_kaushik"

  }); 

  });

});

</script>

views.py:

def demo_test(request):

member = get_object_or_404(Userobject, username=request.POST['username'])

return render(request, 'polls/form_personal.html',{'member': member})

If I do not pass any variable in .load function it works fine and load the form (not populated ofcourse).