Asif
Asif

Reputation: 1825

Modify django template variable in Jquery code

I have django template where i'm checking variable for TRUE or FALSE. Now on specific event in Jquery i want to modify this django variable value to either TRUE or FALSE.

in views.py

var = True

in Template

{% if var %}

do something

{% endif %}

HTML code

<form>

  <label for="target">Enter Key:</label>
  <input id="target" type="text" />

 {% if var %}

 dispaly other stuff

 {% endif %}

 </form>

Jquery

 <script>
   $('#target').keydown(function(event) {
      if ($(this).val() == '00000 )
       {
        jvar = {{var}}
       }
     });

I want to change the value of 'var' in Jquery on specific event

How can i achieve this?

Thanks in advance

Upvotes: 1

Views: 5358

Answers (2)

markijbema
markijbema

Reputation: 4055

You cannot modify django templates using jquery. At the point jQuery comes into play the page is already rendered into html, and the django template tags have been processed. You can however rerender your templates using an ajax request, or (what I think in this case is enough), use css to display/hide some blocks:

<form>

  <label for="target">Enter Key:</label>
  <input id="target" type="text" />

 <div id="hiddencontent" style="display:{% if var %}block{%else%}none{% endif %}

 dispaly other stuff

 </div>

 </form>

Jquery

 <script>
   $('#target').keydown(function(event) {
      if ($(this).val() == '00000' )
       {
        $('hiddencontent').show();
       }
     });

However, the content of the html will be available that way (if you look at the source).

If the value '0000' is supposed to be a password this might not be the best solution, but if it is, you have to check it serverside anyway. Otherwise someone can open the html source and read the password. I think the best option would be to read up on how Django Forms work. I have provided a link below:

http://agiliq.com/blog/2010/01/doing-things-with-django-forms/

Upvotes: 0

Paulo Scardine
Paulo Scardine

Reputation: 77359

If I correctly understand your question, you can't.

Template variables are on the server side, jQuery works in the client side.

So you can not change the template, but you can change the resulting HTML at the browser. Use something like firefox firebug to inspect the HTML, you will find no traces of django templates.

By the time your template html/javascript code reaches the browser, the jvar = {{var}} will be something like jvar = 4325.

Just open the firebug console and test javascript/jQuery expressions.

<script type="text/javascript">
$('document').ready(function(){
    $('#some_element_id').click(function(ev) {
        jvar = 1;
        $('#some_content').show();
        $('#some_other_content').hide();
    });

    $('#some_other_element_id').click(function(ev) {
        jvar = 2;
        $('#some_content').hide();
        $('#some_other_content').show();
    });
});
</script>
...
<div id="some_content">
     display some stuff
</div>

<div id="some_other_content">
     display some other stuff
</div>

Upvotes: 5

Related Questions