0

を使用して HTML フォームから SQLite にデータを渡すことができませんgetElementById。

これは、永続的なストレージとして SQLite を使用する方法を学習するための非常に単純なコードです。

私のコード:

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
var db = openDatabase('sightings', '1.0', 'Test DB', 2 * 1024 * 1024);
var msg;


function InsertValues() {
var mydata = document.getElementById("CommonName").value;
db.transaction(function (tx) {      
  tx.executeSql('CREATE TABLE IF NOT EXISTS Sights (CommonName CHAR(17), location CHAR(32), datte CHAR(10), Observations CHAR(90))');
  tx.executeSql('INSERT INTO Sights (CommonName,location,datte,Observations) VALUES (mydata,"loobo","loobo","loobo")');
  msg = '<p>Log message created and row inserted.</p>';
  document.querySelector('#status').innerHTML =  msg;
});
}


function myfunction2() {
db.transaction(function (tx) {
  tx.executeSql('SELECT * FROM Sights', [], function (tx, results) {
   var len = results.rows.length, i;
   msg = "<p>Found rows: " + len + "</p>";
   document.querySelector('#status').innerHTML +=  msg;
   for (i = 0; i < len; i++){
     msg = "<p><b>" + results.rows.item(i).CommonName + "</b></p>";
     document.querySelector('#status').innerHTML +=  msg;
   }
 }, null);
});
}
</script>

</head>


<body>
<div class="observation">
  <h1></h1>
  <form action="#" method="post">
    <fieldset>
      <label for="name" >Common Name:</label>
      <input type="text" id="CommonName" placeholder=" Bird common Name" />
      <label for="name" >Location:</label>
      <input type="text" id="location" placeholder=" Where you see it" />
      <label for="email">Date</label>
      <input type="date" id="date" placeholder="mm/dd/yyy" /> 
      <label for="message">Observations:</label>
      <textarea id=" Observations" placeholder="What you see"></textarea>    
    <input type="submit" value="Register" onclick="InsertValues();">        
    </fieldset>
  </form>

</div>

 <script type="text/javascript">
            myfunction2();
 </script>
<div id="status" name="status">Status Message</div>

</body>
</html>

HTML フォームから SQLite へのデータ フローを妨げている問題は何ですか?

4

1 に答える 1