title: django: taking input and showing output in the same page
body: <p>I am quite new to django and struggling to do something very simple. 
  I have a <code>ModelForm</code> for the  following model:</p>
  
  <pre><code>class Queries(models.Model):
      user_id=models.CharField(max_length=200)
      query=models.CharField(max_length=200)
  </code></pre>
  
  <p>And I am showing the user a simple form that will help in doing the following:</p>
  
  <ul>
  <li>user will ask a question  </li>
  <li><p>The question will be processed(a database    query will be generated
  based on the question)</p></li>
  <li><p>Then the query result    should be shown just beneath the form in the
  same page.</p></li>
  </ul>
  
  <p>This is how my views.py looks like:</p>
  
  <pre><code>from django.http import HttpResponse
  from django.shortcuts import get_object_or_404, render
  from basicapp.models import QueryForm
  
  def index(request):
      form=MyForm()
      real_form=form.getForm(request)
      response=form.response
      return render(request,'basicapp/index.html',{
          'form': real_form,
          'response':response,
      })
  class MyForm:
      response=''
      def getForm(self,request):
          form = QueryForm(request.POST)
          if form.is_valid():
              response=form.cleaned_data['query']
              form.save()
          return form
  </code></pre>
  
  <p>For now I am trying simple stuffs,I am taking the value in query field of the form and trying to send it back to the page;so far I am failed. 
  This is index.html:</p>
  
  <pre><code>&lt;form action=" " method="post"&gt;{% csrf_token %}
  {{ form }}
  &lt;p&gt;{{response}}&lt;/p&gt;
  &lt;input type="submit" value="Submit" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>If I could do this,I think the query stuffs wont be that tough.The form is working fine,the datas are getting saved in database. Only the <code>response</code> string from <code>views.py</code> could not be retrieved inside <code>index.html</code> after form submission. Can you please help?</p>
  
  <p>EDIT:
  Tried following in <code>index.html</code> based on Hoff's answer:</p>
  
  <pre><code>&lt;form id="myForm" action=" " method="get"&gt;{% csrf_token %}
      {{ form }}
      &lt;input type="submit" value="Submit" /&gt;
  &lt;/form&gt;
  &lt;div id="response"&gt;
  &lt;/div&gt;
  &lt;script language="JavaScript"&gt;
      $(document).ready(function() {
          $("#myForm").submit(function() { // catch the form's submit event
              $.ajax({ // create an AJAX call...
                  data: $(this).serialize(), // get the form data
                  type: $(this).attr('GET'), 
                  success: function(response) { // on success..
                      $("#response").html(response); // update the DIV
                  }
              });
              return false;
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Still no luck :(</p>