37 lines
872 B
JavaScript
37 lines
872 B
JavaScript
|
/*
|
||
|
|
This example shows elements that are editable inline — either a span or a
|
||
|
|
div.
|
||
|
|
*/
|
||
|
|
'use strict';
|
||
|
|
|
||
|
|
Ox.load('UI', function() {
|
||
|
|
|
||
|
|
var $box = Ox.Element()
|
||
|
|
.attr({id: 'box'})
|
||
|
|
.appendTo(Ox.$body);
|
||
|
|
|
||
|
|
Ox.loop(1, 4, function(i) {
|
||
|
|
Ox.$('<span>')
|
||
|
|
.addClass('label')
|
||
|
|
.html((i > 1 ? ' ' : '') + 'Editable ' + i + ': ')
|
||
|
|
.appendTo($box);
|
||
|
|
Ox.EditableContent({
|
||
|
|
placeholder: 'Placeholder ' + i,
|
||
|
|
tooltip: 'Doubleclick to edit'
|
||
|
|
})
|
||
|
|
.appendTo($box);
|
||
|
|
});
|
||
|
|
|
||
|
|
Ox.$('<div>')
|
||
|
|
.addClass('label')
|
||
|
|
.html('Editable 4:')
|
||
|
|
.appendTo($box);
|
||
|
|
Ox.EditableContent({
|
||
|
|
placeholder: 'Placeholder 4',
|
||
|
|
tooltip: 'Doubleclick to edit',
|
||
|
|
type: 'div'
|
||
|
|
})
|
||
|
|
.appendTo($box);
|
||
|
|
|
||
|
|
});
|