Inserting dates in database (the browser database) using JavaScript

Question

I've been working on a college project for which I need to use dates and enter them in the database (the built-in one in the Chrome browser). To be specific, I'll be taking a date from the user and enter it in the database.

The HTML code goes like this:

<html>
<head>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
</head>
<body>
  <input type="date" id="dt">
  <input type="button" id="submit" value="INSERT DATE">
</body>
<script type="text/javascript" src="js/index.js"></script>
</html>

And the JavaScript:

var db = openDatabase("Dates", "1.0", "Test Dates", 200000);
var createStatement = "CREATE TABLE IF NOT EXISTS Date (sampledate DATE)";
var insertStatement = "INSERT INTO Date (sampledate) VALUES (?)";

db.transaction(function(tx) {
  tx.executeSql(createStatement, []);
});

$(document).ready(function() {
  $("body").fadeIn(2000);
  $("#submit").click(insertdate);
});

function insertdate() {
  var datetemp = $("#dt");
  db.transaction(function(tx) {
    tx.executeSql(insertStatement, [datetemp])
  })
  alert("SUCCESS");
}

This is what I get in the database:

So it'd be really great if I get some help!

Welcome to stackoverflow. What is your question? What is the expected result? — Observer
– Observer, Commented Jul 19, 2018 at 16:58
Should be aware that WebSql is a deprecated API. Might want to migrate to indexedDB — charlietfl
– charlietfl, Commented Jul 19, 2018 at 16:58

Marcio Martins · Accepted Answer · 2018-07-19 17:24:21Z

1

You are passing $("#dt") to the database, which is an jQuery encapsulated object that contains your input DOM object.

Just change this line:

var datetemp = $("#dt");

To this:

var datetemp = $("#dt").val();

It should work fine!

Hope it helps!

answered Jul 19, 2018 at 17:24

Marcio Martins

3504 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vijay · Accepted Answer · 2018-07-19 17:14:55Z

0

You are passing the datetime object instead of text box value use Val function in Jquery var datetemp = $("#dt").val();

answered Jul 19, 2018 at 17:14

Vijay

1365 bronze badges

Comments

Alice Fluff · Accepted Answer · 2018-07-19 17:28:25Z

You are passing [datetemp] as an object.

function insertdate()
{
    var datetemp = $("#dt");
    db.transaction(function(tx)
                  {
        tx.executeSql(insertStatement, [datetemp])    // your passing the object here
        })
    alert("SUCCESS");
}

You need to iterate through this object and get the values. Write them to an array.

[datetemp].forEach(function(value){    // iterating through it . . .
    // do stuff here . . . (i.e inert values in to array)
});

Then add database

var insertStatement = "INSERT INTO Date [dbo].[sampledate] (col0, col1, col2 
// ect . . .) VALUES ([array].day, [array].month, [array].year // ect . . .)";

function insertdate()
{
    var datetemp = $("#dt");
    db.transaction(function(tx)
                  {
        tx.executeSql(insertStatement)    // just take the object out
        })
    alert("SUCCESS");
}

OR

Change the insert command and put that after you have the [datetime] this would be simplier :)

var insertStatement = "INSERT INTO Date [dbo].[sampledate] (col0, col1, col2 
// ect . . .) VALUES ([datetemp].day, [datetemp].month, [datetemp].year  // 
ect . . .))";

function insertdate()
{
    var datetemp = $("#dt");
    db.transaction(function(tx)
                  {
        tx.executeSql(insertStatement)    // just take the object out
        })
    alert("SUCCESS");
}

Collectives™ on Stack Overflow

Inserting dates in database (the browser database) using JavaScript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related