如何将js变量传递给Django视图

2024-10-03 13:29:39 发布

您现在位置:Python中文网/ 问答频道 /正文

这是我第一次使用JS,我不知道如何将表中选定的行传递给django的视图文件

这是我的HTML和我的JS:

var tabela = document.getElementById("minhaTabela"); var linhas = tabela.getElementsByTagName("tr"); for(var i = 0; i < linhas.length; i++){ var linha = linhas[i]; linha.addEventListener("click", function(){ selLinha(this, true); }); } function selLinha(linha, multiplos){ if(!multiplos){ var linhas = linha.parentElement.getElementsByTagName("tr"); for(var i = 0; i < linhas.length; i++){ var linha_ = linhas[i]; linha_.classList.remove("selecionado"); } } linha.classList.toggle("selecionado"); } var btnVisualizar = document.getElementById("visualizarDados"); btnVisualizar.addEventListener("click", function(){ var selecionados = tabela.getElementsByClassName("selecionado"); //Verificar se eestá selecionado if(selecionados.length < 1){ alert("Selecione pelo menos uma linha"); return false; } var dados = ""; for(var i = 0; i < selecionados.length; i++){ var selecionado = selecionados[i]; selecionado = selecionado.getElementsByTagName("td"); dados += "CNPJ: " + selecionado[0].innerHTML + " - RAZÃO SOCIAL: " + selecionado[1].innerHTML + " - NOME FANTASIA: " + selecionado[2].innerHTML + "\n"; } alert(dados); });
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link  rel="stylesheet" href="{% static 'css/banco.css' %}">
</head>
<body>
<button id="visualizarDados">Visualizar Dados</button>

<table border="1" class="dataframe" id="minhaTabela">
  <thead>
    <tr style="text-align: right;">
      <th></th>
      <th>CNPJ</th>
      <th>RazaoSocial</th>
      <th>NomeFantasia</th>
      </tr>
      </thead>
      <tbody>
        <tr>
      <th>0</th>
      <td>00000000000</td>
      <td>xxxxxxxxxxxxx S/A</td>
      <td>xxxxxxxxxxx</td>
      </tr>
    <tr>
      <th>1</th>
      <td>111111111111</td>
      <td>yyyyyyyyyyyy S/A</td>
      <td>yyyyyyyyyyyyyy</td>
      </tr>
     </tbody>
</table>


<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script  src="{% static 'js/banco.js' %}" async> </script>
</body>
</html>

我不想显示一个警报,而是想让这个变量提交到我的django视图中。我不知道在这种情况下如何创建表单,因为该表是由pandas.to_html生成的,所以我不知道如何在该表中插入表单来发送所选行的列[0]、列[1]和列[2]


Tags: forvarhtmlscriptfunctionlengthtrtd
1条回答
网友
1楼 · 发布于 2024-10-03 13:29:39

请注意,Javascript由浏览器执行,而Django由服务器运行。为了实现通信,您必须使用XHR,也称为“Ajax”

在JS端,您可以创建一个HTTP请求

使用获取API(异步/承诺) https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API

或者使用XMLHttpRequest(同步) https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest

您应该将变量转换为JSON,并向服务器创建POST请求

const URL = http://yourServer.local/yourController
fetch(url, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: {
      JSON.stringify(dados)
    }).then(result => {
       //what to do when the POST was successful and a possible answer was retrived
    })

在Django端,请参阅有关如何创建最小控制器和路由以处理POST请求的文档 https://docs.djangoproject.com/en/3.0/intro/tutorial04/

相关问题 更多 >