jswidgets/values/values-2.html

<!DOCTYPE HTML>
<title>widget-values.js</title>
<script src="http://suika.fam.cx/www/style/ui/widget-values.js.u8" charset=utf-8></script>
<script>
  function MyNumbersWidget (c) {
    WidgetValues.apply (this, [c]);
  }
  
  MyNumbersWidget.prototype = new WidgetValues;
  
  MyNumbersWidget.prototype.createField = function (value) {
    var field = document.createElement ('span');
    field.wvIsField = true;
    
    var input = document.createElement ('input');
    input.setAttribute ('type', 'number');
    input.setAttribute ('min', 1);
    input.setAttribute ('max', 10);
    input.value = value;
    field.appendChild (input);
    
    return field;
  };
  
  MyNumbersWidget.prototype.clear = function () {
    var self = this;
    
    this._clear ();
    
    var fields = document.createElement ('span');
    this.container.appendChild (fields);
    this.fieldsParent = fields;
    
    var addButton = this.createButton ();
    addButton.innerHTML = '+';
    addButton.onclick = function () { self.appendValues ([5]) };
    this.container.appendChild (addButton);
  };

  window.onload = function () {
    new MyNumbersWidget (document.getElementById ('c'));
  }; // onload
</script>

<p><span id=c data-widget-name=test>
<textarea name=tests>5 0 3</textarea>
</span>
1	wakaba	1.1	<!DOCTYPE HTML>
2			<title>widget-values.js</title>
3			<script src="http://suika.fam.cx/www/style/ui/widget-values.js.u8" charset=utf-8></script>
4			<script>
5			function MyNumbersWidget (c) {
6			WidgetValues.apply (this, [c]);
7			}
8
9			MyNumbersWidget.prototype = new WidgetValues;
10
11			MyNumbersWidget.prototype.createField = function (value) {
12			var field = document.createElement ('span');
13			field.wvIsField = true;
14
15			var input = document.createElement ('input');
16			input.setAttribute ('type', 'number');
17			input.setAttribute ('min', 1);
18			input.setAttribute ('max', 10);
19			input.value = value;
20			field.appendChild (input);
21
22			return field;
23			};
24
25			MyNumbersWidget.prototype.clear = function () {
26			var self = this;
27
28			this._clear ();
29
30			var fields = document.createElement ('span');
31			this.container.appendChild (fields);
32			this.fieldsParent = fields;
33
34			var addButton = this.createButton ();
35			addButton.innerHTML = '+';
36			addButton.onclick = function () { self.appendValues ([5]) };
37			this.container.appendChild (addButton);
38			};
39
40			window.onload = function () {
41			new MyNumbersWidget (document.getElementById ('c'));
42			}; // onload
43			</script>
44
45			<p><span id=c data-widget-name=test>
46			<textarea name=tests>5 0 3</textarea>
47			</span>