How do I get select2 to work in IE8?

How Do I...
#1

I am having problems getting select2 to work in IE8.

I have multiple select drop downs and I am targeting them like:

$('select.form-control.select-dropdown').select2({
    placeholder: "Please select",
    allowHtml: true,
    closeOnSelect: true
});

Do I need to do anything special to get the selects to work in IE8?

#2

According to the Select2.org home page, they support IE8:

Support for both modern and legacy browsers is built-in, even including Internet Explorer 8.

Can you be more specific about the problem you’re having? Are there any messages in the JavaScript console?

#3

The error in the console is: undefined’ is null or not an object

#4

I have been trying to get select2 to work in IE8 for a while and unfortunately it won’t work. There are a few errors in the console:

Expected identifier, string or number on a test local install

It isn’t working out of the box and I cannot understand why?!

On my working project I get a different error:

undefined’ is null or not an object

Can anyone help?

#5

The console should show the file and line number where these errors occur. What are the lines of code where these errors happen?

Also, does your code work in other browsers? Other versions of IE? Chrome? Firefox?

Can you put your code on jsfiddle.net or codepen.io so I can see what’s happening?

#6

hi, i have the same problem, the select2 method/plugin doesn’t seem to be added to jquery object when used with ie 8, i’m pasting the code because with ie 8 a lot of https web site are broken (jsfiddle and codepen too)

<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.min.js"></script>
<script type="text/javascript">
    $(function() {
        $('#mySelect').select2();
    });
</script>
</head>
<body>
    <div>
        <select id="mySelect" name="mySelect">
            <option value="A">A</option>
            <option value="B">B</option>
            <option value="C">C</option>
        </select>
    </div>
</body>
</html>