grouping-icon-stack.json

{"index.html":"<html><head><script src=\"//npmci.syncfusion.com/production/demos/combo-box/grouping-icon/datasource.js\" type=\"text/javascript\"></script>\n<script src=\"https://cdn.syncfusion.com/ej2/dist/ej2.min.js\" type=\"text/javascript\"></script>\n    <link href=\"https://cdn.syncfusion.com/ej2/material.css\" rel=\"stylesheet\">\n\n    <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\">\n\n    <style>\n            body{\n                touch-action:none;\n            }\n        </style></head><body><div class=\"stackblitz-container {{theme}}\"><div class=\"col-lg-12 control-section\">\n    <div id=\"groupList\" class=\"col-lg-6\" style=\"padding-top:15px\">\n        <div class=\"content\">\n            <h4>Grouping</h4>\n            <input type=\"text\" id=\"vegetables\">\n        </div>\n    </div>\n\n    <div id=\"iconList\" class=\"col-lg-6\" style=\"padding-top:15px\">\n        <div class=\"content\">\n            <h4> Icons</h4>\n            <input type=\"text\" id=\"icons\">\n        </div>\n    </div>\n</div>\n\n\n\n\n\n<style>\n\n    .e-list-icon {\n        font-family: 'Socialicons' !important;\n        color: rgba(0, 0, 0, .57);\n    }\n\n    .twitter:before {\n        content: \"\\a701\";\n    }\n\n    .vimeo:before {\n        content: \"\\a702\";\n    }\n\n    .youtube:before {\n        content: \"\\a709\";\n    }\n\n    .whatsapp:before {\n        content: \"\\a700\";\n    }\n\n    .skype:before {\n        content: \"\\a708\";\n    }\n\n    .instagram:before {\n        content: \"\\a703\";\n    }\n\n    .google-plus:before {\n        content: \"\\a706\";\n    }\n\n    .facebook:before {\n        content: \"\\a705\";\n    }\n\n    .tumblr:before {\n        content: \"\\a707\";\n    }\n\n    .linkedin:before {\n        content: \"\\a704\";\n    }\n</style></div></body></html>","index.js":"{{ripple}}\n\n    // initialize ComboBox component\n    var groupComboBoxObj = new ej.dropdowns.ComboBox({\n        //set the vegetable data to dataSource property\n        dataSource: window.ddVegetableData,\n        // map the appropriate columns to fields property\n        fields: { groupBy: 'Category', text: 'Vegetable', value: 'Id' },\n        // set the placeholder to ComboBox input element\n        placeholder: 'Select a vegetable',\n        // set the height of the popup element\n        popupHeight: '200px'\n    });\n    groupComboBoxObj.appendTo('#vegetables');\n\n    // initialize ComboBox component\n    var iconComboBoxObj = new ej.dropdowns.ComboBox({\n        //set the social media data to dataSource property\n        dataSource: window.ddSocialMedia,\n        // map the appropriate columns to fields property\n        fields: { text: 'SocialMedia', iconCss: 'Class', value: 'Id' },\n        // set the placeholder to ComboBox input element\n        placeholder: 'Select a social media',\n        // set the height of the popup element\n        popupHeight: '200px'\n    });\n    iconComboBoxObj.appendTo('#icons');\n"}