@domoinc/domo-select/bower_components/Dropdown/CreateWidget.js

DomoSelect - Domo Widget

//Setup some fake data
var data = [
    ['1'],
    ['Domo', 'value', 'otherfield', 'bunchafields', 'onthisguy'],
    ['Widgetasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdf'],
    ['Test'],
    ['Test'],
    ['Test'],
    ['Test'],
    ['Test'],
    ['Test'],
    ['Test'],
    ['Test'],
    ['End'],
];

//Initialze the widget
var chart = d3.select("#vis").append('div')
    .style({
        'position':'absolute',
        'top':'100px',
        'left':'100px'
    })
    .chart("Dropdown")
    .c({
        width: '250px',
        // height: '250px',
        'size': 'large',
        domoScroll: true
    })
    // .selectedIndex(1);

chart.c('listIconFunction', function(iconDiv, d, i) {
    iconDiv.append('img')
        .attr({
            src: 'https://avatars0.githubusercontent.com/u/7373982?v=3&s=40'
        })
        .style({
            height: '16px',
            width: '16px',
        })
})

//Render the chart with data
chart.draw(data);

// setTimeout(function() {
//     chart.c('domoScroll', false)
//     chart.draw(data)
// }, 2000)

chart.on('click', function(d, i) {
    this.toggleVisibility();
    console.log(d)
});

//******************************************************************
//This is the code that allows you to put icons on the list items
//******************************************************************

d3.select('#vis')
    .append('div')
    .style({
        height: '100px',
        width: '100px',
        'background': '#BADA55',
        'position': 'absolute',
        'left': '400px'
    })
    .on('click', function() {
    chart.toggleVisibility();
        //chart.trigger('visibility');
    });