B4J Question [BANANO] JQWidget integration question

Luk

Member
Licensed User
Longtime User
Hi,

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

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

Thanks.
 
Last edited:

Kiffi

Well-Known Member
Licensed User
Longtime User
Argh! Alain beats me ;)

But nevertheless:

B4X:
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
 
Upvote 0

Luk

Member
Licensed User
Longtime User

Attachments

  • jqWidget.zip
    2.9 KB · Views: 197
Upvote 0

alwaysbusy

Expert
Licensed User
Longtime User
As you are using jQuery, just continue with it:

B4X:
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:
B4X:
Sub BANanoJQWidgets_Ready()
   BANano.LoadLayout("#body", "layout1")
End Sub

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

Alwaysbusy
 
Last edited:
Upvote 0

alwaysbusy

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

B4X:
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:

B4X:
Log(event.Value)   
Log(event.OtherField("value"))
 
Upvote 0

Luk

Member
Licensed User
Longtime User
Here I am again :)

I'm trying to call the function disable.
B4X:
$('#jqxRating').jqxRating('disable');

But the following is not working:
B4X:
mJRating.RunMethod("jqxRating","").RunMethod("disable","")

(I'm using version 2.39)

Thanks.
 

Attachments

  • jqwidget2.zip
    3 KB · Views: 177
Upvote 0

Kiffi

Well-Known Member
Licensed User
Longtime User
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:
B4X:
jQuery.Selector("#jqxbutton").RunMethod("jqxButton", CreateMap("disabled":True))

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

Luk

Member
Licensed User
Longtime User
Another question ...

Using
B4X:
j = BANano.Window.GetField("JQXElements")
I can obtain the JQXElements object, but how can I do the following ?

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

Creating the wrong code was no problem :)
B4X:
j.RunMethod("buttonSettings", CreateMap("width":120, "height":40,"theme":"light","value":"button"))

Thanks
 
Upvote 0

Kiffi

Well-Known Member
Licensed User
Longtime User
untested:
B4X:
j.RunMethod("settings", Array("buttonSettings", CreateMap("width":120, "height":40,"theme":"light","value":"button")))
 
Upvote 0

Kiffi

Well-Known Member
Licensed User
Longtime User
@alwaysbusy :

giphy.gif


(but I think your solution is more correct)
 
Upvote 0

Luk

Member
Licensed User
Longtime User
This code isn't working. The error message : settings is not a function ...
Sorry Kiffi :)
untested:
B4X:
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:

B4X:
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 !
 
Upvote 0
Top