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	<!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>