Skip to content

PKUI.MESSAGE.Prompt

kerrishotts edited this page Nov 15, 2012 · 3 revisions

(part of PKUI.MESSAGE) | (inherits from PKUI.MESSAGE.Confirm)

Return Type: message

Parameters: title, text, inputType, defaultValue, buttons (all string), dismissFunction ( function )

Creates a prompt message box with the desired title, text, an INPUT element, and the desired buttons. When a button is pressed or the message box is dismissed, the dismissFunction is called with the button index (or -1 if dismissed without a button press).

The title and text can be regular text or have HTML embedded. If HTML is used, be sure to properly end any tags.

The INPUT element is given the type specified by inputType, which defaults to text. If the characters should be masked, use password. The value given to the element is defaultValue.

buttons is a pipe (|) delimited string that defines each button. Each button can also contain modifiers at the end of the button's text that changes how the button is classed. If there are two buttons or fewer, the buttons will be inline with each other -- if there are three or more buttons, they will be displayed in a list.

The button modifiers are as follows:

Modifier    Class          Example
*           destructive    Delete Item*
>           go             Open in Browser>
<           cancel         Cancel<
_           wideButton     This is a wide button_

Modifiers are removed from their button's text. If the button needs to display a modifier character at the end of the button, there must be a space after the modifier character, such as Delete* . In this case, the asterisk will render as part of the button's text.

Note: Not every platform will display a button that has a modifier differently. As of v0.2, only the iOS platform renders the destructive, go, and cancel buttons with different button styles.

Example:

var mbox = new PKUI.MESSAGE.Prompt ( 
             "Rename",
             "Provide a new name for the file:",
             "text", theFileName,
             "Rename>|Cancel<",
             function ( buttonIndex )
             {
               if (buttonIndex === 0) { renameTheFile(mbox.inputElement.value); }
             }
);
mbox.show();

Notes

  • Only iOS (as of v0.2) renders button modifiers differently. Destructive buttons are rendered with a red background, Action buttons (classed go) are rendered with a green background, and Cancel buttons are rendered with a dark grey background.
  • The message box does not appear until explicitly shown via the show method.
  • Once the message box is shown, it does not disappear until it is explicitly hidden, a button is tapped, or a physical back button event occurs (assuming the back button is intended to be caught).
  • The only way to access the value of the input element is to access the object's inputElement property and access the value property.

Properties

  • inputElement - a DOM element representing the INPUT element. Use .value to retrieve the value of the element.

Version

0.1 Introduced

0.2 Docs Valid

Clone this wiki locally