Ajax nicht buchen Wählen Sie Option

Question

Ich versuche, den Wert der Option in meiner Vorlage namens BeispielID zu erhalten. Ich habe einige Beispiele verfolgt, die ich online gefunden habe, aber nichts scheint zu funktionieren. Meine Vorlage unten hat die Ajax und Jquery, um den Wert zu erhalten, aber wenn ich versuche, es zu drucken, gibt None zurück. Ich habe meine Ressourcen aufgebraucht und mein Professor scheint es nicht zu wissen, er "geht hinein".

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<select title ="accesslevelid" class="form-control" id="accesslevelid" onchange="accesslevelid" title=""> 
      <option value="7"> Option 1</option> 
      <option value="5"> Option 2</option> 
      <option value = "3"> Option 3</option> 

</select> 
<script> 
$(document).ready(function() { 
    $('#accesslevelid').on('change', function() { 
     var accesslevelid = $(this).val(); 
     $.ajax({ url: "{% url 'submitted' %}", 
       headers: { 'X-CSRFToken': '{{ csrf_token }}' }, 
       data: { 
        accesslevelid: accesslevelid, 
       }, 
       type: 'POST', 
       success: function (result) { 
        alert(result); 
       }, 
       }); 
     }); 
    }); 
</script> 

meine Ansicht versucht, den Wert des Beitrags abzurufen.

exampleidpost = request.POST.get('accesslevelid', False) 
print (exampleidpost) 

Mein gewünschtes Ergebnis ist für die POST ein 7,5 zurückzukehren, oder 3.

Answer 1

Sie hinzufügen sollen csrf Token Sie Ajax-Request, auf diese Weise versuchen.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<select title="accesslevelid" class="form-control" id="accesslevelid" > 
    <option value="1"> Option1</option> 
    <option value="2"> Option2</option> 
    <option value="3"> Option3</option> 
</select> 

<script> 
$(document).ready(function() { 
    $('#accesslevelid').on('change', function() { 
     var accesslevelid= $(this).val(); 
     $.ajax({ 
      url: "{% url 'submitted' %}", 
      headers: {'X-CSRFToken': '{{ csrf_token }}'}, 
      data: { 
       accesslevelid: accesslevelid 
      }, 
      type: 'POST', 
      success: function (result) { 
       alert(result); 
      }, 
     }); 
    }); 
}); 
</script> 

Und Sie brauchen kein Formular mehr.