MiServer is a free, open-source web server implemented in Dyalog APL. It enables the APL user to build sophisticated websites with little to no knowledge of the web technologies like HTML, JavaScript, etc. We hope that you will enjoy MiServer; join the forums🔗, and contribute via GitHub🔗.

This website serves as guide to MiServer 3.0 – providing documentation, samples, and advice. At the same time, it showcases many of MiServer's capabilities. If you are just getting started with MiServer 3.0, check out the Tutorial tab. Look through the Samples to get an idea of of the variety of web content that MiServer can generate.

Explore the tabs for documentation, the broad selection of available controls, and the vast collection of sample pages and mini-apps. See the source of any page by clicking the MS3 logo in the top left corner and access other resources by clicking the Resources link in the top right corner.

JavaScript DataTable sample
JavaScript DataTable: Search almost 1500 idioms in an instant.
Dyalog ListManager sample
Dyalog ListManager: Move fruits between lists with streamlined interface.
HTML form sample
HTML form: Arrange many interactive elements together.
Dyalog RadioButtonGroup sample
Dyalog RadioButtonGroup: Create an entire group of radio buttons at once.
Syncfusion ejTreeGrid sample
Syncfusion ejTreeGrid: View and collapse a structured spreadsheet.
Syncfusion ejMenu sample
Syncfusion ejMenu: Build a menu from external data.
jQuery UI Spinner sample
jQuery UI Spinner: (Pre-) select values with spinners.
HTML video sample
HTML video: Specify a list of alternate video sources.

In the tabs below, you will find categorized examples of webpage content. Click any element for more information.

This div is the main container of this tab.

This is the beginning of a paragraph, but this phrase is a separate piece of text inside the paragraph.

StackPanel

CheckBoxes
RadioButtonGroup
Slider
  • Primaries
    • Cyan
    • Magenta
    • Yellow
  • Key
    • Black
ColorRGB
aqua#00FFFF
black#000000
blue#0000FF
fuchsia#FF00FF
gray#808080
green#008000
lime#00FF00
maroon#800000
navy#000080
olive#808000
purple#800080
red#FF0000
silver#C0C0C0
teal#008080
white#FFFFFF
yellow#FFFF00
This div has inner padding and gradient backround

Bold indented text which has to be extremely long in order to show that only the first line is being indented.

Huge text with outer marginExpanded and underlined

Blue box with shadow

Centered text with shadow

White text on image background

Surrounded by borders and top-right corner is round

Image

Inline paragraph with limited width and single line height.

Monospace, Sans-Serif, and Serif.
This div has its default positioning
This div contains embedded items
This div shows user interaction
This div shows floating GUI elements

Browse Examples Directory

Task demonstratedTypeMain controls used
documentation links
Insert a linksimpleA
Nested custom themed tabs with complex titlesadvancedAccordion
Dyalog collapsing interface with four pseudo-language sectionssimpleAccordion
Play an audio filesimpleAudio
Button with callbacksimpleButton
Variably tristate check-boxadvancedCheckBox
Optionally tristate check-boxsimpleCheckBox
An auto-completeable drop-downsimpleDatalist
Collect input and echo it on a button presssimpleEditField, Button, label
Enter first and last name in a FieldSet (reacts to each keystroke)simpleFieldset, label, EditField
Figure with captionsimpleFigure
Explain about FormssimpleForm
Simple accelerometer interaction (use it from a platform which responds to movement)simpleGyro
Advanced ways to use iconsadvancedIcon
Icon-Finder for FontAwesome-IconsadvancedIcon
Icons from FontAwesome, Syncfusion, and GooglesimpleIcon
Date/time, email, URL, file, and submit Input elementsadvancedInput, InputSubmit
Input-control to handle file-uploadssimpleInputFile, , , Input
Various costumizations of grid-aligned inputsadvancedInputGrid
Enter first, last name and birthdatesimpleInputGrid
Text, number, password, and range Input elementssimpleInput, Table
Nested (multi-level) listsadvancedList
Move fruits between lists with streamlined interfacesimpleListManager
Lists of fruits and clickable linkssimpleList
Use markdown to generate HTMLsimpleMarkdown
Insert an ordered list of links based on an array of texts and links, and add callbacks on mouse movementsadvancedOl
Lists of fruits and clickable linkssimpleOl
Demonstrates options for customization of PanelsadvancedPanel
Display information, warnings, errors or success-messagesimplePanel
Special options for RadioButtonGroupadvancedRadioButtonGroup
Create an entire group of radio buttons at oncesimpleRadioButtonGroup
Clear a form with a ResetButtonsimpleResetButton, SubmitButton, Fieldset
Insert reference to JavaScript from a fileadvancedScript
Insert inline JavaScript and make a button to run itsimpleScript
Select one or more fruits from a list.advancedSelect
Pick fruits from a simple drop-down simpleSelect
Nested StackPanels provide flexible layout control.advancedStackPanel
Vertical and Horizontal "stacking" of content.simpleStackPanel
Color headings red using an external style sheetsimpleStyleSheet
Color headings red using an internal style elementsimpleStyle
Use a SubmitButton to POST a form, rather than use an AJAX callbacksimpleSubmitButton, ResetButton, Fieldset
Display tabular data with a bit of stylingadvancedTable
Automatically display a matrix as a tablesimpleTable
Nested custom themed tabs with complex titlesadvancedTabs
Dyalog tabbed interface with four pseudo-language tabssimpleTabs
Interactive control of multiple timersadvancedTimer
Signal timed events to the serversimpleTimer
Insert an unordered list of links based on an array of texts and links, and add callbacks on mouse movementsadvancedUl
Lists of fruits and clickable linkssimpleUl
Accordion which calls back to the server on open/closeadvancedejAccordion
Syncfusion collapsing interface with four pseudo-language sectionssimpleejAccordion
Show information as barcodessimpleejBarcode
Customized ruler-style indicatoradvancedejBulletGraph
Ruler-style indicator of two related valuessimpleejBulletGraph
Toggle availablility of one button with anotheradvancedejButton
Illustrates a simple push-buttonsimpleejButton
Simple pie chart of workspace object sizessimpleejChart
Callback interconnect two checkboxesadvancedejCheckBox
Checkbox with callbacksimpleejCheckBox
Formatted circular indicator gauge with multiple pointersadvancedejCircularGauge
Speedometer style displaysimpleejCircularGauge
Insert a basic color picker with preset palettessimpleejColorPicker, Select
Insert mutually interdependant calendarsadvancedejDatePicker
Pick a date in yyyy/MM/dd formatsimpleejDatePicker
Let user select dates/times and display the differenceadvancedejDateTimePicker
Insert an interface to select date and timesimpleejDateTimePicker
Interdependant multi-modal dialog boxesadvancedejDialog
Simple dialog boxsimpleejDialog
Various digital segment (LCD style) displaysadvancedejDigitalGauge
Digital (LCD-style) displaysimpleejDigitalGauge
Make an element draggablesimpleejDraggable
Make elements accept draggable contentsimpleejDroppable
An editable gridadvancedejGrid
Read-only grid with formatting and alignmentsimpleejGrid
Linear gauge with custom scale (Fahrenheit thermometre)advancedejLinearGauge
Linear gauge (thermometre style)simpleejLinearGauge
Listbox of reorderable options for selectionadvancedejListBox
Listbox of options for selectionsimpleejListBox
Build a horizontal menu (bar) from external dataadvancedejMenu
Demonstrate the Syncfusion ejMenu widget with databindingadvancedejMenu
Horizontal (application or navigation ) menu bar with background imagesimpleejMenu
Open Rich-Text Editor and retrieve documentsimpleejRTE
RatingsimpleejRating
Single and Ranged SliderssimpleejSlider
Tabbed interface with tabs on the leftadvancedejTab
Syncfusion tabbed interface with four pseudo-language tabssimpleejTab
Display a tag cloud of object sizes in MiServer's workspacesimpleejTagCloud
Validate numbers, currency and percentagessimpleejTextBox
Button with two statessimpleejToggleButton
View and collapse a structured spreadsheetsimpleejTreeGrid
TreeView with checkable nodes and ability to add and delete nodesadvancedejTreeView
Build a simple tree with a node selection callbacksimpleejTreeView
Insert styled toggleable pop-up with arbitrary web contentadvancedejWaitingPopup
Insert the three basic forms of toggleable "please wait" indicatorsimpleejWaitingPopup
jQuery UI collapsing interface with four pseudo-language sectionssimplejqAccordion
Add a class during callbacksimplejqAddClass, head
Grouped sets of buttonssimplejqButtonset
Take a div for a dragsimplejqDraggable
Make elements accept draggable contentsimplejqDroppable
Build a vertical (drop-down) menu from external dataadvancedjqMenu
Insert a vertical (drop-down or context) menusimplejqMenu
Remove a class during callbacksimplejqRemoveClass, head
Resize a DivsimplejqResizable
Using one slider to set the bounds of anotheradvancedjqSlider
Single and Ranged SliderssimplejqSlider
Grid of reorderable boxesadvancedjqSortable
List of items that can to be dragged to rearrange in a new ordersimplejqSortable
Select and preselect values with spinnerssimplejqSpinner
Interchange classes during callbacksimplejqSwitchClass, head
jQuery UI tabbed interface with four pseudo-language tabssimplejqTabs
Toggle a class during callbacksimplejqToggleClass, head
Toggle, show, and hide an element during callbacksimplejqToggle, jqHide, jqShow, head
Select one or more fruits or vegetables from a list which might be updated with a button-clickadvancedChosen
Pick fruits from a simple drop-down simpleChosen
Simple Example slightly advanced with zebra-striping and highlighted search-termsadvancedDataTable
A DataTable with the "yadcf"-Filters enabledadvancedDataTable
The simplest use case of a DataTablesimpleDataTable
Dimple data chartsimpledimple
An example of what "dimple" can dosimpleScript, div
Dimple line plot chartsimpledimple
Dimple line plot chartsimple, dimple, , div
Advanced jBox-TooltipsadvancedjBox
confirmations (works, but may need more features...)advancedjBox
Using jBox in callback-functions to display notices or modal popupsadvancedjBox
Image-galleries with jBoxadvancedjBox
jBox provides several style of popupssimplejBox
JavaScript library that implements SHA-based hashing algorithmssimple
Insert a hyperlinksimplea
Display definition when hovering over an abbreviationsimpleabbr
Add contact informationsimpleaddress
Mark an independent sectionsimplearticle
Insert a sidebar with related informationsimpleaside
Specify a list of alternate audio sourcesadvancedaudio, source
Embed an audio streamsimpleaudio
Make text boldsimpleb
Set document base URI for relative linkssimplebase, a
Isolate text that should be displayed with a reading order that is different from the surrounding textsimplebdi
Override the inherent directionality of text, i.e. the left-to-right or right-to-left reading ordersimplebdo
Insert a long quotation of textsimpleblockquote
Insert a line breaksimplebr
Insert a push buttonsimplebutton
Bitmap image canvas and draw a picture using JavaScriptsimplecanvas, script
Inform where a text was quoted fromsimplecite
Embed a code fragmentsimplecode
Add a predefined list of options for later use in a controlsimpledatalist, input, option
Mark deleted textsimpledel
Make an expandable menuadvanceddetails, summary
Add a summary with revealable detailssimpledetails, summary
Reveal the definition of a term (here a function name) when the mouse hovers over the termsimpledfn
Add interactivity to a divisionsimplediv
Create a list of descriptions for several termssimpledl, dt, dd
Emphasize textsimpleem
Embed an external application, i.e. a plug-insimpleembed
Group form controlssimplefieldset, legend
Insert a figure with a captionsimpleimg, figure, figcaption
Section footer following run of paragraphssimplefooter
Arrange many interactive elements togethersimpleform, input, textarea, select, option, optgroup, fieldset, label, keygen, legend
Insert all possible levels of headersimpleh1, h2, h3, h4, h5, h6
Insert a header with introductory contentsimpleheader
Draw a horizontal dividing linesimplehr
Italicize textsimplei
Embed another webpagesimpleiframe
Mark inserted textsimpleins
Indicate user inputsimplekbd
Allow clicking somewhere else to interact with controlsadvancedlabel, form
Include text in controls' clickable areasimplelabel, form
Add nested lists of varying typesadvancedli, ol, ul
Add ordered and unordered listssimpleli, ol, ul
Embed raw image data in the page itselfadvancedlink
Include an external resource; here an iconsimplelink
Image (in this case a map) with clickable areassimpleimg, map, area
Highlight textsimplemark
Create a context menusimplemenu, menuitem, div
Display a gauge for measurement within a given rangesimplemeter
Mark the main navigation controlssimplenav, a
Add alternative content for when JavaScript is turned off or not supportedsimplenoscript, script
Embed a PDF filesimpleobject
Insert an expression's result valuesimpleoutput, form, input
Three simple paragraphssimplep
Define the parameters for a en embedded objectsimpleobject, param
Block of text preserving linebreaks and multiple spacessimplepre
Graphically display time using progress barssimpleprogress
Mark text as a quotation inside the containing textsimpleq
Add nested ruby text and an alternative for non-supporting browsersadvancedruby, rt, rp
Add pronunciation and explanation as ruby text (5.5pt) over the linesimpleruby, rt
Strike-through textsimples
Indicate computer outputsimplesamp
Embed JavaScriptsimplescript
Define a section in a documentsimplesection
Make text smallersimplesmall
Delimit inline content for later manipulationsimplespan
Mark important textsimplestrong
Embed a style sheetsimplestyle
Make text subscriptsimplesub
Make text superscriptsimplesup
Use SVG to drawsimplesvg, circle, ellipse, polyline, polygon, rect, line, path
Insert an interactive table with column-wise formattingadvancedtable, tbody, thead, tfoot, colgroup, col, tr, td, th, caption
Manually display a matrix as a tablesimpletable, tr, td
Insert a multi-line text controlsimpletextarea
Indicate a timesimpletime
Set the document title in the browser's tab or title barsimpletitle
Specify subtitles (closed captions)simpletrack, video
Underline textsimpleu
Indicate a variablesimplevar
Specify a list of alternate video sourcesadvancedvideo, source
Embed a videosimplevideo
Indicate where to break a work if it must be brokensimplewbr
Use external code to style and touch-enable uppercase-lowercase alphabet pairing gamemini-appjqDroppable, jqDraggable, jqAddClass, Script, StyleSheet
John Conway's "Game of Life" (interactive)mini-appTable, RadioButtonGroup, Timer
Search the Dyalog, FinnAPL, and APL2 idiom listsmini-appDataTable
Children's educative application for Yiddish alphabet and keyboardmini-appButton, span
Simple mortgage calculation applicationmini-appEditField, Form, InputGrid
Classic Snakes and Ladders Gamemini-appsvg, StackPanel
Simple version of the addictive "2048" sliding gamemini-appTable
Vector graphics Tic Tac Toe gamemini-appsvg, Table, StyleSheet
SVG turtle graphicsmini-appsvg, line, Input
Whack-A-Duck: Shrinking button that jumps away progressively faster when you click itmini-appimg, script, img, style
Control
documentation link
DescriptionRelevant samples
ADyalog Hyperlink widget based on the HTML a tag

Insert a link

AccordionDyalog Accordion widget

Dyalog collapsing interface with four pseudo-language sections


Nested custom themed tabs with complex titles

AudioSame as base HTML5 audio element but sets default message for browsers that don't support it

Play an audio file

ButtonUsed to initiate actions

Button with callback


Children's educative application for Yiddish alphabet and keyboard


Collect input and echo it on a button press

CheckBoxDyalog checkbox widget with tristate support

Optionally tristate check-box


Variably tristate check-box

ChosenEnhanced HTML selects with search-box and improved multi-select

Pick fruits from a simple drop-down


Select one or more fruits or vegetables from a list which might be updated with a button-click

DataTableEnhanced searchable and reorderable HTML table

The simplest use case of a DataTable


Search the Dyalog, FinnAPL, and APL2 idiom lists


Simple Example slightly advanced with zebra-striping and highlighted search-terms


A DataTable with the "yadcf"-Filters enabled

DatalistDyalog improved HTML5 datalist element

An auto-completeable drop-down

DirectoryBrowser
EditFieldDyalog text input field widget

Collect input and echo it on a button press


Simple mortgage calculation application


Enter first and last name in a FieldSet (reacts to each keystroke)

FieldsetSame as base HTML5 fieldset, but accepts the legend for the fieldset as an argument

Enter first and last name in a FieldSet (reacts to each keystroke)


Clear a form with a ResetButton


Use a SubmitButton to POST a form, rather than use an AJAX callback

FigureSame as base HTML5 figure, but with Caption and CaptionPos attributes

Figure with caption

FormSame as the base HTML5 form element, but sets the action and method attributes

Explain about Forms


Simple mortgage calculation application

GridGrid - like _.Table but with borders - accepts matrix of data
Gyrocreate a gyroscopic listener (e.g. for use with mobile phones or tablets)

Simple accelerometer interaction (use it from a platform which responds to movement)

IconDyalog Icon widget

Icons from FontAwesome, Syncfusion, and Google


Advanced ways to use icons


Icon-Finder for FontAwesome-Icons

InputDyalog input widget

Text, number, password, and range Input elements


Date/time, email, URL, file, and submit Input elements


SVG turtle graphics


Input-control to handle file-uploads

InputFileDyalog input file widget

Input-control to handle file-uploads

InputGridDyalog Widget - produce a 2-column (or 2-row) grid of labels and inputs

Enter first, last name and birthdate


Various costumizations of grid-aligned inputs


Simple mortgage calculation application

InputSubmitDyalog input submit button widget

Date/time, email, URL, file, and submit Input elements

ListEnhanced HTML ul

Lists of fruits and clickable links


Nested (multi-level) lists

ListManagerDyalog ListManager widget using Syncfusion ListBoxes

Move fruits between lists with streamlined interface

MarkdownInsert rendered Markdown content (using MarkAPL from APL Team/Kai Jaeger)

Use markdown to generate HTML

OlEnhanced HTML ol

Lists of fruits and clickable links


Insert an ordered list of links based on an array of texts and links, and add callbacks on mouse movements

PanelPanel widget

Display information, warnings, errors or success-message


Demonstrates options for customization of Panels

RadioButtonGroupDyalog Radio Button Group widget

Create an entire group of radio buttons at once


Special options for RadioButtonGroup


John Conway's "Game of Life" (interactive)

Redirect
ResetButtonDyalog Reset Button widget

Clear a form with a ResetButton


Use a SubmitButton to POST a form, rather than use an AJAX callback

ScriptDyalog Script widget - embeds JavaScript in page

Insert inline JavaScript and make a button to run it


An example of what "dimple" can do


Insert reference to JavaScript from a file


Use external code to style and touch-enable uppercase-lowercase alphabet pairing game

SelectDyalog Enhanced HTML select

Pick fruits from a simple drop-down


Select one or more fruits from a list.


Insert a basic color picker with preset palettes

StackPanelDyalog control to emulate WPF StackPanel

Vertical and Horizontal "stacking" of content.


Nested StackPanels provide flexible layout control.


Classic Snakes and Ladders Game

StyleDyalog Style widget - makes for easier programatic setting of CSS styles

Color headings red using an internal style element

StyleSheetDyalog StyleSheet widget - creates a link to a stylesheet

Color headings red using an external style sheet


Vector graphics Tic Tac Toe game


Use external code to style and touch-enable uppercase-lowercase alphabet pairing game

SubmitButtonDyalog Submit Button widget

Use a SubmitButton to POST a form, rather than use an AJAX callback


Clear a form with a ResetButton

TableImproved html table - accepts matrix of data

Automatically display a matrix as a table


John Conway's "Game of Life" (interactive)


Simple version of the addictive "2048" sliding game


Display tabular data with a bit of styling


Text, number, password, and range Input elements


Vector graphics Tic Tac Toe game

TabsDyalog Tabs widget

Dyalog tabbed interface with four pseudo-language tabs


Nested custom themed tabs with complex titles

TimerDyalog JavaScript Timer

Signal timed events to the server


Interactive control of multiple timers


John Conway's "Game of Life" (interactive)

UlEnhanced HTML ul

Lists of fruits and clickable links


Insert an unordered list of links based on an array of texts and links, and add callbacks on mouse movements

aHyperlink

Insert a hyperlink


Set document base URI for relative links


Mark the main navigation controls

abbrAbbreviation

Display definition when hovering over an abbreviation

addressContact information

Add contact information

areaImage map region

Image (in this case a map) with clickable areas

articleIndependent section

Mark an independent section

asideAuxiliary section

Insert a sidebar with related information

audioAudio stream

Embed an audio stream


Specify a list of alternate audio sources

bBold text

Make text bold

baseDocument base URI

Set document base URI for relative links

bdiIsolates a part of text that might be formatted in a different direction from other text outside it

Isolate text that should be displayed with a reading order that is different from the surrounding text

bdoBi-directional text override

Override the inherent directionality of text, i.e. the left-to-right or right-to-left reading order

blockquoteLong quotation

Insert a long quotation of text

bodyMain content
brLine break

Insert a line break

buttonPush button control

Insert a push button

canvasBitmap canvas

Bitmap image canvas and draw a picture using JavaScript

captionTable caption

Insert an interactive table with column-wise formatting

circleDefines a circle

Use SVG to draw

citeCitation

Inform where a text was quoted from

codeCode fragment

Embed a code fragment

colTable column

Insert an interactive table with column-wise formatting

colgroupTable column group

Insert an interactive table with column-wise formatting

d3
datalistPredefined control values

Add a predefined list of options for later use in a control

ddDescription description

Create a list of descriptions for several terms

delDeletion

Mark deleted text

detailsAdditional information

Add a summary with revealable details


Make an expandable menu

dfnDefining instance of a term

Reveal the definition of a term (here a function name) when the mouse hovers over the term

dialogConversation
dimple

Dimple data chart


Dimple line plot chart


Dimple line plot chart

divGeneric division

Add interactivity to a division


An example of what "dimple" can do


Create a context menu


Dimple line plot chart

dlDescription list

Create a list of descriptions for several terms

dtDescription term

Create a list of descriptions for several terms

ejAccordionSyncfusion Accordion widget

Syncfusion collapsing interface with four pseudo-language sections


Accordion which calls back to the server on open/close

ejAutocomplete
ejBarcodeSyncfusion Barcode widget

Show information as barcodes

ejBulletGraphSyncfusion Bullet Graph widget

Ruler-style indicator of two related values


Customized ruler-style indicator

ejButtonSyncfusion Button widget

Illustrates a simple push-button


Toggle availablility of one button with another

ejCaptcha
ejChartSyncfusion Chart widget

Simple pie chart of workspace object sizes

ejCheckBoxSyncfusion Checkbox widget

Checkbox with callback


Callback interconnect two checkboxes

ejCircularGaugeSyncfusion Circular Gauge widget

Speedometer style display


Formatted circular indicator gauge with multiple pointers

ejColorPickerSyncfusion ColorPicker widget

Insert a basic color picker with preset palettes

ejCurrencyTextbox
ejDatePickerSyncfusion DatePicker widget

Pick a date in yyyy/MM/dd format


Insert mutually interdependant calendars

ejDateTimePickerSyncfusion DateTimePicker widget

Insert an interface to select date and time


Let user select dates/times and display the difference

ejDiagram
ejDialogSyncfusion Digital Gauge widget

Simple dialog box


Interdependant multi-modal dialog boxes

ejDigitalGaugeSyncfusion Digital Gauge widget

Digital (LCD-style) display


Various digital segment (LCD style) displays

ejDraggableSyncfusion Draggable widget

Make an element draggable

ejDropDownListSyncfusion DropDownList widget
ejDroppableSyncfusion Droppable widget

Make elements accept draggable content

ejGantt
ejGrid

Read-only grid with formatting and alignment


An editable grid

ejLinearGaugeSyncfusion Linear Gauge widget

Linear gauge (thermometre style)


Linear gauge with custom scale (Fahrenheit thermometre)

ejListBoxSyncfusion ListBox widget

Listbox of options for selection


Listbox of reorderable options for selection

ejLocale
ejMap
ejMaskEdit
ejMenuSyncfusion Menu widget

Horizontal (application or navigation ) menu bar with background image


Build a horizontal menu (bar) from external data


Demonstrate the Syncfusion ejMenu widget with databinding

ejNavigationDrawer
ejNumericTextbox
ejPercentageTextbox
ejProgressBar
ejRTESyncfusion Rich-Text Editor

Open Rich-Text Editor and retrieve document

ejRadioButton
ejRangeNavigator
ejRatingSyncfusion Rating widget

Rating

ejResizable
ejRotator
ejSchedule
ejScroller
ejSliderSyncfusion Slider widget

Single and Ranged Sliders

ejSplitButton
ejSplitter
ejSpreadsheet
ejSymbolPalette
ejTabSyncfusion Tab widget

Syncfusion tabbed interface with four pseudo-language tabs


Tabbed interface with tabs on the left

ejTagCloudSyncfusion TagCloud widget

Display a tag cloud of object sizes in MiServer's workspace

ejTextBox

Validate numbers, currency and percentages

ejTile
ejTimePicker
ejToggleButtonSyncfusion ToggleButton widget

Button with two states

ejToolbar
ejTreeGridSyncfusion TreeGrid widget Formats data in a grid with tree-based collapsibility

View and collapse a structured spreadsheet

ejTreeMap
ejTreeViewSyncfusion TreeView widget

Build a simple tree with a node selection callback


TreeView with checkable nodes and ability to add and delete nodes

ejUploadbox
ejWaitingPopupSyncfusion WaitingPopup widget

Insert the three basic forms of toggleable "please wait" indicator


Insert styled toggleable pop-up with arbitrary web content

ellipseDefines an ellipse

Use SVG to draw

emStress emphasis

Emphasize text

embedEmbedded application

Embed an external application, i.e. a plug-in

fieldsetForm control group

Group form controls


Arrange many interactive elements together

figcaptionDefines a caption for a figure element

Insert a figure with a caption

figureFigure with caption

Insert a figure with a caption

footerSection footer

Section footer following run of paragraphs

formForm

Arrange many interactive elements together


Include text in controls' clickable area


Insert an expression's result value


Allow clicking somewhere else to interact with controls

h1Heading level 1

Insert all possible levels of header

h2Heading level 2

Insert all possible levels of header

h3Heading level 3

Insert all possible levels of header

h4Heading level 4

Insert all possible levels of header

h5Heading level 5

Insert all possible levels of header

h6Heading level 6

Insert all possible levels of header

headDocument head

Add a class during callback


Remove a class during callback


Interchange classes during callback


Toggle a class during callback


Toggle, show, and hide an element during callback

headerSection header

Insert a header with introductory content

hrSeparator

Draw a horizontal dividing line

htmlDocument root
iItalic text

Italicize text

iframeInline frame

Embed another webpage

imgImage

Insert a figure with a caption


Image (in this case a map) with clickable areas


Whack-A-Duck: Shrinking button that jumps away progressively faster when you click it

inputForm control

Add a predefined list of options for later use in a control


Arrange many interactive elements together


Insert an expression's result value

insInsertion

Mark inserted text

jBoxjBox widget

jBox provides several style of popups


Advanced jBox-Tooltips


confirmations (works, but may need more features...)


Using jBox in callback-functions to display notices or modal popups


Image-galleries with jBox

jqAccordionjQueryUI Accordion widget

jQuery UI collapsing interface with four pseudo-language sections

jqAddClassjQueryUI AddClass effect

Add a class during callback


Use external code to style and touch-enable uppercase-lowercase alphabet pairing game

jqAutocomplete
jqButtonjQueryUI Sortable widget/interaction
jqButtonsetjQueryUI Sortable widget/interaction

Grouped sets of buttons

jqDatePicker
jqDialog
jqDraggablejQueryUI Draggable interaction

Take a div for a drag


Use external code to style and touch-enable uppercase-lowercase alphabet pairing game

jqDroppablejQueryUI Droppable interaction

Make elements accept draggable content


Use external code to style and touch-enable uppercase-lowercase alphabet pairing game

jqHidejQueryUI Hide effect

Toggle, show, and hide an element during callback

jqMenujQueryUI Menu widget

Insert a vertical (drop-down or context) menu


Build a vertical (drop-down) menu from external data

jqProgressbar
jqRemoveClassjQueryUI RemoveClass effect

Remove a class during callback

jqResizablejQueryUI Resizable interaction

Resize a Div

jqSelectable
jqShowjQueryUI Show effect

Toggle, show, and hide an element during callback

jqSliderjQueryUI Slider widget

Single and Ranged Sliders


Using one slider to set the bounds of another

jqSortablejQueryUI Sortable widget/interaction

List of items that can to be dragged to rearrange in a new order


Grid of reorderable boxes

jqSpinnerjQueryUI Spinner widget

Select and preselect values with spinners

jqSwitchClassjQueryUI SwitchClass effect

Interchange classes during callback

jqTabsjQueryUI Tabs widget

jQuery UI tabbed interface with four pseudo-language tabs

jqTogglejQueryUI Toggle effect

Toggle, show, and hide an element during callback

jqToggleClassjQueryUI ToggleClass effect

Toggle a class during callback

jqTooltip
kbdUser input

Indicate user input

keygenDefines a key-pair generator field (for forms)

Arrange many interactive elements together

labelForm control label

Include text in controls' clickable area


Allow clicking somewhere else to interact with controls


Enter first and last name in a FieldSet (reacts to each keystroke)


Collect input and echo it on a button press


Arrange many interactive elements together

legendExplanatory title or caption

Group form controls


Arrange many interactive elements together

liList item

Add ordered and unordered lists


Add nested lists of varying types

lineDefines a line segment that starts at one point and ends at another

SVG turtle graphics


Use SVG to draw

linkLink to resources

Include an external resource; here an icon


Embed raw image data in the page itself

mainSpecifies the main content of a document
mapClient-side image map

Image (in this case a map) with clickable areas

markMarked or highlighted text

Highlight text

menuCommand menu

Create a context menu

menuitemDefines a command/menu item that the user can invoke from a popup menu

Create a context menu

metaMetadata
meterScalar measurement

Display a gauge for measurement within a given range

navNavigation

Mark the main navigation controls

noscriptNo-script support

Add alternative content for when JavaScript is turned off or not supported

objectGeneric embedded resource

Embed a PDF file


Define the parameters for a en embedded object

olOrdered list

Add ordered and unordered lists


Add nested lists of varying types

optgroupOption group

Arrange many interactive elements together

optionSelection choice

Add a predefined list of options for later use in a control


Arrange many interactive elements together

outputOutput control

Insert an expression's result value

pParagraph

Three simple paragraphs

paramPlugin parameter

Define the parameters for a en embedded object

pathDefines a generic shape

Use SVG to draw

polygonDefines a closed shape consisting of a set of connected straight line segments

Use SVG to draw

polylineDefines a set of connected straight line segments

Use SVG to draw

prePreformatted text

Block of text preserving linebreaks and multiple spaces

progressProgress of a task

Graphically display time using progress bars

qInline quotation

Mark text as a quotation inside the containing text

rectDefines a rectangle

Use SVG to draw

rpRuby parenthesis

Add nested ruby text and an alternative for non-supporting browsers

rtRuby text

Add pronunciation and explanation as ruby text (5.5pt) over the line


Add nested ruby text and an alternative for non-supporting browsers

rubyRuby annotation

Add pronunciation and explanation as ruby text (5.5pt) over the line


Add nested ruby text and an alternative for non-supporting browsers

sDefines text that is no longer correct

Strike-through text

sampSample output

Indicate computer output

scriptLinked or embedded script

Embed JavaScript


Bitmap image canvas and draw a picture using JavaScript


Add alternative content for when JavaScript is turned off or not supported


Whack-A-Duck: Shrinking button that jumps away progressively faster when you click it

sectionDocument section

Define a section in a document

selectSelection control

Arrange many interactive elements together

smallSmall print

Make text smaller

sourceMedia resource

Specify a list of alternate audio sources


Specify a list of alternate video sources

spanGeneric inline container

Delimit inline content for later manipulation


Children's educative application for Yiddish alphabet and keyboard

strongStrong importance

Mark important text

styleEmbedded stylesheet

Embed a style sheet


Whack-A-Duck: Shrinking button that jumps away progressively faster when you click it

subSubscript

Make text subscript

summaryDefines a visible heading for a details element

Add a summary with revealable details


Make an expandable menu

supSuperscript

Make text superscript

svgDefines a container for SVG graphics

Use SVG to draw


Classic Snakes and Ladders Game


Vector graphics Tic Tac Toe game


SVG turtle graphics

tableTable

Manually display a matrix as a table


Insert an interactive table with column-wise formatting

tbodyTable body

Insert an interactive table with column-wise formatting

tdTable cell

Manually display a matrix as a table


Insert an interactive table with column-wise formatting

textareaMulti-line text control

Insert a multi-line text control


Arrange many interactive elements together

tfootTable footer

Insert an interactive table with column-wise formatting

thTable header cell

Insert an interactive table with column-wise formatting

theadTable head

Insert an interactive table with column-wise formatting

timeDate and/or time

Indicate a time

titleDocument title

Set the document title in the browser's tab or title bar

trTable row

Manually display a matrix as a table


Insert an interactive table with column-wise formatting

trackDefines text tracks for media elements

Specify subtitles (closed captions)

uDefines text that should be stylistically different from normal text

Underline text

ulUnordered list

Add ordered and unordered lists


Add nested lists of varying types

varVariable

Indicate a variable

videoVideo or movie

Embed a video


Specify a list of alternate video sources


Specify subtitles (closed captions)

wbrDefines a possible line-break

Indicate where to break a work if it must be broken

Controls used on this page: Dyalog: AListTableTabs JavaScript: DataTable Base HTML: brdivp