Как использовать Ajax в Django-шаблонах?

Question

Как использовать Ajax в Django-шаблонах?

urls.py

from django.conf.urls import patterns, url 

urlpatterns = patterns('', 
    url(r'^home/$', 'views.index'),) 

views.py

from django.template import RequestContext 
from django.shortcuts import render_to_response 

def index(request): 

    val = request.POST.get('val', default='text_text') 
    return render_to_response(
      'index.html', 
          {'text': val,}, 
          context_instance=RequestContext(request)) 

index.html

<p>text and pictures</p> 
<p>text and pictures</p> 

<h1>{{ text }}</h1> 

<form action="/home/" method="post"> 
{% csrf_token %} 
<input type="text" name="val" id="val" value="{{ val }}"/> <br/> 
<input type="submit" value="OK" /> 
</form> 

<p>text and pictures</p> 
<p>text and pictures</p> 

Как это можно сделать, когда вы нажимаете кнопку OK обновляет только часть страницы между тегами h1?

Answer 1

Так я справляюсь с этим в Flask, но поскольку вы работаете с Django, это будет легко подстроить код.

Сервер: импорт jsonify

@app.route("/_jquerylink") 
def jquerylink(): 
    val = request.POST.get('val', default='text_text') 
    return jsonify(text=val) 

стороне клиента:

<div id="partwithh1"><h1>{{ text }}</h1></div> 

<form action="/home/" method="post"> 
    {% csrf_token %} 
    <input type="text" name="val" id="val" value="{{ val }}"/> <br/> 
    <input type="submit" onclick="getviews(this)" value="OK" /> 
</form> 

    <script type="text/javascript"> 

     $(function getviews() { 

      var content = $(#val).text(); 
      $SCRIPT_ROOT = {{ request.script_root|tojson|safe }}; 
      $.getJSON($SCRIPT_ROOT + '/_jquerylink', 
        {'val':content} 
       , 
       function(data) { 
        $("#partwithh1").html(data.text); 
       }); 
      return false; 
      }); 

    </script>