sql >> データベース >  >> RDS >> Mysql

javascriptからmysqlデータベースにデータを送信します

    あなたの質問で定義されているように、JavaScriptはMySqlと直接連携することはできません。これは、同じコンピューターで実行されていないためです。

    JavaScriptはクライアント側(ブラウザー内)で実行され、データベースは通常サーバー側に存在します。クエリを実行するには、おそらく中間のサーバー側言語(PHP、Java、.Net、またはNode.jsなどのサーバー側JavaScriptスタックなど)を使用する必要があります。

    これは、PHP、JavaScript、およびMySqlをバインドするコードを記述し、コードをブラウザーとサーバーの両方で実行する方法に関するチュートリアルです。

    http://www.w3schools.com/php/php_ajax_database.asp

    そして、これがそのページのコードです。シナリオと完全には一致しませんが(クエリを実行し、データをDBに保存しません)、これを機能させるために必要なインタラクションのタイプを理解し始めるのに役立つ場合があります。

    特に、その記事のこれらのコードに注意してください。

    Javascriptのビット:

    xmlhttp.open("GET","getuser.php?q="+str,true);
    xmlhttp.send();
    

    PHPコードの一部:

    mysql_select_db("ajax_demo", $con);
    $result = mysql_query($sql);
    // ...
    $row = mysql_fetch_array($result)
    mysql_close($con);
    

    また、この種のコードがどのように機能するかを理解したら、jQueryJavaScriptライブラリを使用してAJAX呼び出しを行うことをお勧めします 。組み込みのAJAXサポートよりもはるかにクリーンで扱いやすく、jQueryにはクロスブラウザーサポートが組み込まれているため、ブラウザー固有のコードを記述する必要はありません。 jQueryAJAXAPIドキュメント

    記事のコード

    HTML / Javascriptコード:

    <html>
    <head>
    <script type="text/javascript">
    function showUser(str)
    {
    if (str=="")
      {
      document.getElementById("txtHint").innerHTML="";
      return;
      } 
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
    else
      {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
        document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
      }
    xmlhttp.open("GET","getuser.php?q="+str,true);
    xmlhttp.send();
    }
    </script>
    </head>
    <body>
    
    <form>
    <select name="users" onchange="showUser(this.value)">
    <option value="">Select a person:</option>
    <option value="1">Peter Griffin</option>
    <option value="2">Lois Griffin</option>
    <option value="3">Glenn Quagmire</option>
    <option value="4">Joseph Swanson</option>
    </select>
    </form>
    <br />
    <div id="txtHint"><b>Person info will be listed here.</b></div>
    
    </body>
    </html>
    

    PHPコード:

    <?php
    $q=$_GET["q"];
    
    $con = mysql_connect('localhost', 'peter', 'abc123');
    if (!$con)
      {
      die('Could not connect: ' . mysql_error());
      }
    
    mysql_select_db("ajax_demo", $con);
    
    $sql="SELECT * FROM user WHERE id = '".$q."'";
    
    $result = mysql_query($sql);
    
    echo "<table border='1'>
    <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
    <th>Hometown</th>
    <th>Job</th>
    </tr>";
    
    while($row = mysql_fetch_array($result))
      {
      echo "<tr>";
      echo "<td>" . $row['FirstName'] . "</td>";
      echo "<td>" . $row['LastName'] . "</td>";
      echo "<td>" . $row['Age'] . "</td>";
      echo "<td>" . $row['Hometown'] . "</td>";
      echo "<td>" . $row['Job'] . "</td>";
      echo "</tr>";
      }
    echo "</table>";
    
    mysql_close($con);
    ?>
    


    1. 実行されている実際のOracleSQLステートメントを確認する方法

    2. SQLでの条件付きUPDATEステートメントの使用

    3. MySQL Workbench:クエリのエラー(1064):1行目の「VISIBLE」付近の構文エラー

    4. エラー:PHPのインストールにWordPressに必要なMySQL拡張機能がないようです