After the SQLite database Chinook_Sqlite.sqlite (1,067KB) is loaded, we can use any SQL statement.
for 1st button: if click on the row track, it will load the dataset track, in 2nd button: we have datatable feature.
------------------------------------------------------------------------------ live preview: https://pas2js.github.io/master/projSQL/index.html download project: https://pas2js.github.io/master/projSQL/projSQL.rar

Dear MR warley,
Thank you very much for this project. Do you think, that this project could be even used for writing and reading to The Mysql database which resides on server? Or it would be too complex to manage? Thank you for yours answer.

Mgr. Janusz Chmiel wrote

Dear MR warley, Thank you very much for this project. Do you think, that this project could be even used for writing and reading to The Mysql database which resides on server? Or it would be too complex to manage?

No, that requires a different technology altogether. Usually this is done through some REST mechanism.

For example, one such technology is:
https://wiki.freepascal.org/SQLDBRestBridge

Michael.

when I first ran it.
everything worked.
when reloading the page a second time.
nothing works.

already loaded in anonymous mode.

-----
Cristiano Barbosa

An HTML attachment was scrubbed...
URL: <http://lists.freepascal.org/pipermail/pas2js/attachments/20200922/bb73cb44/attachment.htm>

This error is interesting.
It worked for me as expected using Chrome.
...but I have this error using FF

an workaround is:
CTRL SHIFT I -----> to open developer tools
Goto "Network" and confirm the option "[x] Disable Cache"

OK, It is a bit of investigation, and no need to Disable Cache at developer tools,

Look at the following method (the fetch method with the object initialization {cache: "no-store"})

{  Open Async local Sqlite Database file }
procedure OpenSQLiteDBFile(path: String; callBackDB: TProcedureSQLDB);
async;
var
  fetched: TJSResponse;
  buf: TJSPromise; //TJSArrayBuffer;
  dataDB: TJSUint8Array;
begin
  fetched := await(window.fetch( path, new(['cache', 'no-store']) ));
  buf := await (fetched.arrayBuffer());
  dataDB:= TJSUint8Array.New( TJSArrayBuffer(buf) );
  callBackDB( TJSSqliteDatabase.New( dataDB ));
end;
By the way, I had to edit web.pas, I think the correct definition of the
following method would be correct;
function fetch(resource: String; init: TJSObject): TJSResponse;
{TJSPromise;} overload; external name 'fetch';

Fetch returns a promise, not a TJSResponse.

See

https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch

So you will at least need an async modifier if you want to have it return a 'JSResponse'

But for backwards compatibility, this cannot be added with the name 'fetch'.

So I have added it with the name asyncfetch.

Michael.