<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <!--The viewport meta tag is used to improve the presentation and behavior of the samples on iOS devices--> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>FeatureLayer On Demand</title> <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/esri/css/esri.css"> <style> html, body, #mapDiv { padding:0; margin:0; height:100%; } #ms_panel{ z-index: 30; position: absolute; top:30px; right:30px; } </style> <script src="http://js.arcgis.com/3.7/"></script> <script> var map; require([ "esri/map", "esri/InfoTemplate", "esri/layers/FeatureLayer", "dijit/form/MultiSelect", "dojo/_base/array", "dojo/dom-construct", "dojo/parser", "dojo/dom", "dojo/domReady!" ], function( Map, InfoTemplate, FeatureLayer, MultiSelect, array, domConstruct, parser, dom ) { parser.parse(); map = new Map("mapDiv", { basemap: "national-geographic", center: [-96.541, 38.34], zoom: 6 }); map.on("load", initOperationalLayer); function initOperationalLayer() { var infoTemplate = new InfoTemplate("${state_name}", "Population (2000): ${pop2000:NumberFormat}"); var featureLayer = new FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer/2",{ mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"], infoTemplate: infoTemplate }); featureLayer.on("load", function(){ var select = dom.byId("multiselectDiv"); var fields = featureLayer.fields; //create an option for each field array.forEach(fields, function(field){ var option = domConstruct.create("option",{ "innerHTML": field.name, "value": field.name }); select.appendChild(option); }); var multiselect = new MultiSelect({ name: "layerFields", multiple:true }, select); multiselect.startup(); }); map.addLayer(featureLayer); map.infoWindow.resize(155,75); } }); </script> </head> <body class="claro"> <div id="mapDiv"></div> <div id="ms_panel"> <select id="multiselectDiv"></select> </div> </body> </html>
var test = win.doc.createElement('select'); var testm = dom.byId(test); var op1 = win.doc.createElement('option'); op1.innerHTML = "optionone"; op1.value = "optionone"; testm.appendChild(op1); var op2 = win.doc.createElement('option'); op2.innerHTML = "optiontwo"; op2.value = "optiontwo"; testm.appendChild(op2); var myMultiSelect = new MultiSelect({ name: 'testmulti', id: 'testmulti', style: "width:150px;"}, testm);
Kaitlynn, Were you able to succeed in doing this. If so, then could you post your code? Thank you!