{% csrf_token %} printing as text from js file django

Question

{% csrf_token %} printing as text from js file in Django the code is working if use it in script tag but when I try to use from an external js file it doesn't work

HTML

<div class="build">BUILD  YOUR  RESUME</div>
<div class="box container" id="box2">
    <div class="skillbox">
        <div class="workquestion">
            How Many work Exprience you wanted <br> to add in your resume ?
        </div>
        <div class="row" id="butt">
          <div class="form-group col-md-2">
              <button type="button" class="btn btn-success" onclick="updateform(1)" id="butt1">1</button>
          </div>
          <div class="form-group col-md-2">
              <button type="button" class="btn btn-success" onclick="updateform(2)" id="butt2">2</button>
          </div>
          <div class="form-group col-md-2">
              <button type="button" class="btn btn-success" onclick="updateform(3)" id="butt3">3</button>
          </div>
          <div class="form-group col-md-2">
              <button type="button" class="btn btn-success" onclick="updateform(4)" id="butt4">4</button>
          </div>
          <div class="form-group col-md-2">
            <button type="button" class="btn btn-success" onclick="updateform(5)" id="butt5">5</button>
        </div>
        <div class="workquestion" style="color: red;">
            Maximum
        </div>
        </div>
        <div class="row" >
            <div class="form-group col-md-2">
                <button type="button" class="btn btn-success" onclick="updateform(6)" id="butt6">6</button>
            </div>
            <div class="form-group col-md-2">
                <button type="button" class="btn btn-success" onclick="updateform(7)" id="butt7">7</button>
            </div>
            <div class="form-group col-md-2">
                <button type="button" class="btn btn-success" onclick="updateform(8)" id="butt8">8</button>
            </div>
            <div class="form-group col-md-2">
                <button type="button" class="btn btn-success" onclick="updateform(9)" id="butt9">9</button>
            </div>
            <div class="form-group col-md-2">
              <button type="button" class="btn btn-success" onclick="updateform(10)" id="butt10">10</button>
          </div>
          <div class="workquestion" style="color: red;">
            10 Skills
        </div>
          </div>
</div>

Script

<script src='{% static "js/skill.js" %}'>
     </script>

skill.js

function updateform(n){
    var temp=`<div class="heading">
  <h2 class="head">Tell us about your Skills</h2>
<form method="POST" action="/skill">{% csrf_token %}`
for(var i=1;i<=n;i++){
    temp=temp+`<div class="form-row">
        <div class="form-group col-md-3">
      </div>
      <div class="form-group col-md-6">
        <label for="inputEmail4">Skill ${i}</label>
        <input type="text" class="form-control" id="skill${i}" name="skill${i}" placeholder="Skill" required>
      </div>
    </div>`
}
temp=temp+`<button id='b1' type="submit" class="btn btn-primary nextbtn">Next</button>
  </form>
</div>`
document.getElementById('box2').innerHTML=temp
}

`.js` files are served as-is, and not pre-processed like HTML templates / views. There's multiple solutions to passing server data to the client: putting an inline script in your HTML or requesting the data via ajax are two of them. — , Sep 15 '20 at 13:28
Does this answer your question? [Passing Python Data to JavaScript via Django](https://stackoverflow.com/questions/1445989/passing-python-data-to-javascript-via-django) — , Sep 15 '20 at 13:29
Yes it is working in script tag can you give more detail about the Ajax method — Vardhman Jain, Sep 15 '20 at 13:32
You can't put django template syntax in a `.js` file. You should get the CSRF cookie value & do it that way if you need to have JS doing that. — markwalker_, Sep 15 '20 at 13:46

score 0 · Answer 1 · answered Sep 15 '20 at 13:53

Are you processing the JS file in Django, as a template?

Instead of referencing the resource directly in your script at its specified location, you will need to instead reference a Django URL that processes the file as a template and then returns the processed content (source text ...) to you.

{% csrf_token %} printing as text from js file django

1 Answers1