- ###### FILES

- Two new item submitted Marketing Manager
  17kb
- 52 Doc file Generator FontEnd Developer
  550kb
- 25 Xls File Uploaded Digital Marketing Manager
  20kb
- Anna Strong Web Designer
  37kb

- ###### MEMBERS

- John Doe UI designer
- Michal Clark FontEnd Developer
- Milena Gibson Digital Marketing
- Anna Strong Web Designer

- ###### PAGES

- error_outline No results found.

SweetAlert automatically centers itself on the page and looks great no matter if you're using a desktop computer, mobile or tablet. It's even highly customizeable, as you can see below!

#### A basic message

- View
- JS

      swal("Here's a message!")

#### A title with a text under

- View
- JS

      swal("Here's a message!", "It's pretty, isn't it?")

#### A Success Alert

- View
- JS

      swal({
        title: 'Success',
        icon: 'success'
      })

#### An Error Message

- View
- JS

      swal({
        title: 'Error',
        icon: 'error'
      })

#### A Info Alert

- View
- JS

    swal({
      title: 'Info',
      icon: 'info'
    })

#### An Warning Alert

- View
- JS

      swal({
        title: 'Warning',
        icon: 'warning'
      })

#### A success message with button!

- View
- JS

    swal("Good job!", "You clicked the button!", "success")

#### A Warning Alert with "Confirm" button

- View
- JS

      swal({
        title: "Are you sure?",
        text: "You will not be able to recover this imaginary file!",
        icon: 'warning',
        buttons: {
          cancel: true,
          delete: 'Yes, Delete It'
        }
      })

#### You can execute something else for "Cancel".

- View
- JS

      swal({
        title: "Are you sure?",
        text: "You will not be able to recover this imaginary file!",
        icon: 'warning',
        dangerMode: true,
        buttons: {
          cancel: 'No, Please!',
          delete: 'Yes, Delete It'
        }
      }).then(function (willDelete) {
        if (willDelete) {
          swal("Poof! Your imaginary file has been deleted!", {
            icon: "success",
          });
        } else {
          swal("Your imaginary file is safe", {
            title: 'Cancelled',
            icon: "error",
          });
        }
      });

#### A message with a custom icon

- View
- JS

      swal({
        title: "Sweet!",
        text: "Here's a custom image.",
        icon: '../../../app-assets/images/favicon/apple-touch-icon-152x152.png'
      });

#### An HTML message

- View
- JS

    var el = document.createElement('span'),
    t = document.createTextNode("Custom HTML Message!!");
    el.style.cssText = 'color:#F6BB42';
    el.appendChild(t);
    swal({
      title: 'HTML Alert!',
      content: {
        element: el,
      }
    });

#### A message with auto close timer

- View
- JS

      swal({
        title: "Auto close alert!",
        text: "I will close in 2 seconds.",
        timer: 2000,
        buttons: false
      });

#### A replacement for the "prompt" function

- View
- JS

    swal("Write something interesting:", {
    content: "input",
    })
    .then((value) => {
      if (value === false) return false;
      if (value === "") {
        swal("You need to write something!", "", "error");
        return false;
      }
      swal(`You typed: ${value}`);
    })

#### With a loader (for AJAX request for example)

- View
- JS

      swal({
        text: 'Search for a movie. e.g. "La La Land".',
        content: "input",
        button: {
          text: "Search!",
          closeModal: false,
        },
      })
        .then(name => {
          if (!name) throw null;

          return fetch(`https://itunes.apple.com/search?term=${name}&entity=movie`);
        })
        .then(results => {
          return results.json();
        })
        .then(json => {
          const movie = json.results[0];

          if (!movie) {
            return swal("No movie was found!");
          }

          const name = movie.trackName;
          const imageURL = movie.artworkUrl100;

          swal({
            title: "Top result:",
            text: name,
            icon: imageURL,
          });
        })
        .catch(err => {
          if (err) {
            swal("Oh noes!", "The AJAX request failed!", "error");
          } else {
            swal.stopLoading();
            swal.close();
          }
        });
    });

add

- help_outline
- widgets
- today
- mail_outline