Chosenbox display and remove

asked 2019-12-04 14:36:50 +0800

tinawang gravatar image tinawang
155 1

I tried the <chosenbox> in zkfiddle, but I found some questions.

Q1. The element in <chosenbox> will display 2 times when creatable="true" and add element by onSearch. (without onSelect attribute)

Step: add AAA, press 'x' remove AAA, add AAA again.

Expect: only AAA display in box

Actually: two AAA display in box

Q2: After above question, I add onSelect for remove the element manually, the client got exception.

Step: add AAA BBB, press 'x' remove BBB.

Expect: only AAA display in box

Actually: popup exception as below

Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'. (TypeError)


<chosenbox id="chosenbox" style="min-width:75px;" hflex="1"
   creatable="true" model="@load(vm.configurationTagsModel)"
   onSearch="@command('newTag', tag=event.value)" 
   onSelect="@command('removeTags', tags=event.unselectedObjects)>


public class ChosenboxViewModel {
    private ListModelList<String> configurationTagsModel = new ListModelList<String>();

    public void newTag(@BindingParam("tag") String tag) {
        String tagName = tag.trim();

        if (!tagName.isEmpty()) {

    public void newTag(@BindingParam("tags") Set<String> tags) {

    public ListModel<String> getConfigurationTagsModel() {
        return configurationTagsModel;


[zkfiddle] (My karma is insufficient to publish links, sorry.)

delete flag offensive retag edit


Increased your karma. You should be able to add links now

jeanher ( 2019-12-04 16:00:50 +0800 )edit


tinawang ( 2019-12-04 16:40:12 +0800 )edit

simplified reproducing code

cor3000 ( 2019-12-05 12:39:43 +0800 )edit

1 Answer

Sort by » oldest newest most voted

answered 2019-12-05 13:00:02 +0800

cor3000 gravatar image cor3000
5114 2 7
ZK Team

updated 2020-03-25 10:23:17 +0800

Thanks for posting a running example, it illustrates the problem quite well, I created a simplified reproducing code to point out that there's nothing wrong with your MVVM code. Apparently <chosenbox> has a problem with an initially empty model.

As soon as you add at least one item to the model initially things start working ... however you also cannot remove this initial dummy item later (another problem).

So if your real scenario always has some initial items, the component works much better. Also you don't need to remove user created items (example), this even lets the user remove and re-select previously typed items, without giving the duplicate items as in your (Q1)

related bug report: ZK-4446

UPDATE 2020-03-25: ZK-4446 will be fixed in 9.0.1 currently available for testing in FL version 9.0.1.FL.20200320(-Eval)

link publish delete flag offensive edit


Thanks for quickly reply and provide an example.

tinawang ( 2019-12-05 13:54:55 +0800 )edit

Also, another problem with initial data for chosenbox. Do you have any work around? zkfiddle

tinawang ( 2019-12-05 14:19:07 +0800 )edit

yes in this case it's just a matter of calling model.setMultiple(true) (which enables multiple selection) http://zkfiddle.org/sample/3db6bfq/2-Chosenbox-initial-data-problem-simplified

cor3000 ( 2019-12-05 14:33:11 +0800 )edit

Thank you!

tinawang ( 2019-12-05 14:41:44 +0800 )edit
Your answer
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

1 follower



Asked: 2019-12-04 14:36:50 +0800

Seen: 16 times

Last updated: Mar 25

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More