Dialog
These functions are meant as a nicer alternative to the native alert, confirm and prompt functions.
They are not meant to be used as a replacement for more complex modals.
Functions
Verify
Example
Live demo
Code
<button type="button" class="btn blue-btn-soft-secondary" onclick="verifyUser()">Verify</button>
<script>
async function verifyUser() {
const yesOrNo = await blueWeb.dialog.verify("Do you want to continue?")
await blueWeb.dialog.tell(yesOrNo ? "You clicked yes" : "You clicked no")
}
</script> Tell
Example
Live demo
Code
<button type="button" class="btn blue-btn-soft-secondary" onclick="tellUser()">Tell</button>
<script>
async function tellUser() {
await blueWeb.dialog.tell("A message for you")
}
</script> Ask
Example
Live demo
Code
<button type="button" class="btn blue-btn-soft-secondary" onclick="askUser()">Ask</button>
<script>
async function askUser() {
const answer = await blueWeb.dialog.ask("What is the question?", {
title: "Question"
})
await blueWeb.dialog.tell("You asked: " + answer)
}
</script> Ask with default value
Example
Live demo
Code
<button type="button" class="btn blue-btn-soft-secondary" onclick="askUserWithDefaultValue()">Ask</button>
<script>
async function askUserWithDefaultValue() {
const answer = await blueWeb.dialog.ask(
"What is your name?",
`{"title":"Save Query","defaultValue":"DEFAULT LGK"}`
)
await blueWeb.dialog.tell("You asked: " + answer)
}
</script>