title: How to use {% csrf_token %} in javascript
body: <p>In my users page, i have in place editing with ajax. And when i click edit, it works fine. But when i submit the form, it don't do anything. When i checked, this is the error:</p>
  
  <p><code>CSRF verification failed. Request aborted.</code></p>
  
  <p>So, how do I place {% csrf_token %} in my javascript? Please advice.
  Thank you.</p>
  
  <p>edit.js:</p>
  
  <pre><code>function bookmark_edit() {
      var item = $(this).parent();
      var url = item.find(".title").attr("href");
      item.load("/save/?ajax&amp;url=" + escape(url), null, function () {
          $("#save-form").submit(bookmark_save);
          });
      return false;
      }
  
  $(document).ready(function () {
      $("ul.bookmarks .edit").click(bookmark_edit);
      });
  
  function bookmark_save() {
      var item = $(this).parent();
      var data = {
          url: item.find("#id_url").val(),
          title: item.find("#id_title").val(),
          tags: item.find("#id_tags").val()
          };
      $.post("/save/?ajax", data, function (result) {
          if (result != "failure") {
          item.before($("li", result).get(0));
          item.remove();
          $("ul.bookmarks .edit").click(bookmark_edit);
          }
          else {
              alert("Failed to validate bookmark before saving.");
          }
          })
          return false;
      }
  </code></pre>
  
  <p>save_form.html:</p>
  
  <pre><code>&lt;form id = "save-form" method="post" action="/save/"&gt;
  {% csrf_token %}
      {{form.as_p}}
      &lt;input type="submit" value="Save" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>user_page.html:</p>
  
  <pre><code>{% extends "base.html" %}
  {% block external %}
      &lt;script type = "text/javascript" src="{% static "assets/js/bookmark_edit.js" %}"&gt;&lt;/script&gt;
  {% endblock %}
  {% block title %} {{username}} {% endblock %}
  {% block head %} Bookmarks for {{username}} {% endblock %}
  {% block content %}
      {% include "bookmark_list.html" %}
  {% endblock %}
  </code></pre>
  
  <p>view.py:</p>
  
  <pre><code>@login_required(login_url='/login/')
  def bookmark_save_page(request):
      ajax = request.GET.has_key('ajax')
      if request.method == 'POST':
          form = BookmarkSaveForm(request.POST)
          if form.is_valid():
              bookmark = _bookmark_save(request, form)
              if ajax:
                  variables = RequestContext(request, {
                      'bookmarks':[bookmark],
                      'show_edit':True,
                      'show_tags':True
                      })
                  return render_to_response('bookmark_list.html', variables)
              else:
                  return HttpResponseRedirect('/user/%s/' % request.user.username
                      )
          else:
              if ajax:
                  return HttpResponseRedirect('failure')
      elif request.GET.has_key('url'):
          url = request.GET['url']
          title = ''
          tags = ''
  
          try:
              link = Link.objects.get(url=url)
              bookmark = Bookmark.objects.get(
                  link=link,
                  user = request.user
                  )
              title = bookmark.title
              tags = ' '.join(
                  tag.name for tag in bookmark.tag_set.all()
                  )
          except ObjectDoesNotExist:
              pass
          form = BookmarkSaveForm({
              'url':url,
              'title':title,
              'tags':tags
              })
      else:
          form = BookmarkSaveForm()
  
      variables = RequestContext(request, {
          'form': form
          })
      if ajax:
          return render_to_response(
              'bookmark_save_form.html',
              variables
              )
      else:
          return render_to_response('bookmark_save.html',variables)
  </code></pre>