CODEWITHSUNDEEP
javascripthtmlsweetalert
bgmn
bgmn

Reputation: 508

Adding multiple variables to sweetalert content object

I am aware that it is possible to add HTML elements to the sweetalert alert box by using the content object. For example:

var link1 = document.createElement('a');
link1.innerHTML = 'How do I logout?';
swal({
    title: 'FAQ',
    content: link1
});

However, I was wondering if it was possible to add multiple variables to the content object e.g.

var link1 = document.createElement('a');
var link2 = document.createElement('a');
link1.innerHTML = 'How do I logout?';
link2.innerHTML = "How do I example?";
swal({
    title: 'FAQ',
    content: link1 + '\n' + link2 //NOTE: this doen't work but I hope this demostrates what I am asking
});

I want to do this so that I can create links which open different sweetalert alert boxes depending on which link is clicked.

Version of sweetalert:

<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>

Upvotes: 1

Views: 1376

Answers (1)

D. Pardal
D. Pardal

Reputation: 6597

Try crating a <div>, adding the elements into it and then passing the <div> to SweetAlert.

const link1 = document.createElement('a');
const link2 = document.createElement('a');
link1.innerHTML = 'How do I logout?';
link2.innerHTML = "How do I example?";

const container = document.createElement("div");
// You could also use container.innerHTML to set the content.
container.append(link1);
container.append(document.createElement("br"));
container.append(link2);

swal({
    title: 'FAQ',
    content: container
});

Upvotes: 2

Related Questions