Difference between revisions of "Demo homepage"

@@ Line 7: / Line 7: @@
 <htmltag tagname="script" type="text/javascript">
-{{Drop down list|Name=Name|Value1=[[Hello]]|Value2=[[Wikipedia|'pedia]]|Value3=[https://www.google.co.in/ Google]|Value4=|Value5=|Value6=|Value7=|Value8=|id=Example}}
+var dropDown = new OO.ui.DropdownWidget( {
+		label: 'Dropdown menu: Select one option',
+		// The menu is composed within the DropdownWidget
+		menu: {
+			items: [
+				new OO.ui.MenuOptionWidget( {
+					data: 'a',
+					label: 'First'
+				} ),
+				new OO.ui.MenuOptionWidget( {
+					data: 'b',
+					label: 'Second (disabled option)',
+					disabled: true
+				} ),
+				new OO.ui.MenuOptionWidget( {
+					data: 'c',
+					label: 'Third'
+				} ),
+				new OO.ui.MenuOptionWidget( {
+					data: 'd',
+					label: 'The fourth option has a long label'
+				} ),
+				new OO.ui.MenuOptionWidget( {
+					data: 'e',
+					label: 'Fifth'
+				} )
+			]
+		}
+	} ),
+// Trigger an event when an item in the menu is selected.
+	itemSelected = function(){
+		console.log( 'item selected' );
+	};
+// Append the menu to the DOM.
+$( document.body ).append( dropDown.$element );
+dropDown.getMenu().on('select', itemSelected);
 </htmltag>

Revision as of 04:45, 22 December 2022