HTML5/Js client-side DB

Question

We're starting development of a client application. No servers, just HTML5/JS. How to organize a local, non-relational, read-only, one-table DB?

Message        | Img       | Code
----------------------------------
File not found | error.png | 15
Access denied  | error.png | 42

We want to query row(s) by a field, say, 'Code = 15'. All files should be local.

Regards,

Raynos · Accepted Answer · 2011-06-07 10:57:40Z

1

If you need cross browser support then I would recommend localStorage.

There is a nice abstraction. store.js that allows you to store keyvalue pairs in the local storage.

Alternatively if you want proper SQL you can use Web SQL but wikipedia claims it's only supported by Opera/Safari/Chrome.

Example of store:

var Row = {
  Message:"File Not Found",
  Img: "error.png",
  Code: 15
}

store.set(Row.Code, Row);
...
store.get("15");

It does rely on JSON which is supported by modern browsers and IE8+. To support older browsers use json2

edited Jun 7, 2011 at 10:57

answered Jun 7, 2011 at 10:31

Raynos

170k57 gold badges359 silver badges399 bronze badges

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

5 Comments

noober Over a year ago

1. How to load a table to the storage the first time? 2. The table has multiple columns, using pairs requires more than a single query.

noober Over a year ago

No, I don't need SQL. Getting a dataset object(s) with a condition ('field =value') is enough.

Raynos Over a year ago

@noober updated with an example. localStorage is a document storage so it's noSQL. You store JSON data by (unique) key.

noober Over a year ago

If I have the table in JS initially, I'd better write a function with operator 'for'. I want to keep the data separately, say, in XML. Since it looks impossible to read local XML file, the best solution is design-time [XML]->[JS array] converter.

Raynos Over a year ago

@noober or keep the the data in JSON rather then XML. Then include it as <script>

Collectives™ on Stack Overflow

HTML5/Js client-side DB

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related