Integracja BANano z bootstrap, wykrywanie zdarzenia

luki_c · Sunday at 7:53 PM

Witam, nie umiem sobie poradzić z pewnym kawałkiem kodu. Chcę mieć kilka "paneli" które buduję w bootsrap studio:

HTML:

<body id="main">
    <div id="pnl1" class="pn">
        <div class="row">
            <div class="col col-lg-3 col-xxl-1">
                <div class="input-group bg-transparent pe-1 form-control"><button class="btn btn-primary" type="button">HEX</button><input class="form-control numfield adres" type="number" placeholder="Adres Modbus" min="0" max="247" step="1" value="1"></div>
            </div>
            <div class="col col-xxl-1"><select class="form-control numfield register">
                    <optgroup label="Rejestry IO">
                        <option value="1">Odczyt bitów: 0x01</option>
                        <option value="2">Zapis bitów: 0x02</option>
                        <option value="3" selected="">Odczyt rejestrów: 0x03</option>
                        <option value="4">Zapis rejestrów wej: 0x04</option>
                        <option value="5">Zapis poj wyjścia 0x05</option>
                        <option value="6">Zapis poj rejestru: 0x06</option>
                        <option value="15">Zapis stanu wielu wyjść: 0x0F</option>
                        <option value="16">Zapis wielu rej:0x10</option>
                        <option value="20">Zapis pliku: 0x14</option>
                        <option value="21">Odczyt pliku: 0x15</option>
                    </optgroup>
                </select></div>
            <div class="col col-xxl-1"><input type="number" class="form-control numfield regstart" max="255" step="1" placeholder="rejestr startowy" value="0"></div>
            <div class="col col-xxl-1"><input type="number" class="form-control numfield numword" min="0" max="255" step="1" placeholder="ile odczytać" value="2"></div>
        </div>
        <div class="row">
            <div class="col offset-lg-4"><label class="col-form-label text-uppercase fs-3 fw-semibold fst-normal text-center outlbl" for="lblout">--:--:--:--:--:--</label></div>
        </div>
    </div>
    <div id="pnl2" class="pn">
        <div class="row">
            <div class="col col-lg-3 col-xxl-1">
                <div class="input-group bg-transparent pe-1 form-control"><button class="btn btn-primary" type="button">HEX</button><input class="form-control numfield adres" type="number" placeholder="Adres Modbus" min="0" max="247" step="1" value="1"></div>
            </div>
            <div class="col col-xxl-1"><select class="form-control numfield register">
                    <optgroup label="Rejestry IO">
                        <option value="1">Odczyt bitów: 0x01</option>
                        <option value="2">Zapis bitów: 0x02</option>
                        <option value="3" selected="">Odczyt rejestrów: 0x03</option>
                        <option value="4">Zapis rejestrów wej: 0x04</option>
                        <option value="5">Zapis poj wyjścia 0x05</option>
                        <option value="6">Zapis poj rejestru: 0x06</option>
                        <option value="15">Zapis stanu wielu wyjść: 0x0F</option>
                        <option value="16">Zapis wielu rej:0x10</option>
                        <option value="20">Zapis pliku: 0x14</option>
                        <option value="21">Odczyt pliku: 0x15</option>
                    </optgroup>
                </select></div>
            <div class="col col-xxl-1"><input type="number" class="form-control numfield regstart" max="255" step="1" placeholder="rejestr startowy" value="0"></div>
            <div class="col col-xxl-1"><input type="number" class="form-control numfield numword" min="0" max="255" step="1" placeholder="ile odczytać" value="2"></div>
        </div>
        <div class="row">
            <div class="col offset-lg-4"><label class="col-form-label text-uppercase fs-3 fw-semibold fst-normal text-center outlbl" for="lblout">--:--:--:--:--:--</label></div>
        </div>
    </div>

Następnie przypisanie uchwytu:

B4X:

Sub BANano_Ready()

    Dim panels As BANanoElement = BANano.GetElement(".pn") 'class
    Dim panel As BANanoElement
    Dim idx As Int

    panels.EachStart(panel, idx)
    Log($"Panel ${panel.GetAttr("id")}"$)
  
    panels.EachEnd
'    out_lbl_update_tekst 
    BANano.GetElement(".numfield").On("change", Me, "Field_Changed")
                '         numFields.On("input", Me, "NumField_Input")

End Sub

oraz:

B4X:

Sub Field_Changed(e As BANanoEvent)
    Dim el As BANanoElement = BANano.ToElement(e.Target)
    Dim parentPanel As BANanoElement = el.Closest(".pn")
    Dim panelId As String = parentPanel.GetAttr("id")

    Log($"Zmiana w panelu: ${panelId}, element: ${el.GetAttr("class")}, wartość: ${el.GetValue}"$)
End Sub

W jaki sposób dowiedzieć się z którego panelu wystąpił event? Walczę z tym kilka dni, i nie umiem sobie poradzić
Dziękuję

Integracja BANano z bootstrap, wykrywanie zdarzenia

luki_c

Member

Privacy & Transparency

Privacy & Transparency