Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.css">
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
  <meta charset="utf-8">
  <title>Select2</title>
  
</head>
<body>
<select class="js-example-data-array"></select>
 <br>
  <br>
  <br>
  <button id="fir">Select the first option</button>
  <button id="sec">Select the second one option</button>
</body>
</html>
 
$( document ).ready(function() {
  //fake ajax data
    var data = [{ id: 0, text: 'enhancement' }, { id: 1, text: 'bug' }, { id: 2, text: 'duplicate' }, { id: 3, text: 'invalid' }, { id: 4, text: 'wontfix' }];
 
//set select2  
$(".js-example-data-array").select2({
  data: data
});
  
  $("#fir").click(function(e){
    $(".js-example-data-array [value='0']").attr("selected","selected");
    $(".js-example-data-array").trigger("change");
  });
  
  $("#sec").click(function(e){
    $(".js-example-data-array [value='1']").attr("selected","selected");
    $(".js-example-data-array").trigger("change");
  });
 
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers