Example. Simple Text Modal

Launch a modal with a text body.


TW4Dialog.Show({
  Title: "Modal Example",
  Content: "Hello Momo!",
  Size: "md"
});

Example. Basic Modal

Launch a modal and fetch a html body from a URL.


  TW4Dialog.Show({
    Title: "Modal Fetch Example",
    Content: "Loading...",
    Url: "https://cdn.hiimray.co.uk/sample/hellomomo.txt",
    Size: "lg"
  });

Example. Update Modal

Make changes (title, body, size or footer) to a modal.


TW4Dialog.Show({
  Id: "modalR1",
  Title: "Modal Title",
  Content: "Hello Momo!",
  Url: null,
  Size: "md"
});

TW4Dialog.Update({
  Id: "modalR1",
  Title: "Modal Changed Title",
  Content: "Hello momo again!",
  Url: null,
  Size: "sm",
  ShowFooter: false
});

Example. Multiple Modals (Stack)

Launch multiple modals, stacked on top of each other.


TW4Dialog.Show({
  Id: "modalL3a",
  Title: "Modal A Title",
  Content: "First!",
  Url: null,
  Size: "md"
});

TW4Dialog.Show({
  Id: "modalL3b",
  Title: "Modal B Title",
  Content: "Second!",
  Url: null,
  Size: "md"
});

Example. MessageBox Example (Button Prompts)

Launch a modal with a prompt of several buttons. Modal waits for a response from one of the buttons or on closing.


  const result = await TW4MessageBox.Show({
    Title: "MessageBox Example 1",
    Content: "Click a button!",
    Buttons: [
      { Label: "Yes", Value: "Yes" },
      { Label: "No", Value: "No" },
      { Label: "Cancel", Value: "Cancel" }
    ]
  });

  TW4Dialog.Show({
    Title: "MessageBox Result",
    Content: result
  });

Example. PromptBox (Text Prompt)

Launch a modal with a text prompt. Modal waits for a response from the textbox.


  const result = await TW4PromptBox.Show({
    Title: "PromptBox Example 1",
    Content: "Enter text!",
    Placeholder: "Text me",
    Value: ""
  });

  TW4Dialog.Show({
    Title: "PromptBox Result",
    Content: JSON.stringify(result)
  });

Example. Close Modal

Close a modal using its identifier


TW4Dialog.Close("modalR1");

Example. Clear Modal

Close all modals


TW4Dialog.Clear();