John Indica John Indica - 1 month ago 14
jQuery Question

Code on JSFiddle not working in browser

i have this code in jsfiddle: https://jsfiddle.net/2ftk5c8z/402/

when i try it to the browser it does not work.

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
</head>
<body>
<select class="form-control select2-hidden-accessible" id="ListResort" multiple name="ListResort" tabindex="-1" aria-hidden="true"><option value="">Select Resort</option>
<optgroup label="Hotels &amp; Resorts">
<option value="Miramar by Pestana São Tomé">Miramar by Pestana São Tomé</option>
<option value="Pestana Alvor Atlantico">Pestana Alvor Atlantico</option>
<option value="Pestana Alvor Park">Pestana Alvor Park</option>
<option value="Pestana Alvor Park 2">Pestana Alvor Park 2</option>
<option value="Pestana Alvor Praia">Pestana Alvor Praia</option>
<option value="Pestana Alvor South Beach">Pestana Alvor South Beach</option>
<option value="Pestana Buenos Aires">Pestana Buenos Aires</option>
<option value="Pestana Caracas">Pestana Caracas</option>
<option value="Pestana Carlton Madeira">Pestana Carlton Madeira</option>
<option value="Pestana Casablanca">Pestana Casablanca</option>
<option value="Pestana Cascais">Pestana Cascais</option>
<option value="Pestana Casino Park">Pestana Casino Park</option>
<option value="Pestana Cayo Coco">Pestana Cayo Coco</option>
<option value="Pestana Chelsea Bridge Hotel">Pestana Chelsea Bridge Hotel</option>
</optgroup>
</select>

<script type="text/javascript">
$(function() {

$('#ListResort').select2();
$('#ListResort').select2().select2('val', ["Miramar by Pestana São Tomé", "Pestana Alvor Park 2"]).trigger("change");

});

</script>
</body>
</html>


what am i doing it wrong?

Thanks in advance

Answer

Check your includes / external resources.

On the fiddle, you include both 3.5.0 and 4.0.3, but in the question you only include 4.0.3.

If you change the local version to 3.5.0, it works fine:

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.0/select2.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.0/select2.min.css" rel="stylesheet" />