Sweetalert: Basic HTML example missing from docs

Created on 13 Feb 2018  路  6Comments  路  Source: t4t5/sweetalert

Now that the easy of inserting HTML into the alert has been changed the docs need to provide a simple example for people how simple want to format the content. I propose something like below

```
var content = document.createElement('div');
content.innerHTML = 'Some fields have errors.
Please check and try again.';

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

````

I propose @carloscfcortez's example below

Most helpful comment

It would be great if this could be incorporated into swal itself

    swal({
        title: 'Error',
        content: {
                element: 'div',
                innerHTML: 'Some fields have errors.<br/>Please check and try again.'
        }
        icon: "error",
    })

All 6 comments

It would be great if this could be incorporated into swal itself

    swal({
        title: 'Error',
        content: {
                element: 'div',
                innerHTML: 'Some fields have errors.<br/>Please check and try again.'
        }
        icon: "error",
    })

Agreed ! or multiple elements shoud be supported indeed

I agree. Had to find out how to use HTML in swal from this issue...

        swal({
            title: 'Error',
            content: {
                element: "div",
                attributes: {
                    innerHTML: "Some fields have <strong>errors.</strong><br/>Please check and try again."
                },
            },
            icon: "error",
        })

I was close 馃槤

Please also note in the docs that content and text is not the same thing, by the default the CSS class is different (swal-text vs swal-content) and so content and text differ visually.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

IvoPereira picture IvoPereira  路  14Comments

kspearrin picture kspearrin  路  22Comments

amiceli picture amiceli  路  19Comments

voviks21 picture voviks21  路  9Comments

softsaravanacse picture softsaravanacse  路  13Comments