1 2<!--- 3 4This README is automatically generated from the comments in these files: 5iron-multi-selectable.html iron-selectable.html iron-selector.html 6 7Edit those files, and our readme bot will duplicate them over here! 8Edit this file, and the bot will squash your changes :) 9 10The bot does some handling of markdown. Please file a bug if it does the wrong 11thing! https://github.com/PolymerLabs/tedium/issues 12 13--> 14 15[](https://travis-ci.org/PolymerElements/iron-selector) 16 17_[Demo and API docs](https://elements.polymer-project.org/elements/iron-selector)_ 18 19 20##<iron-selector> 21 22 `iron-selector` is an element which can be used to manage a list of elements 23 that can be selected. Tapping on the item will make the item selected. The `selected` indicates 24 which item is being selected. The default is to use the index of the item. 25 26 Example: 27 28```html 29 <iron-selector selected="0"> 30 <div>Item 1</div> 31 <div>Item 2</div> 32 <div>Item 3</div> 33 </iron-selector> 34``` 35 36 If you want to use the attribute value of an element for `selected` instead of the index, 37 set `attrForSelected` to the name of the attribute. For example, if you want to select item by 38 `name`, set `attrForSelected` to `name`. 39 40 Example: 41 42```html 43 <iron-selector attr-for-selected="name" selected="foo"> 44 <div name="foo">Foo</div> 45 <div name="bar">Bar</div> 46 <div name="zot">Zot</div> 47 </iron-selector> 48``` 49 50 You can specify a default fallback with `fallbackSelection` in case the `selected` attribute does 51 not match the `attrForSelected` attribute of any elements. 52 53 Example: 54 55```html 56 <iron-selector attr-for-selected="name" selected="non-existing" 57 fallback-selection="default"> 58 <div name="foo">Foo</div> 59 <div name="bar">Bar</div> 60 <div name="default">Default</div> 61 </iron-selector> 62``` 63 64 Note: When the selector is multi, the selection will set to `fallbackSelection` iff 65 the number of matching elements is zero. 66 67 `iron-selector` is not styled. Use the `iron-selected` CSS class to style the selected element. 68 69 Example: 70 71```html 72 <style> 73 .iron-selected { 74 background: #eee; 75 } 76 </style> 77 78 ... 79 80 <iron-selector selected="0"> 81 <div>Item 1</div> 82 <div>Item 2</div> 83 <div>Item 3</div> 84 </iron-selector> 85``` 86 87 88 89<!-- No docs for Polymer.IronMultiSelectableBehavior found. --> 90 91<!-- No docs for Polymer.IronSelectableBehavior found. --> 92
){kind=link}