如何使用JavaScript來保存修改資料到MySQL資料庫中

在Web應用程式中，MySQL資料庫被廣泛使用。然而，對於那些剛開始使用MySQL的開發人員來說，他們可能會遇到一些難題，例如如何保存修改資料。本文將介紹如何使用JavaScript來保存修改資料到MySQL資料庫。

第一步是連接MySQL資料庫。在這種情況下，我們將使用Node.js來連接MySQL。要連接MySQL，我們需要使用npm套件mysql。這個包是mysql的Node.js驅動程序，它可以在Node.js環境中使用。我們可以透過以下指令來安裝mysql。

npm install mysql

連接到MySQL資料庫

下一步是在Node.js中使用驅動程式連接到MySQL資料庫。我們將建立一個名為db.js的文件，在其中包含以下內容。

const mysql = require('mysql');

const con = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: 'password',
    database: 'testdb'
});

module.exports = con;

我們將使用createConnection方法建立一個MySQL連線。這個方法接受一個對象，其中包含以下屬性：

• host - MySQL伺服器主機名稱
• user - MySQL使用者的使用者名稱
• password - MySQL使用者密碼
• database - MySQL資料庫名稱

我們將匯出這個連接，以便我們可以從其他檔案中使用它。

儲存修改資料

現在我們已經連接到MySQL資料庫，我們可以開始儲存修改資料。讓我們假設我們有一個名為「users」的表，它有三個欄位：id、name和email。我們將透過使用JavaScript從 HTML表單中取得這三個值來儲存資料。

首先，我們將建立一個HTML表單，讓使用者輸入他們的姓名和電子郵件。表單看起來像這樣：

<form>
  <input type="text" id="name" name="name" placeholder="Name">
  <input type="email" id="email" name="email" placeholder="Email">
  <button type="button" onclick="save()">Save</button>
</form>

在表單中，我們定義了input元素來取得使用者的姓名和電子郵件地址。我們還在表單中新增了一個button元素，並給它一個onclick事件處理程序，該處理程序將會呼叫save函數。

現在，我們來寫JavaScript程式碼來儲存資料。在index.html中加入以下腳本。

<script src="db.js"></script>
<script>
function save() {
  const name = document.getElementById('name').value;
  const email = document.getElementById('email').value;

  const sql = `INSERT INTO users (name, email) VALUES ('${name}', '${email}')`;
  
  db.query(sql, function (err, result) {
    if (err) throw err;
    console.log("1 record inserted");
  });
}
</script>

在該腳本中，我們首先獲得使用者輸入的姓名和電子郵件地址。接下來，我們使用這些值來建立一個INSERT語句，將使用者輸入的資料插入MySQL資料庫的users表中。

我們使用MySQL的query方法來執行SQL查詢。這個方法接收兩個參數：SQL查詢和一個回呼函數。回調函數在查詢執行後被呼叫。在回調函數中，我們可以檢查是否有錯誤，並輸出插入的記錄數。

現在，當使用者輸入姓名和電子郵件並點擊儲存按鈕時，我們將使用JavaScript將資料儲存到MySQL資料庫中。

結論

使用JavaScript儲存修改到MySQL資料庫中並不困難。在本文中，我們介紹如何連接MySQL資料庫並使用JavaScript從HTML表單中取得數據，然後將資料儲存到MySQL資料庫中。如果您遇到了任何問題，請閱讀mysql npm套件的官方文件以獲得更多協助。

以上是如何使用JavaScript來保存修改資料到MySQL資料庫中的詳細內容。更多資訊請關注PHP中文網其他相關文章！