-2

質問があります。javascript を使用して MySql DB にデータを挿入するにはどうすればよいですか?

私は次のJSコードを持っています:

function saveData()
{
    var table = document.getElementById('tblResult');
    var rowCount = table.rows.length;
    i = rowCount;
    var template = "<tr> <td>"+i+"</td> <td>"+document.getElementById('ctrl_ball_size_val').value+"</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> <td>"+document.getElementById('ctrl_cilindr_height_val').value+"</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> <td>"+document.getElementById('stopwatch').value+"</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> <td>11300</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> <td>1260</td> <td style='text-align: center; background-color: lime;'>± 0.1</td> </tr>";
    $('tbody').append(template);
}

このコードを使用して、html ページの入力から取得した動的データを使用してテーブルを作成しています。テーブルの HTML コードは次のとおりです。

<table id="tblResult" class="zebra-striped">
    <thead>
    <tr>
        <th id="ID">Nr.p.k</th>
        <th>d ± △d, mm</th>
        <th style="background-color: lime;">△d, mm</th>
        <th>l ± △l, cm</th>
        <th style="background-color: lime;">△l, cm</th>
        <th>t ± △t, s</th>
        <th style="background-color: lime;">△t, s</th>
        <th>p ± △p, kg/m<sup>3</sup></th>
        <th style="background-color: lime;">△p, kg/m<sup>3</sup></th>
        <th>p<sub>1</sub> ± △p<sub>1</sub>, kg/m<sup>3</sup></th>
        <th style="background-color: lime;">△p<sub>1</sub>, kg/m<sup>3</sup></th>
    </tr>
    </thead>
    <tbody></tbody>
</table>

この動的データを挿入します。したがって、すべての HTML テーブルを MySQL DB に挿入/保存する必要があります。このテーブルは 2 ページ目に表示されますが、このデータの挿入と表示をどのように整理するかわかりません... 誰か助けてくれますか?

4

2 に答える 2

1

JavaScript を介してすべてを単独で実行することはできません。クライアント側とサーバー側の違いを理解する必要があります。すべての JS コードがユーザーのブラウザーで実行されることを確認します。そのため、mySql のようにクライアント側で永続的なストレージを提供する方法はありません。webstorage、localstorage などの HTML5 ストレージ API がありますが、これらにはサイズなどに関する制約があります。私はこれらに飛び込むつもりはありません。したがって、サーバー側にデータベースがあります。データが必要な場合は、get リクエストを送信してフェッチします。同様に、いくつかのデータを保存したいので、データで投稿リクエストを行います。これらのGETおよびPOSTリクエストに応答し、送信されたデータで適切なアクションを実行するバックエンドで実行されているサービスがあります。データベースと対話するためのサンプル php コードを確認したい場合。次の PHP コードを見て、データベースとやり取りします。

<?php
/****** 5 Step Story ***********
1. Create a connection
2. Select the database
3. Fire the query
4. Use query result
5. Close the connection
*******************************/

// Step1. Create a connection
$con = mysql_connect("localhost", "root", "root");
if (!$con) {
    die("Database connection could not be established" . mysql_error());
}

// Step2. Select the database
$db_select = mysql_select_db("widget_corp", $con);
if (!$db_select) {
    die("Database could not be selected" . mysql_error());
}
?>
<html>
  <head>
    <title> Database Interaction (MySQL + PHP)  </title>
  </head>
  <body>
    <h1><center><u>Database Interation (MySQL + PHP) </u></center></h1>
    <?php
    // Step3: Querying from Database
      $result = mysql_query("SELECT * from subjects", $con);
      if (!$result) {
        die("Error in firing query on database" . mysql_error());
      }
   // Step4: Using query result
   /* $row is an associative array as well So both types of indexes work on it
      Numeric indexes as well as Keys both work */
      while ($row = mysql_fetch_array($result)) {
        echo $row["id"] . " " .
        $row["menu_name"] . " " .
        $row[2] . " " .
        $row[3] . "<hr>";
      }
   ?>
  </body>
</html>
<?php
   mysql_close($con);
?>
于 2013-04-09T21:19:13.327 に答える
0

データベースに接続するには、ある種のサーバー側ソフトウェアが必要になります。Javascript と HTML だけでは、そこに到達することはできません。AJAX リクエスト (または標準の POST) を作成できますが、リクエストに応答するにはバックエンドに何かが必要です。

サーバーで次のいずれかを実行していますか? ColdFusion、PHP、Python、Ruby、C++、Java、ASP、Perl?

編集：

@showdev が提案したように、AJAX を使用して、データベースに対して INSERT ステートメントを実行する PHP ページにリクエストを投稿できます (@blunderBoy の回答を参照)。データを入力するために使用しているフォームが画面に表示されているように聞こえますが、jQuery を使用している場合、AJAX リクエストは次のようになります。

$.post("test.php", $("#testform").serialize() );

wheretest.phpは投稿先の URL でtestformあり、入力が配置されているフォームの ID です。

その行を、行をテーブルに追加する saveData() 関数にドロップします。

于 2013-04-09T21:10:18.640 に答える