B4J Question b4j webapp dynamic input checkbox problem appearance with click event

Hi Everyone, I need your valuable help in order to understand what is happening with my dynamic page in b4j.

I have a form, with one input, in this case a checkbox. The form is displayed correctly in the browser, however the checkbox does not allow it to be clicked and therefore the hook does not appear when the checkbox is clicked. It is as if the checkbox does not accept the click and not is possible to see if a user touches it or not. In other words, it never changes the appearance of the empty box, What do I need to make the checkbox work?

Thank you very much in advance for any help.
 

mcqueccu

Well-Known Member
Licensed User
Longtime User
Are you implementing web app using html or you are using webview or form inside B4J?

Check this thread and see if it will be of help
 
Upvote 0
B4J Code:
'Class module

Sub Class_Globals

    Private ws As WebSocket

    Private divlist As JQueryElement

End Sub


Public Sub Initialize

End Sub


Private Sub WebSocket_Connected (WebSocket1 As WebSocket)

    ws = WebSocket1


    Dim str As String = $"

    Active: <input type="checkbox" id="active" value="yes">

    <button type="button" id="btnsubmit">Ok</button>"$


    divlist.SetHtml(str)


End Sub



Sub divlist_Click (Params As Map)

    Dim target As String = Params.Get("target")

    If target.Contains("btnsubmit") Then

        Dim input As JQueryElement = ws.GetElementById("active")

        Log(input.GetVal.Value)

    End If

End Sub


Private Sub WebSocket_Disconnected

End Sub



------------------------------------
this is my index.html
------------------------------------

<!doctype html>

<html>

    <head>

        <meta charset="UTF-8">

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.js"></script>

        <script src="/b4j_ws.js"></script>

    </head>

    <body>

    <h1>Question</h1>

    <div id="divlist"></div>

  

    <script>

    $(document).ready(function() {

        b4j_connect("/questionpage");           

    });

    </script>

    </div>

     </body>

</html>
 
Upvote 0
Thank you for your answers. I had already come across that article, but my problem is different. Sorry that the code had not been shown, I am already attaching it so that you understand me better. I have a B4J Server application, and I modified the number guesser program to show you what is happening to me. For some reason when I dynamically insert a checkbox entry the browser displays it but it doesn't work, it can't be clicked. One clicks on the checkbox but the tick or arrow is not marked.
 
Upvote 0

teddybear

Well-Known Member
Licensed User
B4J Code:
'Class module

Sub divlist_Click (Params As Map)

    Dim target As String = Params.Get("target")

    If target.Contains("btnsubmit") Then

        Dim input As JQueryElement = ws.GetElementById("active")

        Log(input.GetVal.Value)

    End If

End Sub
You need to add a toggle for checkbox status in divlist_Click event.

B4X:
Sub divlist_Click (Params As Map)

    Dim target As String = Params.Get("target")
'====== toggle checkbox =============
    if target = activie then
           if active.GetProp("checked").Value = True then
              active.SetProp("checked", False)
           else
              active.SetProp("checked", True)
          end if
    end if
'===============================
    If target.Contains("btnsubmit") Then

        Dim input As JQueryElement = ws.GetElementById("active")

        Log(input.GetVal.Value)

    End If

End Sub
 
Upvote 0
thank you, thank you teddybear! I got it the idea.

This code work fine:
<code>
Private Sub WebSocket_Connected (WebSocket1 As WebSocket)
ws = WebSocket1
Dim str As String = $"Active: <input type="checkbox" id="active" value="yes">
<button type="button" id="btnsubmit">Ok</button>"$
divlist.SetHtml(str)
End Sub

Sub divlist_Click (Params As Map)
Dim target As String = Params.Get("target")
Log("Click in "&target)
If target = "active" Then
Dim input As JQueryElement = ws.GetElementById(target)
If input.GetProp("checked").Value = True Then
input.SetProp("checked", False)
Else
input.SetProp("checked", True)
End If
End If
If target.Contains("btnsubmit") Then
Dim input As JQueryElement = ws.GetElementById("active")
Log("value of field active="&input.GetProp("checked").Value)
End If
End Sub

</code>
 
Upvote 0
Top