B4J Tutorial [WebApp] Example Task Manager using WebSockets & SQLite

This example is a simple Task Manager using HTML to access the server by the Client.
The tasks are stored in a SQLite database, which is managed by the B4J WebServer.
Read b4jhowtowebapptaskmgr.b4j for more information.

b4jhowtowebapptaskmgr.png


Start the WebServer (jar file) and the Task Manager
Load taskmgr.b4j and then run OR start from the Objects folder java -jar taskmgr.jar.
Access the task list by opening a webbrowser and enter localhost:51042.
To access from another computer in the network, use its http://ipaddress:51042 (like http://192.168.0.10:51042).

How the Task Manager works?
After starting the webserver and accessing by using http://ipaddress:51042, the HTML file /objects/index.html is loaded.
Index.html actions the handler taskmgr.bas.
The taskmgr.bas handler selects the records from the database taskmgr.db (in the objects folder) using jQuery and updates the embedding task table.

Buttons
Add: adds a new task to the taskmgr.db
Update: updates the selected task to the taskmgr.db
Delete: deletes the selected task from the taskmgr.db
Delete All: delete all tasks from the taskmgr.db
About: Information about this WebApp TaskMgr

Download the Task Manager: http://www.rwblinn.de/b4j/b4jhowto/examples/b4jhowtowebapptaskmgr.zip

Additional Notes
  • Clicking on Date, a DatePicker is shown based upon jQuery UI DatePicker.
  • To learn more about jQuery, this sample app will be developed further.
  • Find further hints in the B4J HOWTOs http://www.rwblinn.de/b4j/b4jhowto/index.htm
Additional Links
B4J WebApps Overview:
http://www.b4x.com/android/forum/threads/webapp-web-apps-overview.39811/

Building web servers with B4J:
http://www.b4x.com/android/forum/threads/Server-building-web-servers-with-b4j.37172/

Upload files from your B4A app to your B4J server over the internet:
http://www.b4x.com/android/forum/th...p-To-your-b4j-Server-over-the-internet.37201/

jQuery
http://www.jquery.com
http://learn.jquery.com/

JQueryElement providing access to all jQuery elements methods:
http://api.jquery.com/

More to follow while learning ;)
 

rwblinn

Well-Known Member
Licensed User
Longtime User
Hi Billzhan,

thanks a lot - have made some entries :). Works fine - good to see B4J WebServer in action.
 

luke2012

Well-Known Member
Licensed User
Longtime User
This example is a simple Task Manager using HTML to access the server by the Client.
The tasks are stored in a SQLite database, which is managed by the B4J WebServer.
Read b4jhowtowebapptaskmgr.b4j for more information.

b4jhowtowebapptaskmgr.png


Start the WebServer (jar file) and the Task Manager
Load taskmgr.b4j and then run OR start from the Objects folder java -jar taskmgr.jar.
Access the task list by opening a webbrowser and enter localhost:51042.
To access from another computer in the network, use its http://ipaddress:51042 (like http://192.168.0.10:51042).

How the Task Manager works?
After starting the webserver and accessing by using http://ipaddress:51042, the HTML file /objects/index.html is loaded.
Index.html actions the handler taskmgr.bas.
The taskmgr.bas handler selects the records from the database taskmgr.db (in the objects folder) using jQuery and updates the embedding task table.

Buttons
Add: adds a new task to the taskmgr.db
Update: updates the selected task to the taskmgr.db
Delete: deletes the selected task from the taskmgr.db
Delete All: delete all tasks from the taskmgr.db
About: Information about this WebApp TaskMgr

Download the Task Manager: http://www.rwblinn.de/b4j/b4jhowto/examples/b4jhowtowebapptaskmgr.zip

Additional Notes
  • Clicking on Date, a DatePicker is shown based upon jQuery UI DatePicker.
  • To learn more about jQuery, this sample app will be developed further.
  • Find further hints in the B4J HOWTOs http://www.rwblinn.de/b4j/b4jhowto/index.htm
Additional Links
B4J WebApps Overview:
http://www.b4x.com/android/forum/threads/webapp-web-apps-overview.39811/

Building web servers with B4J:
http://www.b4x.com/android/forum/threads/Server-building-web-servers-with-b4j.37172/

Upload files from your B4A app to your B4J server over the internet:
http://www.b4x.com/android/forum/th...p-To-your-b4j-Server-over-the-internet.37201/

jQuery
http://www.jquery.com
http://learn.jquery.com/

JQueryElement providing access to all jQuery elements methods:
http://api.jquery.com/

More to follow while learning ;)

My compliments! Outstanding work !
I developed using HTML, Javascript & JQuery in the recent past within other platforms and this is a great opportunity to apply my knowledge :)
 

rwblinn

Well-Known Member
Licensed User
Longtime User
Thanks for feedback :)

To note:
Amendments have been made in the mean time (download the latest version - see post #1).
It runs since a few weeks (smooth) on a RasPi Home Server (being accessed via duckdns.org).
 
Top