webix richselect 간단 사용방법

webix.ui({
  view:"form",
  width:350,
  elementsConfig:{
    labelWidth:120
  },
  rows:[
    { 
      view:"richselect",
      label:'Basic', name:"fruit1",
      value:1, options:[
        { id:1, value:"Banana" }, 
        { id:2, value:"Papaya" }, 
        { id:3, value:"Apple" }
      ]
    },
    { 
      view:"richselect",
      label:'Extra template', name:"fruit2", 
      value:1, options:{
        template:"Extra #value#",
        data:[
          { id:1, value:"Banana" },
          { id:2, value:"Papaya" }, 
          { id:3, value:"Apple" }
        ]
      }
    },	
    { 
      view:"richselect", 
      label:'Load options', name:"fruit3", value:"1",
      options:"//docs.webix.com/samples/13_form/01_controls/server/data.json"
    },	
    { view:"button", width: 150, align: "center",type:"form", value:"Submit data", click:function(){
      webix.message("<pre>"+JSON.stringify(this.getParentView().getValues(),0,1)+"</pre>");
    }}
  ]
});

간단하게 webix richselect에 값을 세팅하는 방법이고, 실전 개발에서는 하드코딩으로 data:[] 부분을 박아 넣지는 않을테고..

options:"//docs.webix.com/samples/13_form/01_controls/server/data.json"

이런식으로 json 을 받아 세팅하겠지요.

출처:

https://snippet.webix.com/gallery/core/e078f8b0

Webix Samples