Dropdown appears in sweetalert 2 when initializing materialize dropdowns

Current behavior

A drop down menu appears in sweet alert 2 alerts when materialize is used and drop downs initialized. This occurs even if no input is specified for the alert.

Expected behavior

No dropdown to appear if it is not required as an input

Live demo

https://jsbin.com/peqatexaze/edit?html,js,output

You will notice the dropdown appear. Remove:

$(document).ready(function(){
    $('select').formSelect();
});

and the dropdown will no longer appear.

An issue has been opened with the creator here but he is unfamiliar with materialize so I thought an issue here may help solve this.

[leomoty]

The way Materialize works is, a <select> is replaced with a custom component (the select is actually still there but hidden) containing a <input> plus a dropdown. As seen here: https://github.com/Dogfalo/materialize/blob/v1-dev/js/select.js#L216

What you could do instead is restrict which <select>s gets the materialize treatment (adding a specific class, for example).

If you just wanna ignore this specific case, this should work:

$('select:not(.swal2-select)').formSelect();

Which will match any select but the one created by swal({...}).

Edit:

Updated your demo:

https://jsbin.com/pakiqad/1/edit?html,css,js,output

[erdrborges]

The way Materialize works is, a <select> is replaced with a custom component (the select is actually still there but hidden) containing a <input> plus a dropdown. As seen here: https://github.com/Dogfalo/materialize/blob/v1-dev/js/select.js#L216

What you could do instead is restrict which <select>s gets the materialize treatment (adding a specific class, for example).

If you just wanna ignore this specific case, this should work:

$('select:not(.swal2-select)').formSelect();

Which will match any select but the one created by swal({...}).

Edit:

Updated your demo:

https://jsbin.com/pakiqad/1/edit?html,css,js,output

I had the same problem described by @cheesemarathon, and this workaround works fine. Thanks for your explanation.