Adding buttons next to TextField on Form - qooxdoo

I am new to QOOXDOO (like really new). I am enjoying the framework tremendously though, and am busy with a feasibility test for a desktop like app.
I have a straight forward enough Form using a single column render, having test data TextFields like "Account number", "Name", "Cell number". That is working well of course. But I need two small pick list type buttons next to the "Account number" TextField. One for searching by account number, and one for searching by name.
I really don't see how to achieve the positioning of these two buttons?
I am using 5.01 of the framework, but can of course change to 6 if it has a good way of achieving those two pick list buttons I need.
Thanks in advance for any suggestions!

maybe something like this
var doc = this.getRoot();
var form = new qx.ui.form.Form();
var txt1 = new qx.ui.form.TextField("");
form.add(txt1, "Account number", null, "account_number");
var txt2 = new qx.ui.form.TextField("");
form.add(txt2, "Name", null, "name");
var txt3 = new qx.ui.form.TextField("");
form.add(txt3, "Cell number", null, "cell_number");
var s1 = new qx.ui.form.SelectBox();
var s2 = new qx.ui.form.SelectBox();
var formView = new qx.ui.form.renderer.Single(form);
formView._add(s1, {row: 0, column: 2});
formView._add(s2, {row: 0, column: 3});
doc.add(formView, {left: 10, top: 10});

Related

Picker not showing at the right moment

I am experiencing some weird behavior with the pickers in my app since the pixel perfect picker update : The picker is showing when the form is called to be show, so before the form is showing.
I've tried with the new lightweight mode, with the old mode, inside a PickerComponent, with just a picker, on Android 7, iOS 10 and the simulator, all have a similar behavior.
The only difference is that with a PickerComponent, the bug appear when the Form is shown a second time.
The bug occur once, because I keep my forms in memory most of the time and it occur only the first time.
Here is a little code sample to add in the start method of the barebone hello world :
Picker pick = new Picker();
pick.setType(PICKER_TYPE_STRINGS);
pick.setStrings("First model", "Second model", "Third model");
pick.addActionListener(e->Dialog.show("Picker result", pick.getSelectedString(), "OK", null));
pick.setUseLightweightPopup(false);
Picker pick2 = new Picker();
pick2.setType(PICKER_TYPE_STRINGS);
pick2.setStrings("First model", "Second model", "Third model");
pick2.addActionListener(e->Dialog.show("Picker result", pick2.getSelectedString(), "OK", null));
pick2.setUseLightweightPopup(true);
PickerComponent pickerComponent = PickerComponent.createStrings("First model", "Second model", "Third model").label("Model Heavy");
pickerComponent.getPicker().setUseLightweightPopup(false);
pickerComponent.getPicker().addActionListener(e->Dialog.show("Picker result", pickerComponent.getPicker().getSelectedString(), "OK", null));
PickerComponent pickerComponent2 = PickerComponent.createStrings("First model", "Second model", "Third model").label("Model Light");
pickerComponent2.getPicker().setUseLightweightPopup(true);
pickerComponent2.getPicker().addActionListener(e->Dialog.show("Picker result", pickerComponent2.getPicker().getSelectedString(), "OK", null));
Form hi = new Form("PickerCompo Heavy", BoxLayout.y());
hi.add(pickerComponent);
Form hi2 = new Form("PickerCompo Light", BoxLayout.y());
hi2.add(pickerComponent2);
Form hi3 = new Form("Picker Heavy", BoxLayout.y());
hi3.add(pick);
Form hi4 = new Form("Picker Light", BoxLayout.y());
hi4.add(pick2);
Form caller = new Form("Call Hi World", BoxLayout.y());
Button callForm = new Button("hit me heavyweight Compo");
callForm.addActionListener(e->{
hi.setBackCommand("Back", null, ev-> caller.showBack());
hi.show();
});
Button callFormLight = new Button("hit me Lightweight Compo");
callFormLight.addActionListener(e->{
hi2.setBackCommand("Back", null, ev-> caller.showBack());
hi2.show();
});
Button callForm3 = new Button("hit me heavyweight");
callForm3.addActionListener(e->{
hi3.setBackCommand("Back", null, ev-> caller.showBack());
hi3.show();
});
Button callForm4 = new Button("hit me Lightweight");
callForm4.addActionListener(e->{
hi4.setBackCommand("Back", null, ev-> caller.showBack());
hi4.show();
});
caller.add(callForm);
caller.add(callFormLight);
caller.add(callForm3);
caller.add(callForm4);
caller.show();
Any idea of a workaround ? I'm using them on some major forms in my app, and I'd like to update the app to resolve the distorting screen on iOS (SO : Distorted screen ).
There was a regression with Picker due to changes in the focus functionality that were used with the Picker change but are applicable even in the native functionality.
This should be fixed in the update that we pushed out just now.

Pre-fill with the id of an entity

How can I pre-fill a new content with an entity relationship that I know the id? I know the item is, let's say 1234, but if I use this number like that :
#Edit.Toolbar(actions: "new", contentType: "NewsItem", prefill = new { Category = 1234 } )
It doesn't work. When I implement the code above, the form for a new item shows up but instead of having the correct item selected, I have (item not found). Obviously, my argument is not correct. So, how do I code this argument?
I also tried
Category = {1234}
Category = new {(1234}}
Category = "1234"
But nothing works. Any ideas?
We're working on enhancing this, but as of now, you are best off using the guid - as shown in the wiki: https://github.com/2sic/2sxc/wiki/razor-edit.toolbar#multiple-entities-prefil

How to use random text in UILocalNotifications?

I'm trying to make an app that will receive local notifications with random text. I used some code but it's not working well. It's coming only "006" or "005", and it won't change.
The code that I used is:
let myArray = ["000", "001", "002", "003", "004", "005", "006"]
let notification = UILocalNotification()
notification.alertBody = myArray[Int(arc4random_uniform(UInt32(myArray.count)))] // text that will be displayed in the notification
notification.fireDate = NSDate() // right now (when notification will be fired)
notification.soundName = UILocalNotificationDefaultSoundName // play default sound
notification.repeatInterval = NSCalendarUnit.NSHourCalendarUnit // this line defines the interval at which the notification will be repeated
UIApplication.sharedApplication().scheduleLocalNotification(notification)
Can you please show me where I made mistake ? Thanks.
What you are doing is correct. Maybe you haven't tried your code enough and had a long string of extreme values.

Visualizing textbox values

I am using Shield UI Chart in order to show data entered by the user in some text fields. Some of them are:
var Participants = new Array();
Participants [0]=document.getElementById("ParticipantA").value;
Participants [1]=document.getElementById("ParticipantB").value;
Participants [2]=document.getElementById("ParticipantC").value;
and I put the data on the chart using this code:
dataSeries: [
{
seriesType: 'line',
collectionAlias: 'chart',
data: [Participants [0], Participants [1], Participants [2]]
}
I think that I am making it all correct, however there is no data showed at all. I checked that the function is being called, so the problems should be elsewhere.
The one error I can see, is that the values of the text fields are not in the correct format. Although you might be entering numerical values, you need to convert them explicitly, in order to be used with your Shield UI Chart:
var Participants = new Array();
Participants [0]=parseFloat(document.getElementById("ParticipantA").value);
Participants [1]=parseFloat(document.getElementById("ParticipantB").value);
Participants [2]=parseFloat(document.getElementById("ParticipantC").value);

EXT3 JS Grid - Change a specific JsonStore Value before rendering and ordering

I want to append an int to a specific cell in the grid - this needs to happen before rendering and ordering so that the user sees the correct ordering
This is for a league table.
I have bene through several iterations of conver - renderer - record.push etc
Clue seems to be to copy the store and use a new one in the grid when the value has been changed
Any help on this appreciated.
Ian
could do something similar to the following:
var grid, gridStore, tempStore;
gridStore = new Ext.data.Store();
tempStore = new Ext.data.Store();
grid = new Ext.grid.GridPanel({
store: gridStore
});
tempStore.addListener("load", function (store, records) {
//make your modifications to the records (concat the int)
gridStore.loadData(/*some results*/);
});

Resources