Select2 : get selected value/text

Use data to retrieve the ID and Text of the selected option.

HTML

<script src="http://ivaynberg.github.com/select2/select2-master/select2.js"></script>
<link rel="stylesheet" href="http://ivaynberg.github.com/select2/select2-master/select2.css">
<input type="hidden" id="test" />
<!-- <p>Selected IDs: <span id="selectedID"></span></p>
<p>Selected Options: <span id="selectedText"></span></p> -->

CSS

p { margin: 1em 0; }
input[type="hidden"]{border:1px solid red;}

JavaScript

var test = $('#test');
$(test).select2({
      minimumInputLength: 3,
      placeholder: 'Search',
    data:[
        {id:0,text:"enhancement"},
        {id:1,text:"bug"},
        {id:2,text:"duplicate"},
        {id:3,text:"invalid"},
        {id:4,text:"wontfix"}
    ],
    width: "300px"
});

$(test).change(function() {
    //var theID = $(test).val(); // works
    //var theSelection = $(test).filter(':selected').text(); // doesn't work
    var theID = $(test).select2('data').id;
    var theSelection = $(test).select2('data').text;
    //$('#selectedID').text(theID);
   // $('#selectedText').text(theSelection);
});