B4J Question [SOLVED]datatable in webapp

[micro]

Hi to all
I'm approaching to use datatable object (the same used by erel in webapp example - DBUtils) to load from time to time several tables in the archive.
The first loading is ok but the next show this message:

I added in jq.RunMethod "bRetrive": True) first the loading table ma is the same.
This my sub:

Sub btarchivi_Click (Params As Map)
    If listarchivi.GetVal.Value = "" Then Return 'in listarchivi i have the table name
    Dim l As List
    l.Initialize
     Dim sql As SQL = pool.GetConnection
    DBUtils.ExecuteList(sql, "SHOW columns FROM " & listarchivi.GetVal.Value, Null, 0, l)
    sql.Close
    tabledata.SetHtml(DBUtils.PreparaHeaderHtml(l))
    Dim sql As SQL = pool.GetConnection
    sql.BeginTransaction
    DBUtils.FillTable(ws, tabledata, sql.ExecQuery("SELECT * FROM " & listarchivi.GetVal.Value))
    sql.TransactionSuccessful
     sql.Close
End Sub

Public Sub FillTable(ws As WebSocket, jq As JQueryElement, rs As ResultSet)
    Dim data As List
    data.Initialize
    Do While rs.NextRow
        Dim row As List
        row.Initialize
        For c = 0 To rs.ColumnCount - 1
            Dim val As String = rs.GetString2(c)
            row.Add(WebUtils.EscapeHtml(val))
        Next
        data.Add(row)
    Loop
    rs.Close
    jq.RunMethod("dataTable", Array As Object(CreateMap("aaData": data, "bFilter": True, _
        "bPaginate": True)))
    ws.RunFunction("addSelectionToTable", Array As Object(jq.Id, "tabledata_SelectedRowChanged"))
    ws.Eval("$(arguments[0]).dataTable().fnClearTable()", Array As Object(jq.Id))
    ws.Eval("$(arguments[0]).dataTable().fnAddData(arguments[1])", Array As Object(jq.Id, data))
End Sub

Sub PreparaHeaderHtml(lista As List) As String
    Dim sb As StringBuilder
    sb.Initialize
    sb.Append($"<thead>
                <tr>
                    "$)
    For i = 0 To lista.Size - 1
        sb.Append("<th>").Append(lista.Get(i)).Append("</th>")                   
    Next
    sb.Append($"</tr>
          </thead>"$)
    Return sb.ToString       
End Sub

Thanks for suggestions

 

[Erel]

Why are you getting two connections from the pool? You only need one.

About the error: https://stackoverflow.com/questions...s-how-to-change-totally-contained-data-aadata

'before you fill the new data
ws.Eval("$(arguments[0]).dataTable().fnDestroy()", Array As Object(jq.Id))

 

[micro]

Code:
'before you fill the new data
ws.Eval("$(arguments[0]).dataTable().fnDestroy()", Array As Object(jq.Id))

Thanks Erel, work well.
I have download all the Datable package and i put it in www folder and change the "href" in index.html.
I have also download the plugin language but I can not understand how to set up the Italian language.

Best regards

 

[micro]

Hi Erel and to the all community,
another question for you web app example DBUtils.
You when click on the datatable, raising the sub SelectedRowChanged that return
only the index of the row clicked.
I would like to receive the whole row as data (array/map)
I'm trying but I can not get over it.
you can give me a tip since I'm not so practical with javascript.

Thanks

 

[MicroDrie]

You can start from the following solution:

Sub TableView1_SelectedRowChanged(Index As Int, Row() As Object)
    If Row = Null Then Return
    Log($"Index: ${Index} Length: ${Row.Length}"$)
    Dim i As Int = 0
    For i = 0 To Row.Length - 1
        Log(i & ": " & Row(i))
    Next
End Sub

Be aware that the tablevieuw could have a selection from a SQLite table that is less then the table columns.

 

[micro]

You can start from the following solution:

Sub TableView1_SelectedRowChanged(Index As Int, Row() As Object)
    If Row = Null Then Return
    Log($"Index: ${Index} Length: ${Row.Length}"$)
    Dim i As Int = 0
    For i = 0 To Row.Length - 1
        Log(i & ": " & Row(i))
    Next
End Sub

Your code is for the B4x controls, datable in my case is html/js object and the approach is different.
In WSDBUtils the sub tabledata_SelectedRowChanged return a map whit index row clicked.
it's possible to retrieve data with another query on the db and use the received index but
I would like to receive data directly from ws

 

[micro]

Thanks anyway
but at the end i solved

In index.htlm in <script> i added this function

function getRowTable(id, eventName) {
        var values = [];
        var count = 0;
        $(id).on("click", "tbody tr", function (event) {
        $(this).find("td").each(function () {
       values[count] = $(this).text();
       count++;
    });
    b4j_raiseEvent(eventName.toLowerCase(), {row : values});
});
    }

In the ws.bas in the Sub FillTable (where populate the table)

ws.RunFunction("getRowTable", Array As Object(jq.Id, "tabledata_SelectRow"))

In the Sub tabledata_SelectRow(Params As Map) i have the data row when i clicked on the row

 

[micro]

Fix the function in index.htlm.
The previous function returned also the rows previous to that clicked.

function getRowTable(id, eventName) {
     var table = $(id).DataTable();
    $(id).on("click", "tbody tr", function(event) {
    var data = table.row($(this)).data();
    b4j_raiseEvent(eventName.toLowerCase(), {row : data});
    });
    }