User:Sammp/TestOOUI: Difference between revisions

From GNU Radio
Jump to navigation Jump to search
No edit summary
(Blanked the page)
Tag: Blanking
Line 1: Line 1:
// An example of a fieldset with horizontal layout.


var fieldset = new OO.ui.FieldsetLayout( {
label: 'HorizontalLayout'
} );
// Add an horizontal field layout
fieldset.addItems( [
new OO.ui.FieldLayout(
new OO.ui.Widget( {
content: [ new OO.ui.HorizontalLayout( {
items: [
new OO.ui.ButtonWidget( { label: 'Button' } ),
new OO.ui.ButtonGroupWidget( { items: [
new OO.ui.ToggleButtonWidget( { label: 'A' } ),
new OO.ui.ToggleButtonWidget( { label: 'B' } )
] } ),
new OO.ui.ButtonInputWidget( { label: 'ButtonInput' } ),
new OO.ui.TextInputWidget( { value: 'TextInput' } ),
new OO.ui.CheckboxInputWidget( { selected: true } ),
new OO.ui.RadioInputWidget( { selected: true } ),
new OO.ui.LabelWidget( { label: 'Label' } )
]
} ) ]
} ),
{
label: 'Multiple widgets shown as a single line, ' +
'as used in compact forms or in parts of a bigger widget.',
align: 'top'
}
)
] );
$( "#hook" ).append( fieldset.$element );
// HorizontalLayout with a text input and a label.
var layout = new OO.ui.HorizontalLayout( {
  items: [
    new OO.ui.LabelWidget( { label: 'Label' } ),
    new OO.ui.TextInputWidget( { value: 'Text' } )
  ]
} );
$( "#hook" ).append( layout.$element );
new OO.ui.FieldLayout( new OO.ui.ButtonWidget( {
label: 'Button'
} ), {
align: 'top',
label: 'FieldLayout with help',
help: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\u200e'
} )

Revision as of 21:23, 19 February 2022