Encountering a version error with the Web SQL database when trying to insert a second record

When I tried to insert an employee record using an HTML form, the data was supposed to be saved in the browser's database (webSQL). However, upon submitting the second record, I encountered an error stating "unable to open database, version mismatch, '1.0' does not match the currentVersion of ''". Can someone provide suggestions on how to resolve this issue?

Below is the code snippet that corresponds to this functionality:

function myFunction() {
        debugger;
        var obj = {};
        obj.first_name = $("#txtFirstName").val();
        obj.last_name = $("#txtLastName").val();
        obj.qualification = $("#txtQualication").val();
        obj.age = $("#txtAge").val();

        if (typeof (Storage) !== "undefined") {
            // WebSQL supported
            var localStorage = openDatabase('dbemp', '1.0', 'employees database', 2 * 1024 * 1024, function () {
                console.log("created/found database");
            });

            var success = function () {
                $("#txtFirstName").val("");
                $("#txtLastName").val("");
                $("#txtQualication").val("");
                $("#txtAge").val("");
            };

            var failure = function () {
                alert('Records could not be saved');
            };

            localStorage.transaction(function (tx) {
                tx.executeSql('CREATE TABLE IF NOT EXISTS employee (first_name, last_name, qualification, age)', function () {
                    console.log("created table");
                }, function () {
                    tx.executeSql('INSERT INTO employee (first_name, last_name, qualification, age) VALUES (?, ?, ?, ?)',
                    [obj.first_name, obj.last_name, obj.qualification, obj.age],success,failure);
                    console.log("Successfully inserted record..");
                    alert('Record saved locally');
                });
            });

        } else {
            console.log("NOT SUPPORTED");
        }
    }

Answer №1

Did you know that your local storage essentially functions as the Web SQL database within your browser? The issue you're currently facing stems from attempting to access a pre-existing database with version '' and then changing it to '1.0'. To resolve this, simply adjust the version number accordingly.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Make changes to external CSS using HTML and JavaScript

Is it possible to dynamically change the value of a background in an external CSS file using JavaScript? Currently, all my pages are connected to a CSS file that controls the background for each page. I am attempting to modify the background by clicking a ...

showing images received via a websocket connection

My current setup involves receiving one image per second through a WebSocket connection. The images are in blob format, and I am unsure of the best way to display them. Should I use an image tag or a video player? And how should I go about showing these ...

Tips for utilizing the AngularJS filter to group by two columns in Angular

In my array of objects, each item has three properties: 1. name 2. team 3. age http://jsfiddle.net/HpTDj/46/ I have successfully grouped the items by team, but I am unsure how to group them by both team and age in my current code. I want to display the ...

The NodeJs and Express API, integrated with Ejs files, encounters a crash when attempting to retrieve data from the database on the second attempt

I've been assigned the task of developing an API that retrieves data from a database and presents it on the frontend. This is my first time working with APIs, and I've encountered some challenges along the way. The database I'm using is call ...

Searching for a user's first name and last name in mongoDB and retrieving the entire object

My goal is to locate my users in the database by searching for both their first and last names, and then retrieving the complete object of each user. However, my current code only returns the concatenated `firstName` and `lastName` as `name` along with the ...

Is there a way to adjust this validation logic so that it permits the entry of both regular characters and certain special characters?

Currently, the input field only accepts characters. If any other type of character is entered, an error will be thrown as shown in the code below. How can I update this logic to allow not only letters but also special characters like hyphens and apostrop ...

ReactJs CSS - This file type requires a specific loader for processing. There are currently no loaders configured to handle this file

I've noticed that this issue has been raised multiple times before. Despite going through all the questions, I still can't seem to resolve it. The transition from Typescript to Javascript went smoothly until I reached the implementation of CSS. U ...

Reset the counter variable when a certain condition is met

I am facing an issue with my simple "pagination" counter that fetches the next page from an API. The problem arises when I switch between different categories, such as movies or series, because the counter does not reset. Instead of starting again from the ...

What is the best way to implement dynamic generation of Form::date() in Laravel 8?

Is there a way to dynamically generate the Form::date() based on the selection of 1? If 1 is selected, then display the Form::date() under the Form::select(). However, if 0 is selected, then hide the Form::date() in this particular view. For example: Sel ...

When trying to extract information from a v-for loop and pass it into a method, I keep

After sending an array of data objects into a child component via props, I proceeded to use a v-for loop to display the elements exactly how I intended: <div class="col-md-3" v-for="product in products" :key="product.id" v ...

Having trouble with Q.all not functioning properly in Node.js promises

I am struggling with a readLines function that I created to parse text line by line. It is being called from: var fs = require('fs'); var Q = require('q'); Q.all(readLines(fs.createReadStream("/tmp/test.txt"), console.log)).then(funct ...

Error with AngularJS: IE not showing dropdown options for MultiSelect

My application features a multiselect dropdown menu that shows a list of countries. While this dropdown functions correctly in Chrome, it displays options differently in IE as shown below: https://i.stack.imgur.com/xhOmV.png I have attempted to adjust th ...

Utilize jQuery to invoke an ASP page method from an HTML page

I have a static web page named index.html which includes text boxes for data input. My goal is to send this data to an ASP page called Default.aspx using jQuery/AJAX. I attempted the following: $.ajax({ url: "Default.aspx/GetData", ...

Learn how to access a variable within the Watch function using a directive in Angular framework

I'm new to Angular and encountering some issues with the watch function. I am trying to track changes in a variable inside a controller, and once the value of this variable changes, I want to pass that updated value to a directive. Below is the code ...

Create a loop to iterate through dates within a specified range using the Fetch API

When I need to get the exchange rate from the bank for a specific interval specified in the input, I follow these steps. The interval is defined as [startdate; enddate]. However, in order to make a successful request to the bank, the selected dates must be ...

Retrieve the user ID by utilizing the phonegap login feature integrated with Facebook

I'm working on a feature that lets users upload photos to my server once they log in using their Facebook credentials. I'm currently using the phonegap facebook plugin for Android. How can I retrieve their unique user ID from the Facebook SDK? Al ...

To utilize a spread argument, it is essential for it to either be in tuple form or be supplied to a rest

I am currently learning TypeScript and working on converting my project to TypeScript. However, I encountered an error while trying to use spread arguments. I have researched this topic, but I am still unsure of the correct usage. Here is my current appro ...

Real-time Broadcasts Straight to Your Web Browser

Feeling a bit frustrated with my current situation. I am eager to stream a live video broadcast to a web browser. At the moment, I am utilizing ffmpeg to stream a directshow live source as a webm stream to node.js, which then sends the stream to the http ...

Tiny cutout circle nestled within a larger circle, subtly placed in the bottom right corner using Bootstrap

In my JavaScript code, I have created an array of images arranged in a row on the webpage using the split method. The images are displayed in circles. However, I now need to add a smaller circle cutout at the bottom right of each larger circle to showcase ...

Determine the length of the result from using the Array.prototype.some() method

I have a conditional that is being checked using Array.prototype.some(). Take this array for example: const coolArray = [ { isCool: false }, { isCool: false }, { isCool: true } ] const isCool = coolArray.some(item => item.isCool === true) if (i ...