Dropdown values displayed incorrectly

Hi,

I have the below webix code

var a = [

{id:“movie”,value:“Movie Name”,type:“string”},

{id:“movieplace”, value:“movieplace”, type:“string”},

{id:“year”, value:“year1”, type:“string” }

];

const removed = [];

webix.ui({

view:“window”,

id:“moviewin”,

height:300,

width:700,

modal:true,

position:“center”,

head:“Movie data”,

hidden: false,

body:{

view:"form",id:"movieform",width:600, scroll: true,

elements:[{

  view: "layout",

  cols:[  

    {

      view:"combo",

      id:"moviedata",

      label:"Fields",

      options:a

    },

    {

      view:"text",

      label:"Value"

    },

  ]

},
          {

            cols:[

              {view:"button",

               label:"Movie Data",

               click:function(){

               }},

              {view:"button", 

               label:"Reset",

               click:function(){

               }},

              {view:"button", 

               label:"Cancel",

               click:function(){

               }},

              {view:"button", 

               label:"Add",

               click:function(){

                 $$("movieform").addView({

                   view: "layout",

                   cols:[  

                     {

                       view:"combo",

                       name:"co",

                       label:"Fields",

                       on:{


                         onChange: function(id){ 
                           let LastC = this.getList().getItem(id);

                           for (var i = 0; i < a.length; i++) {  

                             if(a[i].value == LastC.value){

                               const item = a.splice(i,1)[0];

                               removed.push(item);

                               this.define("options",[item]);

                             }

                           }}

                       },
                       options:a

                     },
                     {
                       view:"text",

                       label:"Value"

                     },
                     {view:"icon", icon:"wxi-trash", click:function(){

                       let toRemove = this.getParentView();

                       const combo = toRemove.queryView("combo");

                       const combooption = combo.getValue();

                       const toAdd = removed.find(function(obj){

                         return obj.id == combooption;

                       });

                       a.push(toAdd);

                       this.getParentView().getParentView().removeView(toRemove);
                      
                     }}, 

                   ]});

               }},

            ]
          }
         ]

}

});

If click on the add button a new row which has combo and pop are getting added.

When i select year1 as the value and i click again except year1 all values like moviename and movieplace should be displayed.

I tried for this

this.define(“options”,[a]);

But is showing undefined object in the dropdown .

How to show the remaining values in the dropdown after clicking again .

Could anybody help me out please?

hi

Could anybody help me out :frowning: :frowning:

Hello,

Please check the related discussion