我正在努力确定选择了哪个下拉元素

Question

当用户从下拉组件中选择某个元素时，我试图显示输入字段。我试图通过在下拉组件上添加一个eventListener来做到这一点，但这似乎不起作用。

当我检查页面并转到源->事件侦听器断点时，我发现它检测到鼠标单击事件，但是当我尝试添加eventListener时，出现以下错误“无法读取null的属性'addEventListener'”。这是下拉组件的代码：

{
    PlaceHSolder: "",
    Fields:[{
        Name:"The color of the car",
        Label: 'The color of the car',
        Type:'Lookup',
        Fields: ['id', 'color'],
        FieldValues:[ 
            {"id":"1", "color":"red",id: '1red'},
            {"id":"2", "color":"blue",id: '2blue'},
            {"id":"3", "color":"green",id: '3green'}
        ],
        LabelField: 'color',
        ValueField: 'id',
        IsSingle:   true,
        triggerAction: 'all' ,
        queryParam: 'q',
        queryMode: 'remote',
        listeners: {
            select: function () {
                console.log( this.getValue());
            }
        },
        renderTo: document.body
    }],
    Required:  false
}

由于我相对较新，因此我不确定代码中到底有什么错误。为了更清楚地说明我要做什么，以下是图片： https://imgur.com/KVDh2Xp

在这张照片中，我有一个下拉组件，我想在其中选择蓝色元素。之后，我计划放开下拉列表，并根据用户选择的文本显示其他各种标签和组件。

在Google Chrome浏览器中使用检查工具会显示以下错误： https://imgur.com/a/SzSIKxr

任何帮助将不胜感激。谢谢。