问将数据输入到HTML表中
EN

Stack Overflow用户

提问于 2021-04-22 21:48:37

回答 1查看 63关注 0票数 0

我首先要说的是，我有一个网页，其中有一些文本区域，我可以在其中输入数据。还有一个按钮，通过它我应该写在数据库的表格中输入的数据，并在另一个网页的表格上显示相同的数据。现在，第一部分，也就是在DB上写数据，我能够完成它，但第二部分却不能。有人能帮我吗？下面我给你留下超文本标记语言，JavaScript和C#服务器端，它们可能是有用的。

HTML

<body>
    <form id="form1" runat="server">
        <div>
            <button id ="Aggiungi" class="button2" onclick="redirect()">+</button>
        </div>
        <br />
        <br />
        <table id= "tabel" class="display">
            <thead>
                <tr>
                    <th id ="col">NOME</th><th id ="col">COGNOME</th>
                    <th id ="col">AZIENDA</th>
                    <th id ="col">PROVINCIA</th>
                </tr>
            </thead>
        </table>  

        <br/>
    </form>
</body>

JavaScript

function add() {       
     let nom = document.getElementById("nome").value;
     let cognom = document.getElementById("cognome").value;
     let aziend = document.getElementById("azienda").value;
     let provincia = document.getElementById("provincia").value;        

    if ((nom == "") || (nom == "undefined") || (cognom == "") || (cognom == "undefined") || (aziend == "") || (aziend == "undefined") || (provincia == "") || (provincia == "undefined")) {

        alert("Inserire i dati per favore");            
    } else {  
        let dati = { nome: nom, cognome: cognom, azienda: aziend, provin: provincia };
        
         $.ajax({
             type: "POST",
             url: "user-form.aspx/ScriviDati",
             data: JSON.stringify(dati),
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             global: false,
             async: false,
             success: function (a) {

                 console.log(a.d);
                 alert("Perfetto")
             },

             fail: function (response) {
                 alert("Qualcosa è andato storto");
             }
         });
    }
}

public static void ScriviDati (string nome, string cognome, string azienda, string provin)
{
    string queryString = "INSERT Elenco (Nome, Cognome, Azienda, Provincia) VALUES (@Nome, @Cognome, @Azienda, @Provincia)";

    using (SqlConnection connection = new SqlConnection(ConfigurationManager.ConnectionStrings["coso"].ConnectionString))
    {
        connection.Open();

        using (SqlCommand command = new SqlCommand(queryString, connection))
        {
            SqlParameter parameter = new SqlParameter("Nome", nome);
            SqlParameter parameter2 = new SqlParameter("Cognome", cognome);
            SqlParameter parameter3 = new SqlParameter("Azienda", azienda);
            SqlParameter parameter4 = new SqlParameter("Provincia", provin);
            command.Parameters.Add(parameter);
            command.Parameters.Add(parameter2);
            command.Parameters.Add(parameter3);
            command.Parameters.Add(parameter4);
            command.ExecuteNonQuery();
            connection.Close();
        }
    }
}

javascript

html

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-04-22 22:34:33

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <table id="tabel" class="display">
      <thead>
        <tr>
          <th id="col">A</th>
          <th id="col">B</th>
          <th id="col">C</th>
          <th id="col">D</th>
        </tr>
      </thead>
    </table>
  </body>
  <script>
    window.onload = function () {
      const data = [
        { A: 1, B: 2, C: 3, D: 4 },
        { A: 1, B: 2, C: 3, D: 4 },
        { A: 1, B: 2, C: 3, D: 4 },
        { A: 1, B: 2, C: 3, D: 4 },
      ];

      const table = document.querySelector("table");
      data.forEach((item, index) => {
        let tr = document.createElement("tr");

        for (const key in item) {
          let td = document.createElement("td");
          td.innerText = item[key];
          tr.appendChild(td);
        }
        table.appendChild(tr);
      });
    };
  </script>
</html>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/67214568

复制

相似问题

问将数据输入到HTML表中
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问将数据输入到HTML表中EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问将数据输入到HTML表中
EN