mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-02-02 12:19:11 +00:00
Code Issues Releases Wiki Activity

Add size attribute to select widget for multiple selection mode

Browse Source
This commit is contained in:
Jermolene 2016-01-05 18:48:21 +00:00
parent 93f7d8c028
commit 0cbe97615a
2 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
core/modules/widgets/select.js
View File

@ -138,6 +138,7 @@ SelectWidget.prototype.execute = function() {
this.selectClass = this.getAttribute("class");
this.selectDefault = this.getAttribute("default");
this.selectMultiple = this.getAttribute("multiple", false);
this.selectSize = this.getAttribute("size");
// Make the child widgets
var selectNode = {
type: "element",
@ -150,6 +151,9 @@ SelectWidget.prototype.execute = function() {
if(this.selectMultiple) {
$tw.utils.addAttributeToParseTreeNode(selectNode,"multiple","multiple");
}
if(this.selectSize) {
$tw.utils.addAttributeToParseTreeNode(selectNode,"size",this.selectSize);
}
this.makeChildWidgets([selectNode]);
};

7
editions/tw5.com/tiddlers/widgets/SelectWidget.tid
View File

@ -10,6 +10,8 @@ type: text/vnd.tiddlywiki
The select widget displays a popup menu based on a [[HTML select element|https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select]]. The popup (or dropdown) contains a list of items defined by `<option>` and `<optgroup>` elements.
Every time the user selects a new value in the menu, the selected value is written to the text of a specified tiddler field or index. If the tiddler value changes the menu is automatically updated to reflect the new value.
In multiple selection mode, the list of selected values is bound to the specified tiddler field or index. Browsers generally use the <kbd>ctrl</kbd> or <kbd>cmd</kbd> keys for multiple selection.
For example, this select widget displays a list of the tags in this wiki:
<$macrocall $name="wikitext-example-without-html" src="<$select tiddler=<<qualify 'select-demo'>> default='HelloThere'>
@ -34,7 +36,8 @@ The content of the `<$select>` widget should be one or more HTML `<option>` or `
|index |The index of a property in a [[DataTiddler|DataTiddlers]] (takes precedence over the field attribute) |
|class |CSS classes to be assigned to the HTML select element |
|default |Default value to be used if the tiddler, field or index specifies a missing value |
|multiple |If present, switches to multiple selection mode |
|size |The number of rows to display in multiple selection mode |
! Examples
@ -104,7 +107,7 @@ This example uses a nested pair of list widgets. The outer one generates the `<o
This example uses the `multiple` keyword to specify that we should be able to select multiple items.
<$macrocall $name="wikitext-example-without-html" src="<$select tiddler='$:/generated-list-demo-state' field='testing' multiple>
<$macrocall $name="wikitext-example-without-html" src="<$select tiddler='$:/generated-list-demo-state' field='testing' multiple size='8'>
<$list filter='[tag[TableOfContents]]'>
<option><$view field='title'/></option>
</$list>