Después de una petición AJAX Post, que estoy tratando de recuperar de mi punto de vista algunos valores de lista de contenidos en una variable. La idea es utilizar estos valores para rellenar una lista desplegable. Pero mi variables parece vacío. Pensé que era porque al principio he usado un 'retorno render ()', pero incluso con una obra 'return HttpResponse ()' no lo hace.
Este es mi views.py:
def MyView3(request):
if request.method == 'POST' and request.is_ajax:
myVariable = ["1", "2", "3", "4", "5"]
print(myVariable)
return HttpResponse(myVariable)
else:
return render(request,'home3.html')
Este es mi código html:
<form class="wrapper" action="" method="post"> {% csrf_token %}
<select name="myVal" class="toChange">
<option val="1">1</option>
<option val="2">2</option>
</select>
<select id="dep" name="dep">
{% for item in myVariable %}
<option val="{{ item }}"> {{ item }} </option>
{% endfor %}
</select>
<script type="text/javascript">
function dropdownChange () {
var selectedValue = $(".toChange option:selected").val();
$.ajax({
type: 'POST',
data: {'myVal': selectedValue},
});
var mylist = '{{myVariable}}';
alert(mylist);
}
$(".toChange").change(dropdownChange);
</script>
</form>
La idea aquí es Triger la llamada AJAX cuando selecciono un nuevo valor en mi 'myVal' desplegable. La llamada funciona ya que la vista se activa correctamente, como 'impresión (myVariable)' muestra el resultado esperado en la consola. Por otra parte, se muestra mi alerta emergente. Sin embargo, está vacío. Que lo necesitaría para mostrar los valores contenidos en 'myVariable', por lo que '[ "1", "2", "3", "4", "5"]'. Asumo que debe ser algo sencillo, pero yo no podía entender por qué. ¿Podrias ayudarme por favor?
Se echa en falta la URL
y la devolución de llamada de éxito en la Ajax
llamada. Usted podría recibir la respuesta en el éxito de devolución de llamada.
Que está recibiendo nulo en alerta porque el $.ajax
es una función asíncrona y alerta aparecerá antes de la ajax
llamada puede completarse.
Pruebe el siguiente ejemplo.
Ejemplo:
<script type="text/javascript">
function dropdownChange () {
var selectedValue = $(".toChange option:selected").val();
$.ajax({
url: "<add the url>"
type: 'POST',
data: {'myVal': selectedValue},
success: function(res) {
alert(res);
}
});
}
$(".toChange").change(dropdownChange);
</script>