B4J Tutorial SithasoDaisy TailwindCSS UI Toolkit: Q & A

Hi there

NB: Where possible, please include a simple project that demonstrates your use case.

Do you have any questions about SithasoDaisy UI Toolkit?

You can shoot it here and we will oblige.

Thanks in advance?


Join on Telegram

SithasoDaisy

TailwindCSS WebApps using b4x
t.me

Check $5 WebApps

SithasoDaisy WebApps @ $5 Each

Hi there Disclaimer: These WebApps are hosted on Netlify and the back-end hosted on PocketHost (just for demonstration purposes). You will have to set up the SQLite Webserver on your own machine for a better experience. PocketHost is not recommended for production purposes as its slow compared...
www.b4x.com
 
Last edited:
Click to expand...
Gianni M

Gianni M

Well-Known Member
Licensed User
Longtime User
with demo sithasodaisy online https://sithasodaisyui.netlify.app/
into page "Tables - Designer", "AD Table" there is a total footer
B4X: 
Sub Mounted
    Dim summary As Map = SDUITable1.SetFooterTotalSumCountColumns(Array("progress"))
    srowcount = summary.Get("rowcount")
    srowcount = SDUIShared.Thousands(srowcount)
    SDUITable1.SetFooterColumn("avatar", $"Total (${srowcount})"$)
when click on "Next Page" or "Previous Page", footer column HIDE

it's a bug or ???
 
Mashiane

Mashiane

Expert
Licensed User
Longtime User
giannimaione said:
with demo sithasodaisy online https://sithasodaisyui.netlify.app/
into page "Tables - Designer", "AD Table" there is a total footer
B4X: 
Sub Mounted
    Dim summary As Map = SDUITable1.SetFooterTotalSumCountColumns(Array("progress"))
    srowcount = summary.Get("rowcount")
    srowcount = SDUIShared.Thousands(srowcount)
    SDUITable1.SetFooterColumn("avatar", $"Total (${srowcount})"$)
when click on "Next Page" or "Previous Page", footer column HIDE

it's a bug or ???
Click to expand...
Hi, it's by design, you need to have prevpage and nextpage events. Below is an example based on one of my projects. This was highlighted before in the project threads so its understandable to be missed.

B4X: 
'the previous button has been clicked
Private Sub tblbeneficiary_PrevPage (e As BANanoEvent)
    e.PreventDefault
    tblbeneficiary.SetFooterColumn(tblbeneficiary.FirstColumnName, $"Total (${srowcount})"$)
End Sub
'
'the next button has been clicked
Private Sub tblbeneficiary_NextPage (e As BANanoEvent)
    e.PreventDefault
    tblbeneficiary.SetFooterColumn(tblbeneficiary.FirstColumnName, $"Total (${srowcount})"$)
End Sub

Pagination should be true and ItemsPerPage also set also as usual.
 
Gianni M

Gianni M

Well-Known Member
Licensed User
Longtime User
I have a doubt or I don't understand
into AD, we set SDUIPage "Page Name *"
with "The unique name of page this should match yout module 'name' variable

also SDUIRow, property "ParentID", set "The ParentID of this div"

now into module/page "Test1"
we load layout
B4X: 
banano.LoadLayout(app.PageViewer, "namelayout")
and it's OK!

now we have another module/page "Test2"
we load same layout
B4X: 
banano.LoadLayout(app.PageViewer, "namelayout")
it works well

I don't understand!!
I can use a same layout into different module?
 
S

sdleidel

Active Member
Licensed User
Longtime User
BANano.TranspilerOptions.RemoveDeadCode =true
in "Release Mode" this bricks my Webapp with Bannano 9.10
I set it to false and the Web app run...
 
Gianni M

Gianni M

Well-Known Member
Licensed User
Longtime User
usually my code:
B4X: 
BANano.TranspilerOptions.UseServiceWorker = False
    BANano.TranspilerOptions.MinifyOnline = False
    BANano.TranspilerOptions.RemoveDeadCode = False
    BANano.TranspilerOptions.IgnoreWarningsOldBrowsers = True
    BANano.TranspilerOptions.ShowWarningDeadCode = False
    BANano.TranspilerOptions.MergeAllCSSFiles = False
    BANano.TranspilerOptions.MergeAllJavascriptFiles = False
    BANano.TranspilerOptions.EnableLiveCodeSwapping = False
    BANano.TranspilerOptions.DisableShortenVariableNames = True
 
Gianni M

Gianni M

Well-Known Member
Licensed User
Longtime User
is there a technique to create a "collapse" row using "SDUITable" ?
each row can contain 0 to maximum 100 elements;
Each row can have different elements
 
Gianni M

Gianni M

Well-Known Member
Licensed User
Longtime User
SDUIMySQLREST and NextID
problem with generating a unique id

is there a problem of getting the same ID?
B4X: 
Sub NextID As String
    Dim ni As String = "i" & guidAlphaApp(14)
    Return ni
End Sub
and
B4X: 
#if javascript
function guidAlphaAppi(len) {
        var buf = [],
            chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789',
            charlen = chars.length,
            length = len || 32;
            
        for (var i = 0; i < length; i++) {
            buf[i] = chars.charAt(Math.floor(Math.random() * charlen));
        }
        
        return buf.join('');
    }
#end if
 
Mashiane

Mashiane

Expert
Licensed User
Longtime User
Gianni M said:
SDUIMySQLREST and NextID
problem with generating a unique id

is there a problem of getting the same ID?
B4X: 
Sub NextID As String
    Dim ni As String = "i" & guidAlphaApp(14)
    Return ni
End Sub
and
B4X: 
#if javascript
function guidAlphaAppi(len) {
        var buf = [],
            chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789',
            charlen = chars.length,
            length = len || 32;
           
        for (var i = 0; i < length; i++) {
            buf[i] = chars.charAt(Math.floor(Math.random() * charlen));
        }
       
        return buf.join('');
    }
#end if
Click to expand...
As the function is not based on date time, a possibility of a duplicate nextID is possible for a very small margin of cases.

You can define your own function to generate unique ID also for your records. Also when initializing the class you can indicate the auto increment field, which will be generated by your database.
 
Mashiane

Mashiane

Expert
Licensed User
Longtime User
Sivasaravanan said:
dear Anele, can you help me from Bananomssqle result set can be create columns and setitems in SUDItable please help me
Click to expand...
At the moment I dont have SQL Server installed on my PC as I dont use it anywhere, but the principle is the same like BANanoMySQLE or BANanoSQLE. The examples in the SithasoDaisy Demo are a start as the codebase for the database connection classes are 99.9% compatible.

This is discussed here in detail and it uses PHP for the connection.

[BANanoConnect] BANanoSQL+SQLite+MySQL+MSSQL Library

Ola For a while I have been exploring backend connectivity using BANano for BANanoSQL, SQLite, MSSQL and MySQL. The purpose of this lib is for a one place for all your connectivity with these backends. This library as a couple of class utilities for connecting to BANAnoSQL, SQLite, MSSQL and...
www.b4x.com

Initializing tables will be the same everywhere, there are a lot of table examples in the SithasoDaisy Demo of how to add columns and then feed data to the table. Please use that as a reference as there is nothing new that I can tell you. Nothing has changed about that.

As BANanoConnect is rather old technology, I do not recommend using it and rather optioning for the REST API approach to access your DB.

This is discussed here:

[Web] Creating Secure MySQL REST API based WebApps using Api Keys on top of HTTPS

Hi Fam. This tutorial is based on the api.php project, originally posted in the forum on September 9, 2022. See the Related Content section below. This time around we are looking at how we can use Api Keys for Authenticating our MySQL WebApps to make them secure when using REST API...
www.b4x.com

All you have to do is specify your database connection and a REST API is available for you.

Either way, here is a guide on how to connect, add, update, delete, select records using BANanoMSSQLE and how to connect to your database, if you follow this guide the rest would not be hard to pick up. After selecting the records you can then feed the data you want to the UI interface as demonstrated in the SithasoDaisy Demo.

[BANanoMSSQL] PDO CRUD Class for MSSQL

Ola UPDATE 2020-05-23: Please use this library instead This class is for CRUD functionality via a BANano and SQL Server BackEnd. Usage. 1. Update the connection settings in msconnect.php to your database. Add this to the Files tab of your BANano project. 2. Include the attached class to your...
www.b4x.com
 
S

sdleidel

Active Member
Licensed User
Longtime User
Question, Export CSV from a Table...


t: 
Dim content As String = banano.Await(SDUITableProdukte.ExportToCSV(True, ",", True))
app.Download(content, "table2csv.csv")

Give me this error:


sithasodaisy.js:118157 Uncaught (in promise) ReferenceError: Papa is not defined
at banano_sithasodaisy_sduishared.listofmapstocsv (sithasodaisy.js:118157:1)
at _B.exporttocsv (sithasodaisy.js:150335:38)
at banano_bestellsystem_pgartikel.sduitableprodukte_exporttocsv (app1740916586799.js:5121:38)
at HTMLButtonElement.<anonymous> (sithasodaisy.js:13207:154)
at HTMLButtonElement.n (bananocore9.10.js:8:5659)

Papa ?
 
Mashiane

Mashiane

Expert
Licensed User
Longtime User
sdleidel said:
Question, Export CSV from a Table...


t: 
Dim content As String = banano.Await(SDUITableProdukte.ExportToCSV(True, ",", True))
app.Download(content, "table2csv.csv")

Give me this error:


sithasodaisy.js:118157 Uncaught (in promise) ReferenceError: Papa is not defined
at banano_sithasodaisy_sduishared.listofmapstocsv (sithasodaisy.js:118157:1)
at _B.exporttocsv (sithasodaisy.js:150335:38)
at banano_bestellsystem_pgartikel.sduitableprodukte_exporttocsv (app1740916586799.js:5121:38)
at HTMLButtonElement.<anonymous> (sithasodaisy.js:13207:154)
at HTMLButtonElement.n (bananocore9.10.js:8:5659)

Papa ?
Click to expand...
Include SithasoDaisyCSV library in your project and

Call BANano.Await(app.UsesCSV) just after you call app.Initialize
 
Gianni M

Gianni M

Well-Known Member
Licensed User
Longtime User
with SDUIToastChart (Chart Type = column), there are a List Values with positive and negative value;
example: 12, 36, -14, 22, 7, -8, 42 and another;
SDUIToastChart display correctly chart;
question:
can I color the negative columns red?
1740999479663.png
 
S

sdleidel

Active Member
Licensed User
Longtime User
I have a problem with the import.

First try, it worked.
But in the "mycsv_complete sub" results and fileObj are undefined.
Second try i have this error...

app1741607891566.js:5243 Uncaught TypeError: Cannot add property 7, object is not extensible
at Array.push (<anonymous>)
at banano_bestellsystem_pgartikel.mycsv_step (app1741607891566.js:5243:23)
at Worker._stepcb [as userStep] (sithasodaisy.js:118114:133)
at Worker._ (papaparse.min.js:7:17573)


12: 
'use fetch to get the file contents
Dim csvData As String = banano.Await(banano.GetFileAsText("./assets/data.csv", Null, "utf8"))
'parse the file contents and retrieve items on complete
SDUIShared.ImportCSV(Me, "mycsv", csvData, "", true, true, "ISO-8859-1")

'will fire in each iteration
Sub mycsv_step(results As Map, parserObj As BANanoObject)
End Sub

'will fire when completed
Sub mycsv_complete(results As Map, fileObj As BANAnoObject)
Dim data As list = results.get("data")
Dim errors As List = results.get("errors")
Dim meta As Map = results.get("meta")
Dim fields As List = meta.get("fields")
End Sub
 
Mashiane

Mashiane

Expert
Licensed User
Longtime User
sdleidel said:
I have a problem with the import.

First try, it worked.
But in the "mycsv_complete sub" results and fileObj are undefined.
Second try i have this error...

app1741607891566.js:5243 Uncaught TypeError: Cannot add property 7, object is not extensible
at Array.push (<anonymous>)
at banano_bestellsystem_pgartikel.mycsv_step (app1741607891566.js:5243:23)
at Worker._stepcb [as userStep] (sithasodaisy.js:118114:133)
at Worker._ (papaparse.min.js:7:17573)


12: 
'use fetch to get the file contents
Dim csvData As String = banano.Await(banano.GetFileAsText("./assets/data.csv", Null, "utf8"))
'parse the file contents and retrieve items on complete
SDUIShared.ImportCSV(Me, "mycsv", csvData, "", true, true, "ISO-8859-1")

'will fire in each iteration
Sub mycsv_step(results As Map, parserObj As BANanoObject)
End Sub

'will fire when completed
Sub mycsv_complete(results As Map, fileObj As BANAnoObject)
Dim data As list = results.get("data")
Dim errors As List = results.get("errors")
Dim meta As Map = results.get("meta")
Dim fields As List = meta.get("fields")
End Sub
Click to expand...
Is MergeCSS and MergeJS on? if so try and turn it off. I cant reproduce this. Rather send me a simple project that reproduces this please.
 
You must log in or register to reply here.

Similar Threads

Mashiane
  • Article
Share My Creation [Web][SithasoIONIC7] Country Picker UI
Replies
0
Views
750
Mashiane
Mashiane
Mashiane
  • Article
B4J Tutorial [Web] SithasoIONIC7 - Mastering SwiperJS / Sliders
Replies
1
Views
706
Mashiane
Mashiane
Mashiane
  • Article
B4J Tutorial [Web] [SithasoDaisy2]- Installing SithasoDaisy and creating you first TailwindCSS & DaisyUI WebApp using b4x
Replies
0
Views
1K
Mashiane
Mashiane
Mashiane
  • Article
B4J Library [Web] SithasoDaisy2: TailwindCss WebApps powered by B4x & BANano
3 4 5
Replies
87
Views
19K
Mashiane
Mashiane
Mashiane
  • Article
Share My Creation [Web] SithasoDaisy: TailwindCSS + DaisyUI Toolbox
3 4 5
Replies
84
Views
21K
Mashiane
Mashiane
Top