Can I create singlenton vaadin combobox component? - combobox

On a Vaadin application, I instanciate a same combobox on each tab.
These combobox contains a large information list. That takes huge memory on the server.
I have three tabs, therefore, the combobox appears three times.
I wish create one combobox on my application with a pattern singleton.
And this one combobox will be shared by three tabs.
But if I apply this pattern singleton, the combobox appears at once on only one tab.
How can create a singleton combobox and this last appears on each tab ?
Thanks by advance.

Vaadin component can be attached to one UI only, and one layout at the time. Thus Vaadin component cannot be singleton.
However, you have number other options to solve your actual problem.
The first and the most obvious thing is that you can use data provider from callbacks in your ComboBox. If the information list is large, this is the first thing you should do. When you use data provider from callbacks, only small buffer of items is kept in memory and as user scrolls the ComboBox.
DataProvider<Bean, Void> dataProvider =
DataProvider.fromCallbacks(
query -> {
List<Bean> beans = getBeansService()
.fetchBeans(query.getOffset(), query.getLimit());
return beans.stream();
},
query -> getBeansService().getBeansCount());
);
ComboBox<Bean> combo = new ComboBox<>();
combo.setDataProvider(dataProvider);
When you setup the ComboBox like this, you can easily have multiple instance of the ComboBox.
In case you still use in memory data provider, you can actually share it with multiple component instances.
ListDataProvider<Bean> dataProvider = DataProvider.ofCollection(items);
comboBox1.setDataProvider(dataProvider);
comboBox2.setDataProvider(dataProvider);

Related

dynamically set defaultValues on data models Extjs6.5

I have a grid with many columns, and a popup dialogue for adding new records.
I have set deafultValues on data models fields array works fine, now I am trying to reuse that and add this defaults values dynamically from the server.
I have entityName/def available in the server that have the feilds name with default values in it.
I have so many entities,
so proxy transform function would be best ? or when creating the the dialogue form window, call the the server to populate the fields ?
I am new to ExtJS and Sencha and I don't have a clear way to both mentioned ways. I am buzzled!!
Any answers, hints are truly appreciated.

Vaadin: Reload ComboBox List while typing

I got a ComboBox in Vaadin and want to reload (from db) the set of entries in the dropdown list while typing in the text field of the ComboBox. I always got the exception:
java.lang.IllegalStateException: A connector should not be marked as dirty while a response is being written.
I tried to lock the session (getUI().getSession().getLockInstance().lock();), but it didn't help.
Is it possible to dynamically set/load the selection list of a ComboBox?
Cheers
Stefan
why do you want to change the content from DB as the user type? you'll get a postback and a query every key the user presses... isn't better to use the standard combo feature (which tries to autocomplete the value given what the user is typing)?
Anyway, if you really need this feature, you may extend the standard behaviour of combo extending the container behind the combo, as the data shown is taken from a container.

Best practice for backbone.js models and collections

I've been learning backbone.js over the past couple of weeks and am about to start using it in anger in an app I'm writing. My question to you is about a use case for models and collections in a Bootstrap 3 navbar.
On my server side I authenticate the user and, based on their profile, assign them a role (author, editor, administrator etc.). I then construct an object that contains the appropriate menu structure for the user's role and pass that to the client using Handlebars. The intent is for the browser to construct the HTML to render the menus according to the properties (key/values) in the object using backbone.
My thoughts are that the navbar itself is a collection of models (navbar); each dropdown menu or link on the navbar is a single model (navbarItem); each of these contains a collection of menu items (navbarItemMembers), these collections being of models of each individual menu item (navbarItemMember). I can then set event listeners against each navbarItemMember to trigger an appropriate route or render action as appropriate.
So, getting to the point... am I over-complicating things? A collection containing models each containing a collection of other models, each of those mapping to a view that renders a on the main page. Seems convoluted to me, but from my (albeit limited) understanding of backbone.js it does seem the right way to do this...?
Advice much appreciated from those more experienced (battle scarred?!) than I. Thank you.
Use a collection when it's going to provide some benefit to you over a plain model. The benefits could be either
Interacting with a RESTful service where you'll want to not just get a list of data but then separately fetch/modify/add/delete individual items is that list
Defining separate Views for each item in the list rather than a having a single View that iterates over the list.
I don't think a basic navbar benefits from either of those. If your navbar has some super fancy elements beyond just links then maybe #2 applies but otherwise keep it simple, use a single model with a single view/template

SelectBox with form controller and remote model

We are building a larger Qooxdoo application, and we have the following problem.
We try to bind a SelectBox (qx.ui.form.SelectBox) with a remote model to a form controller (qx.ui.form.Form) with property binding.
The form controller has also a remote model.
The form and the list are connected over a list controller (qx.data.controller.List).
The problem now are race conditions between this two models.
Both models are connected to a REST interface.
Is there a solution like a virtual selectbox, or a alternative?
UPDATE:
The main problem is the default selection of the select box when editing data in the form.
The user clicks on a button and the form gets opened in a new window. The form contents will be loaded via REST. In the form there is a select box containing all countries of the world (as example) loaded via REST, and Germany should be selected as default. This default selection is only possible, if all counties are already loaded via REST. Otherwise the first element in the list is selected.
Here is some example source code, it's not working, but is a good starting point: http://tinyurl.com/oqsfkrc
Virtual select box does not help you much because it's only virtual when it comes to rendering. So the data binding and the race conditions should be the same no matter which select box you choose.
I don't get the root of your problem so I can't give you a precise advice how to handle your race condition. Is it possible to load / set the models sequentially to break the race condition?

Combobox clearing value issue

I've stumbled on an issue with Comboboxes in javafx2.2. This is the scenario:
Users click on the 'editFile' button.
Another pane becomes visible (with the setVisible method).
This pane contains 6 comboboxes.
Three of them have fixed items: cboReport, cboSales, cboSend. Three of them get their data from a db (ObservableList) and get populated when the pane becomes visible: cboFile, cboCustomer, cboVet
The user selects a file number from the cboFile. The rest of the comboboxes are beeing set with the correct values.
The user presses the save button, the file gets saved as intended.
Next the user presses a close button.
When the window closes, the data on the pane gets resetted through a resetGUI_editFilePane() method. There is have lines like:
...
cboReport.getSelectionModel().clearSelection();
cboSales.getSelectionModel().clearSelection();
cboSend.getSelectionModel().clearSelection();
cboFile.getSelectionModel().clearSelection();
cboCustomer.getSelectionModel().clearSelection();
cboVet.getSelectionModel().clearSelection();
cboFile.getItems().clear();
cboCustomer.getItems().clear();
cboVet.getItems.clear();
...
When the user opens the pane again by pressing the 'editFile' button I notice that only the 'fixed item' comboboxes have cleared their selection, the dynamicly filled comboboxes show the last selected item although the value from the selection itself is null. This looks like a graphics bug to me or am I doing something wrong?
Is there any way around this issue or what is the best method to reset a combobox?
EDIT 2014/08/27:
This is officially not a bug(clearSelection() does not clear value):
https://bugs.openjdk.java.net/browse/JDK-8097244
The official "workaround" is to clear the value of the ComboBox after clearing selection.
cb.getSelectionModel().clearSelection();
// Clear value of ComboBox because clearSelection() does not do it
cb.setValue(null);
It is very simple. You just need to work with the value property of ComboBox. here you go ....
ComboBox c;
c.valueProperty().set(null);
I hope this works for you :-D
I ran into nearly the exact same situation and came across your question while looking for a solution. Fortunately, I came up with a workaround that forces the ComboBoxes to reset. When you reset the data on your pane, instead of doing something like:
cboVet.getSelectionModel().clearSelection();
cboVet.getItems.clear();
do something like this...
parentNode.getChildren().remove(cboVet);
cboVet = new ComboBox(); // do whatever else you need to format your ComboBox
parentNode.add(cboVet);
You'll also need to do a setItems() again on your ComboBox so the new one will be populated. This is not an ideal solution but it seems to be working as I expect the provided clearSelection() method would.
You can retrieve the items and have them all removed:
cboVet.getItems().removeAll(cboVet.getItems());
I've just tested a working solution with the Java JDK 1.7.11:
combobox.setSelectedItem(null);
combobox.setValue(null);
Hope it helps :)
I use reflection with direct manipulation of buttonCell field in ComboBox skin:
#SuppressWarnings({ "rawtypes", "unchecked" })
public static <T> void resetComboBox(ComboBox<T> combo) {
Skin<?> skin = combo.getSkin();
if(skin==null){
return;
}
combo.setValue(null);
Field buttonCellField;
try {
buttonCellField = skin.getClass().getDeclaredField("buttonCell");
buttonCellField.setAccessible(true);
ListCell buttonCell = (ListCell) buttonCellField.get(skin);
if(buttonCell!=null){
StringProperty text = buttonCell.textProperty();
text.set("");
buttonCell.setItem(null);
}
} catch (NoSuchFieldException
| SecurityException
| IllegalArgumentException
| IllegalAccessException e) {
e.printStackTrace();
}
}
I think it's also possible by providing your own buttonCell implementation through buttonCellFactory property
I had the same problem with a ComboBox. The buttonCell of the ComboBox is not updated correctly when I change the items of the ComboBox. This looks like a graphics bug.
I use direct manipulation of buttonCell field in ComboBox.
combo.getButtonCell().setText("");
combo.getButtonCell().setItem(null);
This is the best solution I've found without recreate the ComboBox.
To clear SelectionModel I found nothing better than creating a new instance of Combobox (previous answers update):
myParentNode.getChildren().remove(myCombobox);
myCombobox = new ComboBox();
myParentNode.add(myCombobox);
But this solution evolves other problems: if you use fxml, this combobox will be placed in the wrong place and with wrong parameters. Some fxml parameters are hardly reproduced directly from your controller class code and this is awful to do it every time you need to clear the combobox.
The solution is using custom components instead of creating instances directly in main controller class code, even if these components are standard. This also helps to free some lines in your main controller class by moving component related event methods and other methods to a separate class file, where you use a reference to your main controller class.
How to create custom components in JavaFX FXML Application can be found in http://docs.oracle.com/javafx/2/fxml_get_started/custom_control.htm , but note that CustomControlExample class is not needed for every custom component in your application, if it already has an entry point class with start(Satge stage) method.
How to resolve possible errors with reference from custom component controller class to main controller class can be found in JavaFx: how to reference main Controller class instance from CustomComponentController class?
I need to clear selection of the combo box. And this code worked for me:
List<Object> list = new ArrayList<>(comboBox.getItems());
comboBox.getItems().removeAll(list);
comboBox.getItems().addAll(list);

Resources