• View
• Edit
• History
• Print
• Backlinks

ButtonMarkup

Questions answered by this recipe

All sections are optional, you can remove those that do not apply to your recipe, and add new ones.

Description

Markup to generate very versatile input buttons.

Installation

Add following php code to config:

Markup('button', '<split',
  '/\\(:button\\s*(.*?):\\)(.*?)\\(:(butt)?(on)?end:\\)/si',
  "ButtonMarkup");
function ButtonMarkup($m) {
  extract($GLOBALS["MarkupToHTML"]);
  $opt = ParseArgs($m[1]);
  $label = (!empty($m[2]))? $m[2] : "$[click me!]";
  $opt['name'] = $opt['name'] ?? $opt[''][0] ?? '';
  $attributes = array('name', 'id', 'class', 'type', 'value',
    'form','formaction','formmethod','formnovalidate','formenctype',
    'formtarget','popovertarget','popovertargetaction',
    'accesskey', 'disabled', 'autofocus', 'style');
  $attr = "";
  foreach($attributes as $k) { 
      if(isset($opt[$k])) $attr.=" $k=\"".htmlspecialchars($opt[$k])."\""; 
  }
  $label = MarkupToHTML($pagename,$label);
  return Keep("<button $attr>$label</button>");
}

Configuration

The HTML <button>...</button> tag allows a number of attributes, most are included with this markup definition:
'name', 'id', 'class', 'type', 'value',

 'form', 'formaction', 'formmethod', 'formnovalidate', 'formenctype', 'formtarget',
 'popovertarget', 'popovertargetaction',
 'accesskey', 'disabled', 'autofocus', 'style' 

See https://www.w3schools.com/tags/tag_button.asp for details.

Usage

Use as markup (:button <attributes> :)<label text>(:buttonend:) inside or outside other form markup. <label text> can contain wiki styles and other markup. It can be multi-line. It can be an image attached.

If used outside of input form markup it can be tied to the form with parameter form=<id of input form>. If used as type=submit button and a value='<value>' is set the value will be submitted by the form. This allows building of forms with multiple submit buttons submitting each their custom value.

(:button type=submit value='custom value' form='myformid':)
%red%Submit%% 
''custom formatted''
button label
(:buttonend:)

With popovertarget=<id of popover div> set a button can toggle a div to show and hide. The div needs a parameter popover=1 set. The div can be anywhere in the page. It will pop out centrally.

(:button popovertarget=popme:)%red%click me!(:buttonend:)
(:div id=popme popover=1:)
pop div content...
(:divend:)

Notes

To do / some day / maybe

If you have future plans or wishes for this recipe.

Change log / Release notes

If the recipe has multiple releases, then release notes can be placed here. Note that it's often easier for people to work with "release dates" instead of "version numbers".

See also

Contributors

Comments

See discussion at ButtonMarkup-Talk