richselect

class webix.ui.richselect(data)
Arguments:
  • data (object) – A configuration object

Richselect view.

References

views
text().
helpers
assert(), bind(), isUndefined(), protoUI().

Referenced by

views
combo().

External references

Official documentation page.

Code

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
webix.protoUI({
    name:"richselect",
    defaults:{
        template:function(obj,common){
            return common._render_div_block(obj, common);
        },
        popupWidth:200,
        icon: "angle-down"
    },
    _onBlur:function(){
        if (this._settings.text == this.getText())
            return;

        var suggest =  this.getPopup(),
            value = suggest.getSuggestion();

        if (value && !(this.getInputNode().value==="" && suggest.getItemText(value)!==""))
            this.setValue(value);
        else if(this._revertValue)
            this._revertValue();
    },
    suggest_setter:function(value){
        return this.options_setter(value);
    },
    options_setter:function(value){
        value = this._suggest_config ? this._suggest_config(value) : value;
        var suggest = (this._settings.popup = this._settings.suggest = webix.ui.text.prototype.suggest_setter.call(this, value));
        var list = webix.$$(suggest).getList();
        if (list)
            list.attachEvent("onAfterLoad", webix.bind(this._reset_value, this));

        return suggest;
    },
    getList: function(){
        var suggest = webix.$$(this._settings.suggest);
        webix.assert(suggest, "Input doesn't have a list");
        return suggest.getList();
    },
    _reset_value:function(){
        var value = this._settings.value;
        if(!webix.isUndefined(value) && !this.getPopup().isVisible() && !this._settings.text)
            this.$setValue(value);
    },
    $skin:function(){
        this.defaults.inputPadding = webix.skin.$active.inputPadding;
    },
    $render:function(obj){
        if (webix.isUndefined(obj.value)) return;
        this.$setValue(obj.value);
    },
    getInputNode: function(){
        return this._dataobj.getElementsByTagName("DIV")[1];
    },
    getPopup: function(){
        return webix.$$(this._settings.popup);
    },
    getText:function(){
        var value = this._settings.value,
            node = this.getInputNode();
        if(!node)
            return value?this.getPopup().getItemText(value):"";
        return typeof node.value == "undefined" ? (this.getValue()?node.innerHTML:"") : node.value;
    },
    $setValue:function(value){
        if (!this._rendered_input) return;

        var text = value;
        var popup = this.getPopup();

        if (popup)
            var text = this.getPopup().getItemText(value);

        if (!text && value && value.id){ //add new value
            this.getPopup().getList().add(value);
            text = this.getPopup().getItemText(value.id);
            this._settings.value = value.id;
        }

        var node = this.getInputNode();

        if (webix.isUndefined(node.value))
            node.innerHTML = text || this._get_div_placeholder();
        else
            node.value = text = text.replace(/<[^>]*>/g,"");

        this._settings.text = text;
    },
    getValue:function(){
        return this._settings.value||"";
    }
}, webix.ui.text);