B4J Question [BANANO] JQWidget integration question

[Luk]

Hi,

I'm looking at BANano and possible integration with JQWidgets.
How can I do the following in BANano:

$("#jqxButton").jqxButton({ width: 120, height: 40 });

Thanks.

 

[Kiffi]

 

[alwaysbusy]

@Kiffi Your gifs always crack me up!

 

[Luk]

Here I am ... again

I'm trying to catch the buttonClick event, but it's not working ...
This is some code from my jqxForm class:

public Sub AddToParent(targetID As String)
    mTarget = BANano.GetElement("#" & targetID.ToLowerCase)

    If BANano.Exists("#" & mName) = False Then
        mElement = mTarget.Append($"<div id="${mName}" style="${mStyle}"></div>"$).Get("#" & mName)       
    End If
   
    Dim JQuery As BANanoObject
    JQuery.Initialize("$")
    mObject = JQuery.Selector("#" & mName)
   
    'Create widget
    SetProp(mProp)
   
    'Events
    BANano.GetElement("#" & mName).On("buttonclick", mCallBack, mEventName & "_buttonclick")
End Sub

...

Creating the form is no problem...

    Dim a,b,c, d, e As Map
   
    a = CreateMap("bind":"firstname","type":"text","label":"Firstname","labelwidth":"80px","width":"250px")
    b = CreateMap("type":"blank","rowHeight":"10px")
    c = CreateMap("type":"button","text":"Sign up","width":"90px","align":"right","columnWidth":"50%")
    e = CreateMap("type":"button","text":"Cancel","width":"90px","height":"30px","columnWidth":"50%","rowHeight":"40px")
    d = CreateMap("columns":Array(c,e))
   
    Dim m As Object = Array(a,b,d)
   
    Form.Initialize(Me, "sampleForm","sampleForm")
    Form.style="width: 400px; height: auto;"
    Form.SetProp(CreateMap("template":m, "padding":"{ left: 10, top: 10, right: 10, bottom: 10 }"))
    Form.AddToParent("body")

This is the working code in javascript ...

  $('#sampleForm').jqxForm({
                template: template,
                value: sampleValue,
                padding: { left: 10, top: 10, right: 10, bottom: 10 }
    });
    $('#sampleForm').on('buttonClick', function (event) {
    var args = event.args;
    var text = args.text // clicked button's text.;
    var name = args.name // clicked button's name.;
});

Thanks.

 

[Kiffi]

not tested, but what happens, if you use On("buttonClick"... (with an uppercased 'C')?

 

[Luk]

not tested, but what happens, if you use On("buttonClick"... (with an uppercased 'C')?

There seems to be some difference between using BANanoObject method and BANanoElement apparently:

Working

Dim event As BANanoEvent
    mObject.RunMethod("on", Array("buttonClick", BANano.CallBack(mCallBack, mEventName & "_buttonclick", event)))

Not working

BANano.GetElement("#" & mName).On("buttonClick", mCallBack, mEventName & "_buttonclick")

Hope to share some examples soon ...

 

[alwaysbusy]

Yes, there is a difference. The BANanoElement is an Umbrella Element, with its own event system. It only works if it starts from scratch using BANanoElements.

In your example, you are using an extranal library which uses a non Umbrella object.

In short:

Every BANanoElement can become a BANanoObject
Not every BANanoObject can become a BANanoElement