Tenho uma página HTML com um exemplo de botões, como mostrado, parte de um aplicativo Django que preenche o nome e a cidade após inserir os valores:
{% for person in page_obj %}
<button id="NotifyBtn" name="person.FName" town="person.LName">Press Me</button>
{% endfor %}
<button id="NotifyBtn" name="Billy" town="Bob">Press Me</button>
<button id="NotifyBtn" name="Timmy" town="Tawin">Press Me</button>
<button id="NotifyBtn" name="Milly" town="House">Press Me</button>
Então eu tenho um JS que faz o seguinte:
document.getElementById("NotifyBtn").addEventListener("click", function(){
var name = this.getAttribute("name");
var town = this.getAttribute("town");
fetch("{% url 'alert_via_JSON_Response' %}", {
method: "POST",
headers: {
"X-CSRFToken": "{{ csrf_token }}",
"Content-Type": "application/json"
},
body: JSON.stringify({ message: "Hi there: " + `${name} born in ${town}`
})
}).then(response => response.json())
.then(data => alert(data.status));
});
Na minha aplicação Django tenho o seguinte:
def alert_via_JSON_Response(request):
if request.method == 'POST':
data = json.loads(request.body)
message = data.get('message', "Error in sending email")
return JsonResponse({"status": f"{message}"})
return JsonResponse({"status": f"No Message"})
No momento, quando clico na página, apenas um botão funciona e envia uma resposta JSON para a página. Não funciona se eu pressionar outro botão depois de pressionar o primeiro. Existe uma maneira de pressionar cada botão quando necessário e exibir a resposta JSON para cada botão?