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.

 

[alwaysbusy]

Without knowing JQWidgets, I think something like that:

Dim jQ as BANanoObject
jQ.Initialize("$")
JQ.Selector("#jqxButton").RunMethod("jqxButton", CreateMap("width": 120, "height": 40))

Note that the JQ declaration can be done once in the Global

 

[Kiffi]

Argh! Alain beats me

But nevertheless:

Sub Process_Globals
 
  Private BANano As BANano
 
End Sub

Sub AppStart (Form1 As Form, Args() As String)

  BANano.Initialize("BANanoJQWidgets", "BANanoJQWidgets", 1)
 
  BANano.UseServiceWorker = False
 
  BANano.HTML_NAME = "index.html"
 
  BANano.Header.Title = "BANanoJQWidgets"

  BANano.Header.AddCSSFile("https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css")
 
  BANano.Header.AddJavascriptFile("https://code.jquery.com/jquery-3.3.1.min.js")
 
  BANano.Header.AddJavascriptFile("https://jqwidgets.com/public/jqwidgets/jqx-all.js")

  BANano.Build("C:\inetpub\wwwroot\BANano\") ' <-- adjust to your needs!

  ExitApplication

End Sub

Sub BANanoJQWidgets_Ready()

  Dim HTML As String = $"<input type="button" value="Button" id="jqxbutton" />"$
 
  BANano.GetElement("body").Append(HTML)
 
  Dim jQuery As BANanoObject
 
  jQuery.Initialize("$")
 
  jQuery.Selector("#jqxbutton").RunMethod("jqxButton", CreateMap("width":"150", "height":"50"))
 
End Sub

 

[alwaysbusy]

@Kiffi But yours is much more complete!

 

[Luk]

Trying to create my first BANano class ... Exciting times

How can I add the change event to the jqRating widget ?
(Attached, you'll find a small project that wraps the jqRating widget.)

More information about the jqRating widget can be found at
(https://www.jqwidgets.com/jquery-wi....htm#demos/jqxrating/defaultfunctionality.htm)

Is this the way to go to create a jqWidget wrapper for BANano ?

Thanks.

 

[alwaysbusy]

As you are using jQuery, just continue with it:

Dim event As BANanoEvent ' dummy declaration so B4J doesn't give an error in the next line for the param of the callback
mJRating.RunMethod("bind", Array("change", BANano.CallBack(mCallBack, mEventName & "_change", event))) ' _change must be lowercase!

Is this the way to go to create a jqWidget wrapper for BANano ?

Absolutely! As you are making it as a Custom View, you can just use the Abstract Designer, drop one of your jqxRating objects on in and use the generate members method. Just adding some simple normal B4J code et voila!

e.g. does the same as your manual code:

Sub BANanoJQWidgets_Ready()
   BANano.LoadLayout("#body", "layout1")
End Sub

Sub jqxRating1_Change (event As BANanoEvent)
   BANano.Alert("ok")
End Sub

Alwaysbusy

 

[alwaysbusy]

For the moment, to get the value from the event you will have to use this workaround:

Sub jqxRating1_Change (event As BANanoEvent)
   Dim ev As BANanoObject
   ev.Initialize(event)
   Log(ev.GetField("value"))
   BANano.Alert("ok")
End Sub

I'll add .value and a method .otherField(name) for any other field which is not wrapped.

So this will do the same:

Log(event.Value)   
Log(event.OtherField("value"))

 

[Kiffi]

I'll add .value and a method .otherField(name) for any other field which is not wrapped.

very good!

Greetings ... Peter

 

[alwaysbusy]

2.39 with this feature can now be downloaded:

Download: https://www.b4x.com/android/forum/t...library-with-abstract-designer-support.99740/

 

[Luk]

Here I am again

I'm trying to call the function disable.

$('#jqxRating').jqxRating('disable');

But the following is not working:

mJRating.RunMethod("jqxRating","").RunMethod("disable","")

(I'm using version 2.39)

Thanks.

 

[alwaysbusy]

Shouldn't it be? (untested)

mJRating.RunMethod("jqxRating","disable")

as 'disable' seems like a param of the method jqxRating

 

[Luk]

Shouldn't it be? (untested)

mJRating.RunMethod("jqxRating","disable")

as 'disable' seems like a param of the method jqxRating

It's working like a charm now. Thanks !

 

[Kiffi]

From the jQWidgets-Documentation (here for a jqxButton-button):

To set a property(option), you need to pass the property name and value(s) in the jqxButton's constructor.
$("#jqxbutton").jqxButton({ disabled: true });

so, the BANanoCode looks like this:

jQuery.Selector("#jqxbutton").RunMethod("jqxButton", CreateMap("disabled":True))

// Edit: Note to me: always wait at least one hour for Alain before I answer.

 

[Luk]

Another question ...

Using

j = BANano.Window.GetField("JQXElements")

I can obtain the JQXElements object, but how can I do the following ?

JQXElements.settings["buttonSettings"] =
        {
           width:120,height:40, value:"Button", theme:"light"
        }

Creating the wrong code was no problem

j.RunMethod("buttonSettings", CreateMap("width":120, "height":40,"theme":"light","value":"button"))

Thanks

 

[Kiffi]

untested:

j.RunMethod("settings", Array("buttonSettings", CreateMap("width":120, "height":40,"theme":"light","value":"button")))

 

[alwaysbusy]

Untested, but try this:

Dim j As BANanoObject = BANano.Window.GetField("JQXElements").GetField("settings")
j.SetField("buttonSettings", CreateMap("width":120, "height":40,"theme":"light","value":"button"))

 

[alwaysbusy]

@Kiffi Now you've beaten me

 

[Kiffi]

@alwaysbusy :

(but I think your solution is more correct)

 

[alwaysbusy]

I wonder if both solutions work, as we seem to have taken a different approach to include the 'settings' @Luk can you test?

 

[Luk]

This code isn't working. The error message : settings is not a function ...
Sorry Kiffi

untested:

j.RunMethod("settings", Array("buttonSettings", CreateMap("width":120, "height":40,"theme":"light","value":"button")))

This code is working and will make my life a lot easier

Untested, but try this:

Dim j As BANanoObject = BANano.Window.GetField("JQXElements").GetField("settings")
j.SetField("buttonSettings", CreateMap("width":120, "height":40,"theme":"light","value":"button"))

@Kiffi
@alwaysbusy
Thank you very much !