配列をデータベースに保存し、取り出せるようにしたい

発生している問題、目指している形

例えば
array=[
[ ["a",1], ["b",2] ],
[ ["c",3], ["d",4] ]
];
のような多重配列があるとき、この配列をmysqlのデータベースに格納し、取り出すときは同じ形の配列として取り出すようにしたいです。

私が勉強した本ではテキストエリアの内容を保存する方法しか載っていなかったのでテキストエリアに配列を文字列にして表示し、それをデータベースに送信して保存したのですが、テキストエリアに表示すると[]が消えて文字の間にカンマが入り、a,1,b,2,c,3,d,4のようになり多重配列の形が崩れてしまいました。

ご教授お願いします。

フレームワークExpressでExpress Generatorを使用しています。

該当のソースコード

↓views\hello\add.ejs

<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta http-equiv="content-type"
            content="text/html; charset=UTF-8">
            <title>Circuit Simulator</title>
        <link rel="stylesheet" href="/stylesheets/style.css" />
        <script src="https://code.jquery.com/jquery.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>
        <link type="text/javascript" src="js/cktsim.js">
        <link type="text/javascript" src="js/schematic8.js">
        <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
    
    </head>

    <body>
            
        <div role="main">
            <form method="post" action="/hello/add" name="test">
            <table>
                <tr>
                    <td><textarea type="text" name="arr" rows="10" cols="60"></textarea></td>
                </tr>
                <tr>
                    <th></th>
                    <td><input type="submit" value="作成"></td>
                </tr>
            </table>
            </form>
        </div>
    <script>
        array=[
            [ ["a",1], ["b",2] ],
            [ ["c",3], ["d",4] ]
            ];
        document.test.arr.value = array;
    </script>
    </body>
</html>

↓routes\hello.js

var express = require('express');
var router = express.Router();
var mysql = require("mysql");

var knex = require("knex")({
    dialect: "mysql",
    connection: {
        host     : "localhost",
        user     : "root",
        password : "",
        database : "db",
        charset  : "utf8"
    }
});

var Bookshelf = require("bookshelf")(knex);

var MyData = Bookshelf.Model.extend({
    tableName: "mydata"
});

//MySQLの設定情報
var mysql_setting = {
    host     : "localhost",
    user     : "root",
    password : "",
    database : "db"
};

//GETアクセスの処理
router.get('/', (req, res, next) => {

    //データベースの設定情報
    var connection = mysql.createConnection(mysql_setting);

    //データベースに接続
    connection.connect();

    //データを取り出す
    connection.query("SELECT * from mydata",
        function (error, results, fields) {
            //データベースアクセス完了時の処理
            if (error == null){
                var data = {title:"mysql", content:results};
                res.render("hello", data);
            }
    });

    //接続を解除
    connection.end();
});

//ADD
//GETアクセスの処理
router.post('/add', (req, res, next) => {
    var ar = req.body.arr;
    var data = {"arr":ar};

    //データベースの設定情報
    var connection = mysql.createConnection(mysql_setting);

    //データベースに接続
    connection.connect();

    //データを取り出す
    connection.query("insert into mydata set ?", data,
        function (error, results, fields) {
            res.redirect("/hello");
    });

    //接続を解除
    connection.end();
});


module.exports = router;