diff --git a/index.html b/index.html
old mode 100755
new mode 100644
index 1632feca..55ba7716
--- a/index.html
+++ b/index.html
@@ -1,63 +1,64 @@
 ---
 layout: main
-title: Select2 3.2
+title: Select2 3.3
 group: navigation
-version: 3.2
+version: 3.3
 ---
 
-<link href="select2-3.2/select2.css" rel="stylesheet"/>
-<script src="select2-3.2/select2.js"></script>
+<link href="select2-3.3.0/select2.css" rel="stylesheet"/>
+<script src="select2-3.3.0/select2.js"></script>
 
 <script id="script_e1">
 
-    $(function() {
-        var opts=$("#source").html(), opts2="<option></option>"+opts;
-        $("select.populate").each(function() { var e=$(this); e.html(e.hasClass("placeholder")?opts2:opts); });
-        $(".examples article:odd").addClass("zebra");
-    });
+$(function() {
+   var opts=$("#source").html(), opts2="<option></option>"+opts;
+   $("select.populate").each(function() { var e=$(this); e.html(e.hasClass("placeholder")?opts2:opts); });
+   $(".examples article:odd").addClass("zebra");
+});
 
-    $(document).ready(function() {
-        $("#e1").select2();
-    });
+$(document).ready(function() {
+    $("#e1").select2();
+});
 </script>
 
 <script id="script_e3">
-    $(document).ready(function() {
-        $("#e3").select2({
-            minimumInputLength: 2
-        });
-    });
+$(document).ready(function() {
+$("#e3").select2({
+    minimumInputLength: 2
+});
+});
 </script>
 
 <script id="script_e4">
-    $(document).ready(function() {
-        function format(state) {
-            if (!state.id) return state.text; // optgroup
-            return "<img class='flag' src='images/flags/" + state.id.toLowerCase() + ".png'/>" + state.text;
-        }
-        $("#e4").select2({
-            formatResult: format,
-            formatSelection: format
-        });
-    });
+$(document).ready(function() {
+function format(state) {
+    if (!state.id) return state.text; // optgroup
+    return "<img class='flag' src='images/flags/" + state.id.toLowerCase() + ".png'/>" + state.text;
+}
+$("#e4").select2({
+    formatResult: format,
+    formatSelection: format,
+    escapeMarkup: function(m) { return m; }
+});
+});
 </script>
 
 
 <script id="script_e5">
-    $(document).ready(function() {
-        $("#e5").select2({
-            minimumInputLength: 1,
-            query: function (query) {
-                var data = {results: []}, i, j, s;
-                for (i = 1; i < 5; i++) {
-                    s = "";
-                    for (j = 0; j < i; j++) {s = s + query.term;}
-                    data.results.push({id: query.term + i, text: s});
-                }
-                query.callback(data);
-            }
-        });
-    });
+$(document).ready(function() {
+$("#e5").select2({
+    minimumInputLength: 1,
+    query: function (query) {
+        var data = {results: []}, i, j, s;
+        for (i = 1; i < 5; i++) {
+            s = "";
+            for (j = 0; j < i; j++) {s = s + query.term;}
+            data.results.push({id: query.term + i, text: s});
+        }
+        query.callback(data);
+    }
+});
+});
 </script>
 
 <script>
@@ -85,249 +86,262 @@ version: 3.2
 </script>
 
 <script id="script_e6">
-    $(document).ready(function() {
-        $("#e6").select2({
-            placeholder: "Search for a movie",
-            minimumInputLength: 1,
-            ajax: { // instead of writing the function to execute the request we use Select2's convenient helper
-                url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json",
-                dataType: 'jsonp',
-                data: function (term, page) {
-                    return {
-                        q: term, // search term
-                        page_limit: 10,
-                        apikey: "ju6z9mjyajq2djue3gbvv26t" // please do not use so this example keeps working
-                    };
-                },
-                results: function (data, page) { // parse the results into the format expected by Select2.
-                    // since we are using custom formatting functions we do not need to alter remote JSON data
-                    return {results: data.movies};
-                }
-            },
-            formatResult: movieFormatResult, // omitted for brevity, see the source of this page
-            formatSelection: movieFormatSelection,  // omitted for brevity, see the source of this page
-            dropdownCssClass: "bigdrop" // apply css that makes the dropdown taller
-        });
-    });
+$(document).ready(function() {
+$("#e6").select2({
+    placeholder: "Search for a movie",
+    minimumInputLength: 1,
+    ajax: { // instead of writing the function to execute the request we use Select2's convenient helper
+        url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json",
+        dataType: 'jsonp',
+        data: function (term, page) {
+            return {
+                q: term, // search term
+                page_limit: 10,
+                apikey: "ju6z9mjyajq2djue3gbvv26t" // please do not use so this example keeps working
+            };
+        },
+        results: function (data, page) { // parse the results into the format expected by Select2.
+            // since we are using custom formatting functions we do not need to alter remote JSON data
+            return {results: data.movies};
+        }
+    },
+    formatResult: movieFormatResult, // omitted for brevity, see the source of this page
+    formatSelection: movieFormatSelection,  // omitted for brevity, see the source of this page
+    dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
+    escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
+});
+});
 </script>
 
 <script id="script_e7">
-    $(document).ready(function() {
-        $("#e7").select2({
-            placeholder: "Search for a movie",
-            minimumInputLength: 3,
-            ajax: {
-                url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json",
-                dataType: 'jsonp',
-                quietMillis: 100,
-                data: function (term, page) { // page is the one-based page number tracked by Select2
-                    return {
-                        q: term, //search term
-                        page_limit: 10, // page size
-                        page: page, // page number
-                        apikey: "ju6z9mjyajq2djue3gbvv26t" // please do not use so this example keeps working
-                    };
-                },
-                results: function (data, page) {
-                    var more = (page * 10) < data.total; // whether or not there are more results available
+$(document).ready(function() {
+$("#e7").select2({
+    placeholder: "Search for a movie",
+    minimumInputLength: 3,
+    ajax: {
+        url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json",
+        dataType: 'jsonp',
+        quietMillis: 100,
+        data: function (term, page) { // page is the one-based page number tracked by Select2
+            return {
+                q: term, //search term
+                page_limit: 10, // page size
+                page: page, // page number
+                apikey: "ju6z9mjyajq2djue3gbvv26t" // please do not use so this example keeps working
+            };
+        },
+        results: function (data, page) {
+            var more = (page * 10) < data.total; // whether or not there are more results available
 
-                    // notice we return the value of more so Select2 knows if more results can be loaded
-                    return {results: data.movies, more: more};
-                }
-            },
-            formatResult: movieFormatResult, // omitted for brevity, see the source of this page
-            formatSelection: movieFormatSelection, // omitted for brevity, see the source of this page
-            dropdownCssClass: "bigdrop" // apply css that makes the dropdown taller
-        });
-    });
+            // notice we return the value of more so Select2 knows if more results can be loaded
+            return {results: data.movies, more: more};
+        }
+    },
+    formatResult: movieFormatResult, // omitted for brevity, see the source of this page
+    formatSelection: movieFormatSelection, // omitted for brevity, see the source of this page
+    dropdownCssClass: "bigdrop", // apply css that makes the dropdown taller
+    escapeMarkup: function (m) { return m; } // we do not want to escape markup since we are displaying html in results
+});
+});
 </script>
 
 <script id="script_e9">
-    $(document).ready(function() {
-        $("#e9").select2();
-    });
+$(document).ready(function() {
+$("#e9").select2();
+});
 </script>
 
 <script id="script_e10">
-    $(document).ready(function() {
+$(document).ready(function() {
 
-        $("#e10").select2({
-            data:[{id:0,text:'enhancement'},{id:1,text:'bug'},{id:2,text:'duplicate'},{id:3,text:'invalid'},{id:4,text:'wontfix'}]
-        });
+$("#e10").select2({
+    data:[{id:0,text:'enhancement'},{id:1,text:'bug'},{id:2,text:'duplicate'},{id:3,text:'invalid'},{id:4,text:'wontfix'}]
+});
 
-        var data=[{id:0,tag:'enhancement'},{id:1,tag:'bug'},{id:2,tag:'duplicate'},{id:3,tag:'invalid'},{id:4,tag:'wontfix'}];
-        function format(item) { return item.tag; };
+var data=[{id:0,tag:'enhancement'},{id:1,tag:'bug'},{id:2,tag:'duplicate'},{id:3,tag:'invalid'},{id:4,tag:'wontfix'}];
+function format(item) { return item.tag; };
 
-        $("#e10_2").select2({
-            data:{ results: data, text: 'tag' },
-            formatSelection: format,
-            formatResult: format
-        });
+$("#e10_2").select2({
+    data:{ results: data, text: 'tag' },
+    formatSelection: format,
+    formatResult: format
+});
 
-        $("#e10_3").select2({
-            data:{ results: data, text: function(item) { console.log('called with', item); return item.tag; } },
-            formatSelection: format,
-            formatResult: format
-        });
+$("#e10_3").select2({
+    data:{ results: data, text: function(item) { console.log('called with', item); return item.tag; } },
+    formatSelection: format,
+    formatResult: format
+});
 
-    });
+});
 </script>
 
+      <div class="row">
+          <div class="span12">
+              <div class="alert alert-block alert-error">
+                  <h4 class="alert-heading">Warning!</h4>
+                  This page refers to an unreleased <em>{{ page.version }}</em> version of Select2 which may be unstable. For the latest stable
+                  and previous versions please see links at the top. The code for this version is only available in the <a
+                      href="https://github.com/ivaynberg/select2">master branch.</a>
+              </div>
+          </div>
+      </div>
 
-<header class="jumbotron subhead">
-    <div class="subnav">
-        <ul class="nav nav-pills">
-            <li><a href="#changelog">Changelog</a></li>
-            <li class="dropdown">
-                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Examples <b class="caret"></b></a>
-                <ul class="dropdown-menu">
-                    <li><a href="#basics">Basics</a></li>
-                    <li><a href="#multi">Multi-Value</a></li>
-                    <li><a href="#placeholders">Placeholders</a></li>
-                    <li><a href="#minimum">Minimum Input Length</a></li>
-                    <li><a href="#templating">Templating</a></li>
-                    <li><a href="#data">Loading Data</a></li>
-                    <li><a href="#data_array">Array Data</a></li>
-                    <li><a href="#ajax">Remote/AJAX Data</a></li>
-                    <li><a href="#infinite">Infinite Scrolling of Remote/AJAX data</a></li>
-                    <li><a href="#tags">Tagging Support</a></li>
-                    <li><a href="#maximum">Maximum Input Length</a></li>
-                    <li><a href="#programmatic">Programmatic control</a></li>
-                    <li><a href="#events">Events</a></li>
-                    <li><a href="#event_ext_change">Events: Reacting to External Changes</a></li>
-                    <li><a href="#disabled">Disabled Mode</a></li>
-                    <li><a href="#matcher">Custom Matcher Function</a></li>
-                    <li><a href="#responsive">Responsive Design</a></li>
-                </ul>
+
+      <header class="jumbotron subhead">
+        <div class="subnav">
+          <ul class="nav nav-pills">
+              <li><a href="#changelog">Changelog</a></li>
+              <li class="dropdown">
+              <a class="dropdown-toggle" data-toggle="dropdown" href="#">Examples <b class="caret"></b></a>
+              <ul class="dropdown-menu">
+                  <li><a href="#basics">Basics</a></li>
+                  <li><a href="#multi">Multi-Value</a></li>
+                  <li><a href="#placeholders">Placeholders</a></li>
+                  <li><a href="#minimum">Minimum Input Length</a></li>
+                  <li><a href="#templating">Templating</a></li>
+                  <li><a href="#data">Loading Data</a></li>
+                  <li><a href="#data_array">Array Data</a></li>
+                  <li><a href="#ajax">Remote/AJAX Data</a></li>
+                  <li><a href="#infinite">Infinite Scrolling of Remote/AJAX data</a></li>
+                  <li><a href="#tags">Tagging Support</a></li>
+                  <li><a href="#programmatic">Programmatic control</a></li>
+                  <li><a href="#events">Events</a></li>
+                  <li><a href="#event_ext_change">Events: Reacting to External Changes</a></li>
+                  <li><a href="#disabled">Disabled Mode</a></li>
+                  <li><a href="#matcher">Custom Matcher Function</a></li>
+                  <li><a href="#sort_results">Sorting Displayed Results</a></li>
+                  <li><a href="#responsive">Responsive Design</a></li>
+              </ul>
             </li>
             <li><a href="#documentation">Documentation</a></li>
             <li><a href="#about">About</a></li>
-        </ul>
-    </div>
-</header>
+          </ul>
+        </div>
+      </header>
 
 
-<section id="changelog">
-    <h2>Changelog</h2>
-    <div class="row"><div class="span12">
-        <ul>
-            <li>Loading...</li>
-            <script>
-                $(function() {
-                    var url="https://api.github.com/repos/ivaynberg/select2/issues?state=closed&milestone=6";
-                    $.ajax({
-                        url: url,
-                        dataType: "jsonp"
-                    }).done(function(issues) {
+        <section id="changelog">
+            <h2>Changelog</h2>
+            <div class="row"><div class="span12">
+                <ul>
+                    <li>Loading...</li>
+                    <script>
+                        $(function() {
+                            var url="https://api.github.com/repos/ivaynberg/select2/issues?state=closed&milestone=7";
+                            $.ajax({
+                                url: url,
+                                dataType: "jsonp"
+                            }).done(function(issues) {
                                 var list=$("#changelog ul");
                                 var template="<li><a href='$url'><span>#$num</span> </a>$title</li>";
                                 list.empty();
                                 $.each(issues.data, function() {
                                     var markup=template
-                                            .replace(/\$url/g, this.html_url)
-                                            .replace(/\$num/g, this.number)
-                                            .replace(/\$title/g, this.title)
+                                        .replace(/\$url/g, this.html_url)
+                                        .replace(/\$num/g, this.number)
+                                        .replace(/\$title/g, this.title)
                                     list.append(markup);
                                 });
                             }).fail(function() {
                                 $("#changelog ul").empty().append("<li class='alert alert-error'>Error retrieving changelog</li>");
                             });
-                });
-            </script>
-        </ul>
-    </div></div>
-</section>
+                        });
+                    </script>
+                </ul>
+            </div></div>
+        </section>
 
-<section>
-    <h2>Browser Compatibility</h2>
-    <ul>
-        <li>IE 7+</li>
-        <li>Chrome 8+</li>
-        <li>Firefox 3.5+</li>
-        <li>Safari 3+</li>
-        <li>Opera 10.6+</li>
-    </ul>
-</section>
+        <section>
+            <h2>Browser Compatibility</h2>
+            <ul>
+                <li>IE 7+</li>
+                <li>Chrome 8+</li>
+                <li>Firefox 3.5+</li>
+                <li>Safari 3+</li>
+                <li>Opera 10.6+</li>
+            </ul>
+        </section>
 
-<section class="examples">
-<div class="row">
-    <div class="span12">
-        <h2>Examples</h2>
-        <hr/>
-    </div>
-</div>
+      <section class="examples">
+      <div class="row">
+          <div class="span12">
+              <h2>Examples</h2>
+              <hr/>
+          </div>
+      </div>
 
 
-<article class="row" id="basics">
-    <div class="span4">
-        <h3>The Basics</h3>
-        <p>Select2 can take a regular select box like this:</p>
-        <p><select style="width:300px" id="source">
-            <optgroup label="Alaskan/Hawaiian Time Zone">
-                <option value="AK">Alaska</option>
-                <option value="HI">Hawaii</option>
-            </optgroup>
-            <optgroup label="Pacific Time Zone">
-                <option value="CA">California</option>
-                <option value="NV">Nevada</option>
-                <option value="OR">Oregon</option>
-                <option value="WA">Washington</option>
-            </optgroup>
-            <optgroup label="Mountain Time Zone">
-                <option value="AZ">Arizona</option>
-                <option value="CO">Colorado</option>
-                <option value="ID">Idaho</option>
-                <option value="MT">Montana</option><option value="NE">Nebraska</option>
-                <option value="NM">New Mexico</option>
-                <option value="ND">North Dakota</option>
-                <option value="UT">Utah</option>
-                <option value="WY">Wyoming</option>
-            </optgroup>
-            <optgroup label="Central Time Zone">
-                <option value="AL">Alabama</option>
-                <option value="AR">Arkansas</option>
-                <option value="IL">Illinois</option>
-                <option value="IA">Iowa</option>
-                <option value="KS">Kansas</option>
-                <option value="KY">Kentucky</option>
-                <option value="LA">Louisiana</option>
-                <option value="MN">Minnesota</option>
-                <option value="MS">Mississippi</option>
-                <option value="MO">Missouri</option>
-                <option value="OK">Oklahoma</option>
-                <option value="SD">South Dakota</option>
-                <option value="TX">Texas</option>
-                <option value="TN">Tennessee</option>
-                <option value="WI">Wisconsin</option>
-            </optgroup>
-            <optgroup label="Eastern Time Zone">
-                <option value="CT">Connecticut</option>
-                <option value="DE">Delaware</option>
-                <option value="FL">Florida</option>
-                <option value="GA">Georgia</option>
-                <option value="IN">Indiana</option>
-                <option value="ME">Maine</option>
-                <option value="MD">Maryland</option>
-                <option value="MA">Massachusetts</option>
-                <option value="MI">Michigan</option>
-                <option value="NH">New Hampshire</option><option value="NJ">New Jersey</option>
-                <option value="NY">New York</option>
-                <option value="NC">North Carolina</option>
-                <option value="OH">Ohio</option>
-                <option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option>
-                <option value="VT">Vermont</option><option value="VA">Virginia</option>
-                <option value="WV">West Virginia</option>
-            </optgroup>
-        </select>
-        </p>
-        <p>and turns it into:</p>
-        <p>
-            <select id="e1" class="populate" style="width:300px"></select>
-        </p>
-        <p>with support for quick option filtering via a search box</p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+      <article class="row" id="basics">
+        <div class="span4">
+          <h3>The Basics</h3>
+           <p>Select2 can take a regular select box like this:</p>
+           <p><select style="width:300px" id="source">
+               <optgroup label="Alaskan/Hawaiian Time Zone">
+                   <option value="AK">Alaska</option>
+                   <option value="HI">Hawaii</option>
+               </optgroup>
+               <optgroup label="Pacific Time Zone">
+                   <option value="CA">California</option>
+                   <option value="NV">Nevada</option>
+                   <option value="OR">Oregon</option>
+                   <option value="WA">Washington</option>
+               </optgroup>
+               <optgroup label="Mountain Time Zone">
+                   <option value="AZ">Arizona</option>
+                   <option value="CO">Colorado</option>
+                   <option value="ID">Idaho</option>
+                   <option value="MT">Montana</option><option value="NE">Nebraska</option>
+                   <option value="NM">New Mexico</option>
+                   <option value="ND">North Dakota</option>
+                   <option value="UT">Utah</option>
+                   <option value="WY">Wyoming</option>
+               </optgroup>
+               <optgroup label="Central Time Zone">
+                   <option value="AL">Alabama</option>
+                   <option value="AR">Arkansas</option>
+                   <option value="IL">Illinois</option>
+                   <option value="IA">Iowa</option>
+                   <option value="KS">Kansas</option>
+                   <option value="KY">Kentucky</option>
+                   <option value="LA">Louisiana</option>
+                   <option value="MN">Minnesota</option>
+                   <option value="MS">Mississippi</option>
+                   <option value="MO">Missouri</option>
+                   <option value="OK">Oklahoma</option>
+                   <option value="SD">South Dakota</option>
+                   <option value="TX">Texas</option>
+                   <option value="TN">Tennessee</option>
+                   <option value="WI">Wisconsin</option>
+               </optgroup>
+               <optgroup label="Eastern Time Zone">
+                   <option value="CT">Connecticut</option>
+                   <option value="DE">Delaware</option>
+                   <option value="FL">Florida</option>
+                   <option value="GA">Georgia</option>
+                   <option value="IN">Indiana</option>
+                   <option value="ME">Maine</option>
+                   <option value="MD">Maryland</option>
+                   <option value="MA">Massachusetts</option>
+                   <option value="MI">Michigan</option>
+                   <option value="NH">New Hampshire</option><option value="NJ">New Jersey</option>
+                   <option value="NY">New York</option>
+                   <option value="NC">North Carolina</option>
+                   <option value="OH">Ohio</option>
+                   <option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option>
+                   <option value="VT">Vermont</option><option value="VA">Virginia</option>
+                   <option value="WV">West Virginia</option>
+               </optgroup>
+              </select>
+         </p>
+           <p>and turns it into:</p>
+           <p>
+               <select id="e1" class="populate" style="width:300px"></select>
+           </p>
+           <p>with support for quick option filtering via a search box</p>
+        </div>
+        <div class="span8">
+          <h3>Example Code</h3>
 <pre class="prettyprint linenums" id="code_e1">
 &lt;head&gt;
     &lt;link href=&quot;select2.css&quot; rel=&quot;stylesheet&quot;/&gt;
@@ -344,85 +358,85 @@ version: 3.2
     &lt;/select&gt;
 &lt;/body&gt;
 </pre>
-    </div>
-</article>
+       </div>
+      </article>
 
-<article class="row" id="multi">
-    <div class="span4">
-        <h3>Multi-Value Select Boxes</h3>
-        <p>Select2 also supports multi-value select boxes. The <code>select</code> below is declared with the <code>multiple</code> attribute. Select2 automatially picks up on this:</p>
-        <p>
-            <select multiple name="e9" id="e9" style="width:300px" class="populate"></select>
-        </p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+      <article class="row" id="multi">
+        <div class="span4">
+          <h3>Multi-Value Select Boxes</h3>
+           <p>Select2 also supports multi-value select boxes. The <code>select</code> below is declared with the <code>multiple</code> attribute. Select2 automatially picks up on this:</p>
+           <p>
+               <select multiple name="e9" id="e9" style="width:300px" class="populate"></select>
+           </p>
+        </div>
+        <div class="span8">
+          <h3>Example Code</h3>
           <pre class="prettyprint linenums" id="code_e9">
           </pre>
-    </div>
-</article>
+       </div>
+      </article>
 
 
-<article class="row" id="placeholders">
-    <script id="script_e2">
-        $(document).ready(function() {
-            $("#e2").select2({
-                placeholder: "Select a State",
-                allowClear: true
+        <article class="row" id="placeholders">
+          <script id="script_e2">
+            $(document).ready(function() {
+$("#e2").select2({
+    placeholder: "Select a State",
+    allowClear: true
+});
+$("#e2_2").select2({
+    placeholder: "Select a State"
+});
             });
-            $("#e2_2").select2({
-                placeholder: "Select a State"
-            });
-        });
-    </script>
-    <div class="span4">
-        <h3>Placeholders</h3>
-        <p>A placeholder value can be defined and will be displayed until a selection is made:</p>
-        <p>
-            <select id="e2" style="width:300px" class="populate placeholder"></select><br/>
-        </p>
-        <p>
-            <select id="e2_2" multiple="multiple" style="width:300px" class="populate placeholder"></select><br/>
-        </p>
-        <p>The placeholder can be declared via a <code>data-placeholder</code> attribute attached to the <code>select</code>, or via the <code>placeholder</code> configuration element as seen in the example code</p>
-        <p>Optionally, a clear button (visible once a selection is made) is available to reset the select box back to the placeholder value.</p>
+          </script>
+          <div class="span4">
+            <h3>Placeholders</h3>
+             <p>A placeholder value can be defined and will be displayed until a selection is made:</p>
+             <p>
+                 <select id="e2" style="width:300px" class="populate placeholder"></select><br/>
+             </p>
+              <p>
+                  <select id="e2_2" multiple="multiple" style="width:300px" class="populate placeholder"></select><br/>
+              </p>
+             <p>The placeholder can be declared via a <code>data-placeholder</code> attribute attached to the <code>select</code>, or via the <code>placeholder</code> configuration element as seen in the example code</p>
+              <p>Optionally, a clear button (visible once a selection is made) is available to reset the select box back to the placeholder value.</p>
 
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+          </div>
+          <div class="span8">
+            <h3>Example Code</h3>
             <pre class="prettyprint linenums" id="code_e2">
             </pre>
-    </div>
-</article>
+         </div>
+        </article>
 
-<article class="row" id="minimum">
-    <div class="span4">
-        <h3>Minimum Input</h3>
-        <p>Select2 supports a minimum input setting which is useful for large remote datasets where short search terms are not very useful:</p>
-        <p>
-            <select id="e3" style="width:300px" class="populate"></select><br/>
-        </p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
-        <pre class="prettyprint linenums" id="code_e3"></pre>
-    </div>
-</article>
+        <article class="row" id="minimum">
+          <div class="span4">
+            <h3>Minimum Input</h3>
+             <p>Select2 supports a minimum input setting which is useful for large remote datasets where short search terms are not very useful:</p>
+             <p>
+                 <select id="e3" style="width:300px" class="populate"></select><br/>
+             </p>
+          </div>
+          <div class="span8">
+            <h3>Example Code</h3>
+            <pre class="prettyprint linenums" id="code_e3"></pre>
+         </div>
+        </article>
 
-<article class="row" id="templating">
-    <div class="span4">
-        <h3>Templating</h3>
-        <p>Various display options of the Select2 component can be changed:</p>
-        <p>
-            <select id="e4" style="width:300px" class="populate"></select><br/>
-        </p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
-        <pre class="prettyprint linenums" id="code_e4"></pre>
-        <p>
-            You can set <code>data-</code> attributes to <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) and use them inside temptlating functions:
-        </p>
+        <article class="row" id="templating">
+          <div class="span4">
+            <h3>Templating</h3>
+             <p>Various display options of the Select2 component can be changed:</p>
+             <p>
+                 <select id="e4" style="width:300px" class="populate"></select><br/>
+             </p>
+          </div>
+          <div class="span8">
+            <h3>Example Code</h3>
+            <pre class="prettyprint linenums" id="code_e4"></pre>
+            <p>
+                You can set <code>data-</code> attributes to <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) and use them inside temptlating functions:
+            </p>
             <pre class="prettyprint linenums">
 &lt;select&gt;
     &lt;option value="0" data-foo="bar"&gt;option one&lt;/option&gt;
@@ -436,713 +450,801 @@ function format(state) {
     return "&lt;img class='flag' src='images/flags/" + state.id.toLowerCase() + ".png' alt='" + $(originalOption).data('foo') + "' /&gt;" + state.text;
 }
             </pre>
-    </div>
-</article>
+         </div>
+        </article>
 
-<article class="row" id="data">
-    <div class="span4">
-        <h3>Loading Data</h3>
-        <p>Select2 uses a function to load result data. Here is a trivial example that creates choices that consist of user's input repeated a number of times:</p>
-        <p>
-            <input type="hidden" id="e5" style="width:300px"/>
-        </p>
-        <p>In order to take advantage of custom data loading Select2 should be attached to an <code>input type='hidden'</code> tag, otherwise data is parsed from <code>select</code>'s <code>option</code> tags.</code></p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+       <article class="row" id="data">
+          <div class="span4">
+            <h3>Loading Data</h3>
+             <p>Select2 uses a function to load result data. Here is a trivial example that creates choices that consist of user's input repeated a number of times:</p>
+             <p>
+                 <input type="hidden" id="e5" style="width:300px"/>
+             </p>
+             <p>In order to take advantage of custom data loading Select2 should be attached to an <code>input type='hidden'</code> tag, otherwise data is parsed from <code>select</code>'s <code>option</code> tags.</code></p>
+          </div>
+          <div class="span8">
+            <h3>Example Code</h3>
             <pre class="prettyprint linenums" id="code_e5">
             </pre>
-    </div>
-</article>
+         </div>
+        </article>
 
 
 <script id="script_e19">
-    $(document).ready(function() {
-        $("#e19").select2({ maximumSelectionSize: 3 });
-    });
+$(document).ready(function() {
+$("#e19").select2({ maximumSelectionSize: 3 });
+});
 </script>
-<article class="row" id="maximumSelectionSize">
-    <div class="span4">
-        <h3>Maximum Selection Size</h3>
-        <p>Select2 allows the developer to limit the number of items that can be selected in a multi-select control.
-            In the example below only 3 or less items can be selected.</p>
-        <p>
-            <select multiple class="populate" id="e19" style="width:300px"></select>
-        </p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+      <article class="row" id="maximumSelectionSize">
+          <div class="span4">
+              <h3>Maximum Selection Size</h3>
+              <p>Select2 allows the developer to limit the number of items that can be selected in a multi-select control.
+              In the example below only 3 or less items can be selected.</p>
+              <p>
+                  <select multiple class="populate" id="e19" style="width:300px"></select>
+              </p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
             <pre class="prettyprint linenums" id="code_e19">
             </pre>
-    </div>
-</article>
+          </div>
+      </article>
 
-<article class="row" id="data_array">
-    <div class="span4">
-        <h3>Loading Array Data</h3>
-        <p>Select2 provides some shortcuts that make it easy to access local data stored in an array instead of having to write a <code>query</code> function mentioned in the example above.</p>
-        <p>Example below inlines the data by specifying an array in the <code>data</code> element. Items in such an array must have <code>id</code> and <code>text</code> keys.</p>
-        <p>
-            <input type="hidden" id="e10" style="width:300px"/>
-        </p>
-        <p>If your data does not have a <code>text</code> key, an alternative key can be specified as a string:</p>
-        <p>
-            <input type="hidden" id="e10_2" style="width:300px"/>
-        </p>
-        <p>or as a function:</p>
-        <p>
-            <input type="hidden" id="e10_3" style="width:300px"/>
-        </p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+      <article class="row" id="data_array">
+         <div class="span4">
+           <h3>Loading Array Data</h3>
+            <p>Select2 provides some shortcuts that make it easy to access local data stored in an array instead of having to write a <code>query</code> function mentioned in the example above.</p>
+            <p>Example below inlines the data by specifying an array in the <code>data</code> element. Items in such an array must have <code>id</code> and <code>text</code> keys.</p>
+            <p>
+                <input type="hidden" id="e10" style="width:300px"/>
+            </p>
+            <p>If your data does not have a <code>text</code> key, an alternative key can be specified as a string:</p>
+             <p>
+                 <input type="hidden" id="e10_2" style="width:300px"/>
+             </p>
+             <p>or as a function:</p>
+             <p>
+                 <input type="hidden" id="e10_3" style="width:300px"/>
+             </p>
+         </div>
+         <div class="span8">
+           <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e10">
            </pre>
-    </div>
-</article>
+        </div>
+       </article>
 
-<article class="row" id="ajax">
-    <div class="span12">
-        <h3>Loading Remote Data</h3>
-        <p>Select2 comes with AJAX/JSONP support built in. In this example we will search for a movie using Rotten Tomatoes API:</p>
-        <p>
-            <input type="hidden" class="bigdrop" id="e6" style="width:600px"/>
-        </p>
-        <p class="alert alert-warning">If this example does not work it is probably because the Rotten Tomatoes API key usage of 10000 requests per day has been exhausted. Please try again tomorrow.</p>
-        <h3>Example Code</h3>
-        <pre class="prettyprint linenums" id="code_e6"></pre>
-        <p>Select2 uses jQuery's <code>$.ajax</code> function to execute the remote call by default. An alternative <code>transport</code> function can be specified in the ajax settings, or an entirely custom implementation can be built by providing a custom <code>query</code> function instead of using the <code>ajax</code> helper</p>
-    </div>
-</article>
-<article class="row" id="infinite">
-    <div class="span12">
-        <h3>Infinite Scroll with Remote Data</h3>
-        <p>Select2 supports lazy-appending of results when the result list is scrolled to the end.
-            In order to enable the remote service must support some sort of a paging mechanism and
-            the query function given to Select2 must take advantage of it. The following example demonstrates
-            how this can be set up. Search for some keyword and then scroll the result list to the end to
-            see more results load:</p>
-        <p>
-            <input type="hidden" class="bigdrop" id="e7" style="width:600px"/>
-        </p>
-        <p class="alert alert-warning">If this example does not work it is probably because the Rotten Tomatoes API key usage of 10000 requests per day has been exhausted. Please try again tomorrow.</p>
-        <h3>Example Code</h3>
-        <pre class="prettyprint linenums" id="code_e7"></pre>
-    </div>
-</article>
+        <article class="row" id="ajax">
+           <div class="span12">
+             <h3>Loading Remote Data</h3>
+              <p>Select2 comes with AJAX/JSONP support built in. In this example we will search for a movie using Rotten Tomatoes API:</p>
+              <p>
+                  <input type="hidden" class="bigdrop" id="e6" style="width:600px"/>
+              </p>
+               <p class="alert alert-warning">If this example does not work it is probably because the Rotten Tomatoes API key usage of 10000 requests per day has been exhausted. Please try again tomorrow.</p>
+               <h3>Example Code</h3>
+              <pre class="prettyprint linenums" id="code_e6"></pre>
+              <p>Select2 uses jQuery's <code>$.ajax</code> function to execute the remote call by default. An alternative <code>transport</code> function can be specified in the ajax settings, or an entirely custom implementation can be built by providing a custom <code>query</code> function instead of using the <code>ajax</code> helper</p>
+           </div>
+        </article>
+        <article class="row" id="infinite">
+            <div class="span12">
+              <h3>Infinite Scroll with Remote Data</h3>
+               <p>Select2 supports lazy-appending of results when the result list is scrolled to the end.
+                   In order to enable the remote service must support some sort of a paging mechanism and
+                   the query function given to Select2 must take advantage of it. The following example demonstrates
+                   how this can be set up. Search for some keyword and then scroll the result list to the end to
+                   see more results load:</p>
+               <p>
+                   <input type="hidden" class="bigdrop" id="e7" style="width:600px"/>
+               </p>
+                <p class="alert alert-warning">If this example does not work it is probably because the Rotten Tomatoes API key usage of 10000 requests per day has been exhausted. Please try again tomorrow.</p>
+                <h3>Example Code</h3>
+              <pre class="prettyprint linenums" id="code_e7"></pre>
+            </div>
+         </article>
 
-<article class="row" id="programmatic">
-    <script id="script_e8">
-        $(document).ready(function() {
-            $("#e8").select2();
-            $("#e8_get").click(function () { alert("Selected value is: "+$("#e8").select2("val"));});
-            $("#e8_set").click(function () { $("#e8").select2("val", "CA"); });
-            $("#e8_cl").click(function() { $("#e8").select2("val", ""); });
-            $("#e8_get2").click(function () { alert("Selected data is: "+JSON.stringify($("#e8").select2("data")));});
-            $("#e8_set2").click(function () { $("#e8").select2("data", {id: "CA", text: "California"}); });
-            $("#e8_open").click(function () { $("#e8").select2("open"); });
-            $("#e8_close").click(function () { $("#e8").select2("close"); });
-            $("#e8_2").select2();
-            $("#e8_2_get").click(function () { alert("Selected value is: "+$("#e8_2").select2("val"));});
-            $("#e8_2_set").click(function () { $("#e8_2").select2("val", ["CA","MA"]); });
-            $("#e8_2_get2").click(function () { alert("Selected value is: "+JSON.stringify($("#e8_2").select2("data")));});
-            $("#e8_2_set2").click(function () { $("#e8_2").select2("data", [{id: "CA", text: "California"},{id:"MA", text: "Massachusetts"}]); });
-            $("#e8_2_cl").click(function() { $("#e8_2").select2("val", ""); });
-            $("#e8_2_open").click(function () { $("#e8_2").select2("open"); });
-            $("#e8_2_close").click(function () { $("#e8_2").select2("close"); });
-        });
-    </script>
-    <div class="span4">
-        <h3>Programmatic Access</h3>
-        <p>Select2 supports methods that allow programmatic control of the component</p>
-        <p>
-            <input type="button" class="btn-primary" id="e8_get" value="Alert selected value"/>
-            <input type="button" class="btn-info" id="e8_set" value="Set to California"/>
-            <input type="button" class="btn-info" id="e8_cl" value="Clear"/>
-            <input type="button" class="btn-primary" id="e8_get2" value="Alert selected using data"/>
-            <input type="button" class="btn-info" id="e8_set2" value="Set to California using data"/>
-            <input type="button" class="btn-warning" id="e8_open" value="Open"/>
-            <input type="button" class="btn-warning" id="e8_close" value="Close"/>
-        </p>
-        <p>
-            <select id="e8" style="width:300px" class="populate"></select><br/>
-        </p>
-        <p>
-            <input type="button" class="btn-primary" id="e8_2_get" value="Alert selected value"/>
-            <input type="button" class="btn-info" id="e8_2_set" value="Set to California and Massachusetts"/>
-            <input type="button" class="btn-primary" id="e8_2_get2" value="Alert selected value using data"/>
-            <input type="button" class="btn-info" id="e8_2_set2" value="Set to California and Massachusetts using data"/>
-            <input type="button" class="btn-info" id="e8_2_cl" value="Clear"/>
-            <input type="button" class="btn-warning" id="e8_2_open" value="Open"/>
-            <input type="button" class="btn-warning" id="e8_2_close" value="Close"/>
-        </p>
-        <p>
-            <select id="e8_2" multiple style="width:300px" class="populate"></select><br/>
-        </p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
-        <pre class="prettyprint linenums" id="code_e8"></pre>
-    </div>
-</article>
+        <article class="row" id="programmatic">
+<script id="script_e8">
+$(document).ready(function() {
+$("#e8").select2();
+$("#e8_get").click(function () { alert("Selected value is: "+$("#e8").select2("val"));});
+$("#e8_set").click(function () { $("#e8").select2("val", "CA"); });
+$("#e8_cl").click(function() { $("#e8").select2("val", ""); });
+$("#e8_get2").click(function () { alert("Selected data is: "+JSON.stringify($("#e8").select2("data")));});
+$("#e8_set2").click(function () { $("#e8").select2("data", {id: "CA", text: "California"}); });
+$("#e8_open").click(function () { $("#e8").select2("open"); });
+$("#e8_close").click(function () { $("#e8").select2("close"); });
+$("#e8_2").select2();
+$("#e8_2_get").click(function () { alert("Selected value is: "+$("#e8_2").select2("val"));});
+$("#e8_2_set").click(function () { $("#e8_2").select2("val", ["CA","MA"]); });
+$("#e8_2_get2").click(function () { alert("Selected value is: "+JSON.stringify($("#e8_2").select2("data")));});
+$("#e8_2_set2").click(function () { $("#e8_2").select2("data", [{id: "CA", text: "California"},{id:"MA", text: "Massachusetts"}]); });
+$("#e8_2_cl").click(function() { $("#e8_2").select2("val", ""); });
+$("#e8_2_open").click(function () { $("#e8_2").select2("open"); });
+$("#e8_2_close").click(function () { $("#e8_2").select2("close"); });
+});
+</script>
+            <div class="span4">
+            <h3>Programmatic Access</h3>
+             <p>Select2 supports methods that allow programmatic control of the component</p>
+                <p>
+                  <input type="button" class="btn-primary" id="e8_get" value="Alert selected value"/>
+                  <input type="button" class="btn-info" id="e8_set" value="Set to California"/>
+                  <input type="button" class="btn-info" id="e8_cl" value="Clear"/>
+                  <input type="button" class="btn-primary" id="e8_get2" value="Alert selected using data"/>
+                  <input type="button" class="btn-info" id="e8_set2" value="Set to California using data"/>
+                  <input type="button" class="btn-warning" id="e8_open" value="Open"/>
+                  <input type="button" class="btn-warning" id="e8_close" value="Close"/>
+                </p>
+             <p>
+                 <select id="e8" style="width:300px" class="populate"></select><br/>
+             </p>
+                <p>
+                  <input type="button" class="btn-primary" id="e8_2_get" value="Alert selected value"/>
+                  <input type="button" class="btn-info" id="e8_2_set" value="Set to California and Massachusetts"/>
+                  <input type="button" class="btn-primary" id="e8_2_get2" value="Alert selected value using data"/>
+                  <input type="button" class="btn-info" id="e8_2_set2" value="Set to California and Massachusetts using data"/>
+                    <input type="button" class="btn-info" id="e8_2_cl" value="Clear"/>
+                    <input type="button" class="btn-warning" id="e8_2_open" value="Open"/>
+                  <input type="button" class="btn-warning" id="e8_2_close" value="Close"/>
+                </p>
+              <p>
+                  <select id="e8_2" multiple style="width:300px" class="populate"></select><br/>
+              </p>
+          </div>
+          <div class="span8">
+            <h3>Example Code</h3>
+            <pre class="prettyprint linenums" id="code_e8"></pre>
+         </div>
+        </article>
 
-<article class="row" id="events">
-    <script id="script_e11">
-        $(document).ready(function () {
-            $("#e11").select2({
-                placeholder: "Select report type",
-                allowClear: true,
-                data: [{id: 0, text: 'story'},{id: 1, text: 'bug'},{id: 2, text: 'task'}]
-            });
-            $("#e11_2").select2({
-                createSearchChoice:function(term, data) { if ($(data).filter(function() { return this.text.localeCompare(term)===0; }).length===0) {return {id:term, text:term};} },
-                multiple: true,
-                data: [{id: 0, text: 'story'},{id: 1, text: 'bug'},{id: 2, text: 'task'}]
-            });
-            function log(e) {
-                var e=$("<li>"+e+"</li>");
-                $("#events_11").append(e);
-                e.animate({opacity:1}, 10000, 'linear', function() { e.animate({opacity:0}, 2000, 'linear', function() {e.remove(); }); });
-            }
-            $("#e11")
-                    .on("change", function(e) { log(JSON.stringify({val:e.val, added:e.added, removed:e.removed})); })
-                    .on("open", function() { log("open"); });
-            $("#e11_2")
-                    .on("change", function(e) { log(JSON.stringify({val:e.val, added:e.added, removed:e.removed})); })
-                    .on("open", function() { log("open"); });
-        });
-    </script>
-    <div class="span4">
-        <h3>Events</h3>
+      <article class="row" id="events">
+<script id="script_e11">
+$(document).ready(function () {
+$("#e11").select2({
+  placeholder: "Select report type",
+  allowClear: true,
+  data: [{id: 0, text: 'story'},{id: 1, text: 'bug'},{id: 2, text: 'task'}]
+});
+$("#e11_2").select2({
+    createSearchChoice:function(term, data) { if ($(data).filter(function() { return this.text.localeCompare(term)===0; }).length===0) {return {id:term, text:term};} },
+    multiple: true,
+    data: [{id: 0, text: 'story'},{id: 1, text: 'bug'},{id: 2, text: 'task'}]
+});
+function log(e) {
+    var e=$("<li>"+e+"</li>");
+    $("#events_11").append(e);
+    e.animate({opacity:1}, 10000, 'linear', function() { e.animate({opacity:0}, 2000, 'linear', function() {e.remove(); }); });
+}
+$("#e11")
+    .on("change", function(e) { log(JSON.stringify({val:e.val, added:e.added, removed:e.removed})); })
+    .on("open", function() { log("open"); });
+$("#e11_2")
+    .on("change", function(e) { log(JSON.stringify({val:e.val, added:e.added, removed:e.removed})); })
+    .on("open", function() { log("open"); });
+});
+</script>
+          <div class="span4">
+              <h3>Events</h3>
 
-        <p><code>change</code> event is triggered on the original element whenever its value is changed by
-            the user</p>
-        <p><code>open</code> event is triggered on the original element whenever the dropdown needs to be opened</p>
+              <p><code>change</code> event is triggered on the original element whenever its value is changed by
+                  the user</p>
+              <p><code>open</code> event is triggered on the original element whenever the dropdown needs to be opened</p>
 
-        <p><input type="hidden" id="e11" style="width:300px"/></p>
+              <p><input type="hidden" id="e11" style="width:300px"/></p>
+              <p><input type="hidden" id="e11_2" style="width:300px"/></p>
 
-        <p><input type="hidden" id="e11_2" style="width:300px"/></p>
-
-        <ul id="events_11"></ul>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+          </div>
+          <div class="span8">
+              <h3>Event Log</h3>
+              <ul id="events_11"></ul>
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e11">
            </pre>
-    </div>
-</article>
-<article class="row" id="tags">
-    <script id="script_e12">
-        $(document).ready(function () {
-            $("#e12").select2({tags:["red", "green", "blue"]});
-        });
-    </script>
-    <div class="span4">
-        <h3>Tagging Support</h3>
+          </div>
+      </article>
+      <article class="row" id="tags">
+          <script id="script_e12">
+              $(document).ready(function () {
+                  $("#e12").select2({tags:["red", "green", "blue"]});
+              });
+          </script>
+          <div class="span4">
+              <h3>Tagging Support</h3>
 
-        <p>Select2 can be used to quickly set up fields used for tagging</p>
+              <p>Select2 can be used to quickly set up fields used for tagging</p>
 
-        <p><input type="hidden" id="e12" style="width:300px" value="brown, red, green"/></p>
-        <p>Note that when tagging is enabled the user can select from pre-existing tags or create a new tag by
-            picking the first choice which is what the user has typed into the search box so far.</p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+              <p><input type="hidden" id="e12" style="width:300px" value="brown, red, green"/></p>
+              <p>Note that when tagging is enabled the user can select from pre-existing tags or create a new tag by
+                  picking the first choice which is what the user has typed into the search box so far.</p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e12">
            </pre>
-    </div>
-</article>
+          </div>
+      </article>
+      <article class="row" id="maximum">
+          <script id="script_e23">
+              $(document).ready(function () {
+                  $("#e23").select2({
+                      tags:["red", "green", "blue"],
+                      maximumInputLength: 10
+                  });
+              });
+          </script>
+          <div class="span4">
+              <h3>Maximum Input Length</h3>
 
-<article class="row" id="maximum">
-    <script id="script_e21">
-        $(document).ready(function () {
-            $("#e21").select2({
-              tags:["red", "green", "blue"], 
-              maximumInputLength: 10
-            });
-        });
-    </script>
-    <div class="span4">
-        <h3>Maximum Input Length</h3>
+              <p>Select2 can be set a limit on the number of characters that can be entered per tag.</p>
 
-        <p>Select2 can be set a limit on the number of characters that can be entered per tag.</p>
-
-        <p><input type="hidden" id="e21" style="width:300px" value="brown, red, green"/></p>
-        <p>You would not be able to enter any input of more than 10 characters long.</p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
-           <pre class="prettyprint linenums" id="code_e21">
+              <p><input type="hidden" id="e23" style="width:300px" value="brown, red, green"/></p>
+              <p>You would not be able to enter any input of more than 10 characters long.</p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
+           <pre class="prettyprint linenums" id="code_e23">
            </pre>
-    </div>
-</article>
+          </div>
+      </article>
+      <article class="row" id="token">
+          <script id="script_e20">
+              $(document).ready(function () {
+                  $("#e20").select2({
+                      tags:["red", "green", "blue"],
+                      tokenSeparators: [",", " "]});
+              });
+          </script>
+          <div class="span4">
+              <h3>Auto Tokenization</h3>
 
-<article class="row" id="token">
-    <script id="script_e20">
-        $(document).ready(function () {
-            $("#e20").select2({
-                tags:["red", "green", "blue"],
-                tokenSeparators: [",", " "]});
-        });
-    </script>
-    <div class="span4">
-        <h3>Auto Tokenization</h3>
+              <p>Select2 supports ability to add choices automatically as the user is typing into the search field.
+              This is especially convenient in the tagging usecase where the user can quickly enter a number of tags
+              by separating them with a comma or a space. Try typing in the search field below and entering a space or a comma</p>
 
-        <p>Select2 supports ability to add choices automatically as the user is typing into the search field.
-            This is especially convenient in the tagging usecase where the user can quickly enter a number of tags
-            by separating them with a comma or a space. Try typing in the search field below and entering a space or a comma</p>
-
-        <p><input type="hidden" id="e20" style="width:300px" value="brown"/></p>
-        <p>Note that the separators are defined in the <a href="#doc-tokenSeparators">tokenSeparators</a> option</code></p>
-        <p>Note that this example uses the built in <a href="#doc-tokenizer">tokenizer</a> function, but a custom one can be provided in the options.</p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+              <p><input type="hidden" id="e20" style="width:300px" value="brown"/></p>
+              <p>Note that the separators are defined in the <a href="#doc-tokenSeparators">tokenSeparators</a> option</code></p>
+              <p>Note that this example uses the built in <a href="#doc-tokenizer">tokenizer</a> function, but a custom one can be provided in the options.</p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e20">
            </pre>
-    </div>
-</article>
-<article class="row" id="event_ext_change">
-    <script id="script_e13">
-        $(document).ready(function () {
-            $("#e13").select2();
-            $("#e13_ca").click(function() { $("#e13").val("CA").trigger("change"); });
-            $("#e13_ak_co").click(function() { $("#e13").val(["AK","CO"]).trigger("change"); });
-        });
-    </script>
-    <div class="span4">
-        <h3>Reacting to external value changes</h3>
+          </div>
+      </article>
+      <article class="row" id="event_ext_change">
+<script id="script_e13">
+$(document).ready(function () {
+$("#e13").select2();
+$("#e13_ca").click(function() { $("#e13").val("CA").trigger("change"); });
+$("#e13_ak_co").click(function() { $("#e13").val(["AK","CO"]).trigger("change"); });
+});
+</script>
+          <div class="span4">
+              <h3>Reacting to external value changes</h3>
 
-        <p>Select2 can react to external value changes and keep its selection in-sync. This feature allows
-            Select2 to work seamlessly with front-end frameworks that use data binding between ui components
-            and model values.</p>
-        <p><select id="e13" multiple style="width:300px" class="populate"></select><br/></p>
-        <p><input type="button" id="e13_ca" class="btn btn-primary" value="Select California"/> <input type="button" id="e13_ak_co"  class="btn btn-primary"value="Select Alaska and Colorado"/></p>
-        <p class="alert alert-alert">This feature is only available when initSelection() function is provided in
-            the options. This function is needed to map the choice ids set on the element to objects used by
-            Select2. This function is set by default when Select2 is attached to a <code>select</code> or when
-            the <code>tags</code> helper function is used.</p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+              <p>Select2 can react to external value changes and keep its selection in-sync. This feature allows
+                  Select2 to work seamlessly with front-end frameworks that use data binding between ui components
+                  and model values.</p>
+              <p><select id="e13" multiple style="width:300px" class="populate"></select><br/></p>
+              <p><input type="button" id="e13_ca" class="btn btn-primary" value="Select California"/> <input type="button" id="e13_ak_co"  class="btn btn-primary"value="Select Alaska and Colorado"/></p>
+              <p class="alert alert-alert">This feature is only available when initSelection() function is provided in
+                  the options. This function is needed to map the choice ids set on the element to objects used by
+                  Select2. This function is set by default when Select2 is attached to a <code>select</code> or when
+                  the <code>tags</code> helper function is used.</p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e13">
            </pre>
-    </div>
-</article>
+          </div>
+      </article>
 
-<article class="row" id="lifecycle">
-    <script id="script_e14">
-        $(document).ready(function () {
-            $("#e14").val(["AL","AZ"]).select2();
-            $("#e14_init").click(function() { $("#e14").select2(); });
-            $("#e14_destroy").click(function() { $("#e14").select2("destroy"); });
-        });
-    </script>
-    <div class="span4">
-        <h3>Select2 Lifecycle</h3>
+      <article class="row" id="lifecycle">
+<script id="script_e14">
+$(document).ready(function () {
+$("#e14").val(["AL","AZ"]).select2();
+$("#e14_init").click(function() { $("#e14").select2(); });
+$("#e14_destroy").click(function() { $("#e14").select2("destroy"); });
+});
+</script>
+          <div class="span4">
+              <h3>Select2 Lifecycle</h3>
 
-        <p>
+              <p>
 
-        </p>
-        <p><select id="e14" multiple style="width:300px" class="populate"></select><br/></p>
-        <p><input type="button" id="e14_init" class="btn btn-primary" value="Init"/> <input type="button" id="e14_destroy" class="btn btn-warning"value="Destroy"/></p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+              </p>
+              <p><select id="e14" multiple style="width:300px" class="populate"></select><br/></p>
+              <p><input type="button" id="e14_init" class="btn btn-primary" value="Init"/> <input type="button" id="e14_destroy" class="btn btn-warning"value="Destroy"/></p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e14">
            </pre>
-    </div>
-</article>
+          </div>
+      </article>
 
-<article class="row" id="lifecycle">
-    <script id="script_e15">
-        $(document).ready(function () {
-            $("#e15").select2({tags:["red", "green", "blue", "orange", "white", "black", "purple", "cyan", "teal"]});
-            $("#e15").on("change", function() { $("#e15_val").html($("#e15").val());});
+      <article class="row" id="lifecycle">
+<script id="script_e15">
+$(document).ready(function () {
+$("#e15").select2({tags:["red", "green", "blue", "orange", "white", "black", "purple", "cyan", "teal"]});
+$("#e15").on("change", function() { $("#e15_val").html($("#e15").val());});
 
-            $("#e15").select2("container").find("ul.select2-choices").sortable({
-                containment: 'parent',
-                start: function() { $("#e15").select2("onSortStart"); },
-                update: function() { $("#e15").select2("onSortEnd"); }
-            });
-        });
-    </script>
-    <div class="span4">
-        <h3>Select2 Drag and Drop Sorting</h3>
-        <p>
-            Select2 supports drag and drop sorting of selected choices. Select2 does not, itself, provide the necessary code to perform dragging and dropping, instead it provides hooks that other libraries can use to provide the behavior. In this example we are using JQuery UI's <code>sortable()</code> plugin.
-        </p>
-        <p class="alert alert-info">The sorting is only available when Select2 is attached to a hidden <code>input</code> field.</p>
-        <p><input type="hidden" id="e15" style="width:300px;" value="red,green,blue,orange,white,black"/></p>
-        <p><div id="e15_val"></div></p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+$("#e15").select2("container").find("ul.select2-choices").sortable({
+    containment: 'parent',
+    start: function() { $("#e15").select2("onSortStart"); },
+    update: function() { $("#e15").select2("onSortEnd"); }
+});
+});
+</script>
+          <div class="span4">
+              <h3>Select2 Drag and Drop Sorting</h3>
+              <p>
+                  Select2 supports drag and drop sorting of selected choices. Select2 does not, itself, provide the necessary code to perform dragging and dropping, instead it provides hooks that other libraries can use to provide the behavior. In this example we are using JQuery UI's <code>sortable()</code> plugin.
+              </p>
+              <p class="alert alert-info">The sorting is only available when Select2 is attached to a hidden <code>input</code> field.</p>
+              <p><input type="hidden" id="e15" style="width:300px;" value="red,green,blue,orange,white,black"/></p>
+              <p><div id="e15_val"></div></p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e15">
            </pre>
-    </div>
-</article>
+          </div>
+      </article>
 
 
-<article class="row" id="disabled">
-    <script id="script_e16">
-        $(document).ready(function () {
-            $("#e16").select2();
-            $("#e16_2").select2();
-            $("#e16_enable").click(function() { $("#e16,#e16_2").select2("enable"); });
-            $("#e16_disable").click(function() { $("#e16,#e16_2").select2("disable"); });
-        });
-    </script>
-    <div class="span4">
-        <h3>Select2 Disabled Mode</h3>
-        <p><select disabled="disabled" id="e16" style="width:300px" class="populate"></select><br/></p>
-        <p><select disabled="disabled" id="e16_2" multiple style="width:300px" class="populate"></select><br/></p>
-        <p><input type="button" id="e16_enable" class="btn btn-primary" value="Enable"/> <input type="button" id="e16_disable" class="btn btn-warning"value="Disable"/></p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+      <article class="row" id="disabled">
+          <script id="script_e16">
+              $(document).ready(function () {
+$("#e16").select2();
+$("#e16_2").select2();
+$("#e16_enable").click(function() { $("#e16,#e16_2").select2("enable"); });
+$("#e16_disable").click(function() { $("#e16,#e16_2").select2("disable"); });
+              });
+          </script>
+          <div class="span4">
+              <h3>Select2 Disabled Mode</h3>
+              <p><select disabled="disabled" id="e16" style="width:300px" class="populate"></select><br/></p>
+              <p><select disabled="disabled" id="e16_2" multiple style="width:300px" class="populate"></select><br/></p>
+              <p><input type="button" id="e16_enable" class="btn btn-primary" value="Enable"/> <input type="button" id="e16_disable" class="btn btn-warning"value="Disable"/></p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e16">
            </pre>
-    </div>
-</article>
+          </div>
+      </article>
 
-<article class="row" id="matcher">
-    <script id="script_e17">
-        $(document).ready(function () {
-            $("#e17").select2({
-                matcher: function(term, text) { return text.toUpperCase().indexOf(term.toUpperCase())==0; }
-            });
+      <article class="row" id="matcher">
+          <script id="script_e17">
+              $(document).ready(function () {
+$("#e17").select2({
+      matcher: function(term, text) { return text.toUpperCase().indexOf(term.toUpperCase())==0; }
+});
 // <select id="e17_2" style="width:300px">
 //     <option alt="pink">red</option>
 //     <option alt="cyan">blue</option>
 // </select>
-            $("#e17_2").select2({
-                matcher: function(term, text, opt) {
-                    return text.toUpperCase().indexOf(term.toUpperCase())>=0
-                            || opt.attr("alt").toUpperCase().indexOf(term.toUpperCase())>=0;
-                }
-            });
-        });
-    </script>
-    <div class="span4">
-        <h3>Custom Matcher</h3>
-        <p>Unlike other dropdowns on this page, this one matches options only if the term appears in the beginning of the string as opposed to anywhere</p>
-        <p><select id="e17" style="width:300px" class="populate"></select><br/></p>
-        <p>The dropdown below matches on custom attributes of the <code>option</code> tag. For example, the `blue` option can be matched by entering either `blue` or `cyan`.</p>
-        <p><select id="e17_2" style="width:300px"><option alt="pink">red</option><option alt="cyan">blue</option></select></p>
-    </div>
-    <div class="span8">
-        <h3>Example Code</h3>
+$("#e17_2").select2({
+   matcher: function(term, text, opt) {
+       return text.toUpperCase().indexOf(term.toUpperCase())>=0
+           || opt.attr("alt").toUpperCase().indexOf(term.toUpperCase())>=0;
+   }
+});
+              });
+          </script>
+          <div class="span4">
+              <h3>Custom Matcher</h3>
+               <p>Unlike other dropdowns on this page, this one matches options only if the term appears in the beginning of the string as opposed to anywhere</p>
+              <p><select id="e17" style="width:300px" class="populate"></select><br/></p>
+              <p>The dropdown below matches on custom attributes of the <code>option</code> tag. For example, the `blue` option can be matched by entering either `blue` or `cyan`.</p>
+              <p><select id="e17_2" style="width:300px"><option alt="pink">red</option><option alt="cyan">blue</option></select></p>
+          </div>
+          <div class="span8">
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e17">
            </pre>
-    </div>
-</article>
+          </div>
+      </article>
 
-<article class="row" id="responsive">
-    <script id="script_e18">
-        $(document).ready(function () {
-            $("#e18,#e18_2").select2();
-        });
-    </script>
-    <div class="span12">
-        <h3>Responsive Design - Percent Width</h3>
-        <p>Select2's width can be set to a percentage of its parent to support responsive design. The two Select2 boxes below are styled to 50% and 75% width respectively.</p>
-        <p><select id="e18" style="width:50%" class="populate"></select><br/></p>
-        <p><select multiple="multiple" id="e18_2" style="width:75%" placeholder="Select a state" class="populate placeholder"></select><br/></p>
-        <p class="alert alert-warning">Select2 will do its best to resolve the percent width specified via a css class, but it is not always possible. The best way to ensure that Select2 is using a percent based width is to inline the style declaration into the tag.</p>
-    </div>
-    <div class="span12">
-        <h3>Example Code</h3>
+      <article class="row" id="sort_results">
+        <script id="script_e22">
+$(document).ready(function () {
+$('#e22').select2({
+    sortResults: function(results, container, query) {
+        if (query.term) {
+            // use the built in javascript sort function
+            return results.sort(function(a, b) {
+                if (a.text.length > b.text.length) {
+                    return 1;
+                } else if (a.text.length < b.text.length) {
+                    return -1;
+                } else {
+                    return 0;
+                }
+            });
+        }
+        return results;
+    }
+});
+});
+        </script>
+        <div class="span4">
+            <h3>Sorting Displayed Results</h3>
+                <p>Unlike other dropdowns on this page, this one filters results by query string normally, but returns the matched results sorted from shortest to longest by string length. Try typing 'e' and seeing how the results are sorted. This function is useful for sorting results by relevance to a user's query.</p>
+                <p>
+                    <select id="e22" style="width:300px">
+                        <option value="red">red</option>
+                        <option value="green">green</option>
+                        <option value="blue">blue</option>
+                    </select><br/>
+                </p>
+        </div>
+        <div class="span8">
+            <h3>Example Code</h3>
+            <pre class="prettyprint linenums" id="code_e22">
+            </pre>
+        </div>
+      </article>
+
+      <article class="row" id="responsive">
+          <script id="script_e18">
+              $(document).ready(function () {
+$("#e18,#e18_2").select2();
+              });
+          </script>
+          <div class="span12">
+              <h3>Responsive Design - Percent Width</h3>
+              <p>Select2's width can be set to a percentage of its parent to support responsive design. The two Select2 boxes below are styled to 50% and 75% width respectively.</p>
+              <p><select id="e18" style="width:50%" class="populate"></select><br/></p>
+              <p><select multiple="multiple" id="e18_2" style="width:75%" placeholder="Select a state" class="populate placeholder"></select><br/></p>
+              <p class="alert alert-warning">Select2 will do its best to resolve the percent width specified via a css class, but it is not always possible. The best way to ensure that Select2 is using a percent based width is to inline the style declaration into the tag.</p>
+          </div>
+          <div class="span12">
+              <h3>Example Code</h3>
            <pre class="prettyprint linenums" id="code_e18">
            </pre>
-    </div>
-</article>
+          </div>
+      </article>
+
+      <article class="row" id="locked-selections">
+          <script id="script_e21">
+
+var preload_data = [
+  { id: 'user0', text: 'Disabled User', locked: true}
+  , { id: 'user1', text: 'Jane Doe'}
+  , { id: 'user2', text: 'John Doe', locked: true }
+  , { id: 'user3', text: 'Robert Paulson', locked: true }
+  , { id: 'user5', text: 'Spongebob Squarepants'}
+  , { id: 'user6', text: 'Planet Bob' }
+  , { id: 'user7', text: 'Inigo Montoya' }
+];
+
+$(document).ready(function () {
+  $('#e21').select2({
+      multiple: true
+      ,query: function (query){
+          var data = {results: []};
+
+          $.each(preload_data, function(){
+              if(query.term.length == 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0 ){
+                  data.results.push({id: this.id, text: this.text });
+              }
+          });
+
+          query.callback(data);
+      }
+  });
+  $('#e21').select2('data', preload_data )
+});
+          </script>
+          <div class="span12">
+              <h3>Lock selections</h3>
+              <p>
+                  In the event that you need to lock certain selections so that they can't be removed by the select2 interface, you can now pass in <code>locked: true</code> with your data. Please note: This also works for incoming values from ajax.
+              </p>
+              <p>
+                  <input type="hidden" id="e21" style="width:300px;"/>
+             </p>
+          </div>
+          <div class="span12">
+              <h3>Example Code</h3>
+        <pre class="prettyprint linenums" id="code_e21">
+        </pre>
+          </div>
+      </article>
+
+      </section>
 
 
-</section>
+      <!--               -->
+      <!-- DOCUMENTATION -->
+      <!--               -->
 
 
-<!--               -->
-<!-- DOCUMENTATION -->
-<!--               -->
+      <section id="documentation">
 
+        <div class="row" style="padding-top: 20px;">
+            <div class="span12"><h2>Documentation</h2><hr/></div>
+        </div>
 
-<section id="documentation">
+        <div class="row">
+            <div class="span12"><h3>Constructor</h3></div>
+        </div>
+        <table class="table table-bordered table-striped">
+            <tr>
+                <th>Parameter</th><th>Type</th><th>Description</th>
+            </tr>
+            <tr><td>width</td><td>string</td><td>
+                Controls the <code>width</code> style attribute of the Select2 container div. The following values are supported:
+                <dl>
+                    <dt>off</dt><dd>No width attribute will be set. Keep in mind that the container div copies classes from the source element so setting the width attribute may not always be necessary.</dd>
+                    <dt>element</dt><dd>Uses javascript to calculate the width of the source element.</dd>
+                    <dt>copy</dt><dd>Copies the value of the width style attribute set on the source element</dd>
+                    <dt>resolve</dt><dd>First attempts to <u>copy</u> than falls back on <u>element</u></dd>
+                    <dt>other values</dt><dd>if the width attribute contains a function it will be avaluated, otherwise the value is used verbatim</dd>
+                </dl>
+            </td></tr>
+            <tr><td>minimumInputLength</td><td>int</td><td>Number of characters necessary to start a search</td></tr>
+            <tr><td>maximumInputLength</td><td>int</td><td>Maximum number of characters that can be entered for an input</td></tr>
+            <tr><td>minimumResultsForSearch</td><td>int</td><td>
+                <p>
+                    The minimum number of results that must be initially (after opening the dropdown for the first time)
+                    populated in order to keep the search field. This
+                    is useful for cases where local data is used with just a few results, in which case the search box
+                    is not very useful and wastes screen space.
+                </p>
+                <p class="alert alert-info">Only applies to single-value select boxes</p>
+            </td>
+            </tr>
+            <tr><td>maximumSelectionSize</td><td>int/function</td><td>
+                <p>
+                    The maximum number of items that can be selected in a multi-select control. If this number is less than 1 selection is not limited.
+                </p>
+                <p>Once the number of selected items reaches the maximum specified the contents of the dropdown will be populated
+                by the <code>formatSelectionTooBig</code> function</p>
+            </td>
+            </tr>
+            <tr><td>placeholder</td><td>string</td><td>
+                <p>Initial value that is selected if no other selection is made.</p>
+                <p>The placeholder can also be specified as a <code>data-placeholder</code> attribute on the <code>select</code>
+                    or <code>input</code> element that Select2 is attached to.
+                </p>
 
-<div class="row" style="padding-top: 20px;">
-    <div class="span12"><h2>Documentation</h2><hr/></div>
-</div>
+                <p class="alert alert-warning">Note that because browsers assume the first <code>option</code> element
+                    is selected in non-multi-value select boxes an empty first <code>option</code> element must be provided (<code>&lt;option&gt;&lt;/option&gt;</code>)
+                    for the placeholder to work.
+                </p>
+            </td></tr>
+            <tr><td>separator</td><td>string</td><td>
+                <p>
+                    Separator character or string used to delimit ids in <code>value</code> attribute of the multi-valued selects.
+                    The default delimiter is the <code>,</code> character.
+                </p>
+            </td></tr>
+            <tr>
+                <td>allowClear</td>
+                <td>boolean</td>
+                <td>
+                    <p>
+                        Whether or not a clear button is displayed when the select box has a selection. The
+                        button,
+                        when clicked, resets the value of the select box back to the placeholder, thus this option is
+                        only
+                        available when the placeholder is specified.
+                    </p>
+                    <p>This option only works when the placeholder is specified</p>
+                    <p class="alert alert-warning">When attached to a <code>select</code> an <code>option</code> with an empty value must be provided.
+                        This is the option that will be selected when the button is pressed since a select box requires
+                        at least one selection <code>option</code>.</p>
+                    <p>
+                        Also, note that this option only works with
+                        non-multi-value based selects because multi-value selects always provide such a button for every
+                        selected option.
+                    </p>
+                </td>
+            </tr>
+            <tr>
+                <td>multiple</td>
+                <td>boolean</td>
+                <td>
+                    <p>
+                        Whether or not Select2 allows selection of multiple values.
+                    </p>
+                    <p>When Select2 is attached to a <code>select</code> element this value will be ignored and <code>select</code>'s
+                        <code>multiple</code> attribute will be used instead.
+                    </p>
+                </td>
+            </tr>
+            <tr>
+                <td>closeOnSelect</td>
+                <td>boolean</td>
+                <td>
+                    <p>
+                       If set to true the dropdown is not closed after a selection is made, allowing for rapid selection of multiple items. By default this option is disabled.
+                    </p>
 
-<div class="row">
-    <div class="span12"><h3>Constructor</h3></div>
-</div>
-<table class="table table-bordered table-striped">
-<tr>
-    <th>Parameter</th><th>Type</th><th>Description</th>
-</tr>
-<tr><td>width</td><td>string</td><td>
-    Controls the <code>width</code> style attribute of the Select2 container div. The following values are supported:
-    <dl>
-        <dt>off</dt><dd>No width attribute will be set. Keep in mind that the container div copies classes from the source element so setting the width attribute may not always be necessary.</dd>
-        <dt>element</dt><dd>Uses javascript to calculate the width of the source element.</dd>
-        <dt>copy</dt><dd>Copies the value of the width style attribute set on the source element.</dd>
-        <dt>resolve</dt><dd>First attempts to <u>copy</u> than falls back on <u>element</u>.</dd>
-        <dt>other values</dt><dd>if the width attribute contains a function it will be evaluated, otherwise the value is used verbatim.</dd>
-    </dl>
-</td></tr>
-<tr><td>minimumInputLength</td><td>int</td><td>Number of characters necessary to start a search</td></tr>
-<tr><td>maximumInputLength</td><td>int</td><td>Maximum number of characters that can be entered for an input</td></tr>
-<tr><td>minimumResultsForSearch</td><td>int</td><td>
-    <p>
-        The minimum number of results that must be initially (after opening the dropdown for the first time)
-        populated in order to keep the search field. This
-        is useful for cases where local data is used with just a few results, in which case the search box
-        is not very useful and wastes screen space.
-    </p>
-    <p class="alert alert-info">Only applies to single-value select boxes</p>
-</td>
-</tr>
-<tr><td>maximumSelectionSize</td><td>int</td><td>
-    <p>
-        The maximum number of items that can be selected in a multi-select control. If this number is less than 1 selection is not limited.
-    </p>
-    <p>Once the number of selected items reaches the maximum specified the contents of the dropdown will be populated
-        by the <code>formatSelectionTooBig</code> function</p>
-</td>
-</tr>
-<tr><td>placeholder</td><td>string</td><td>
-    <p>Initial value that is selected if no other selection is made.</p>
-    <p>The placeholder can also be specified as a <code>data-placeholder</code> attribute on the <code>select</code>
-        or <code>input</code> element that Select2 is attached to.
-    </p>
-
-    <p class="alert alert-warning">Note that because browsers assume the first <code>option</code> element
-        is selected in non-multi-value select boxes an empty first <code>option</code> element must be provided (<code>&lt;option&gt;&lt;/option&gt;</code>)
-        for the placeholder to work.
-    </p>
-</td></tr>
-<tr><td>separator</td><td>string</td><td>
-    <p>
-        Separator character or string used to delimit ids in <code>value</code> attribute of the multi-valued selects.
-        The default delimiter is the <code>,</code> character.
-    </p>
-</td></tr>
-<tr>
-    <td>allowClear</td>
-    <td>boolean</td>
-    <td>
-        <p>
-            Whether or not a clear button is displayed when the select box has a selection. The
-            button,
-            when clicked, resets the value of the select box back to the placeholder, thus this option is
-            only
-            available when the placeholder is specified.
-        </p>
-        <p>This option only works when the placeholder is specified</p>
-        <p class="alert alert-warning">When attached to a <code>select</code> an <code>option</code> with an empty value must be provided.
-            This is the option that will be selected when the button is pressed since a select box requires
-            at least one selection <code>option</code>.</p>
-        <p>
-            Also, note that this option only works with
-            non-multi-value based selects because multi-value selects always provide such a button for every
-            selected option.
-        </p>
-    </td>
-</tr>
-<tr>
-    <td>multiple</td>
-    <td>boolean</td>
-    <td>
-        <p>
-            Whether or not Select2 allows selection of multiple values.
-        </p>
-        <p>When Select2 is attached to a <code>select</code> element this value will be ignored and <code>select</code>'s
-            <code>multiple</code> attribute will be used instead.
-        </p>
-    </td>
-</tr>
-<tr>
-    <td>closeOnSelect</td>
-    <td>boolean</td>
-    <td>
-        <p>
-            If set to false the dropdown is not closed after a selection is made, allowing for rapid selection of multiple items. By default this option is disabled.
-        </p>
-
-        <p class="alert alert-info">
-            Only applies when configured in multi-select mode.
-        </p>
-    </td>
-</tr>
-<tr>
-    <td>openOnEnter</td>
-    <td>boolean</td>
-    <td>
-        <p>
-            If set to true the dropdown is opened when the user presses the enter key and Select2 is closed. By default this option is enabled.
-        </p>
-    </td>
-</tr>
-<tr><td>id</td><td>function</td><td>
-    Function used to get the id from the choice object or a string representing the key under which the id is stored.
-    <pre>id(object)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>object</td><td>object</td><td>A choice object</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string</td><td>the id of the object</td></tr>
-    </table>
-    The default implementation expects the object to have a <code>id</code> property that is returned.
-</td></tr>
-<tr><td id="doc-matcher">matcher</td><td>function</td><td>
-    Used to determine whether or not the search term matches an option when a built-in query function is used.
-    The built in query function is used when Select2 is attached to a <code>select</code>, or the <code>local</code> or <code>tags</code> helpers are used.
-    <pre>matcher(term, text, option)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>term</td><td>string</td><td>search term</td></tr>
-        <tr><td>text</td><td>string</td><td>text of the option being matched</td></tr>
-        <tr><td>option</td><td>jquery object</td>
-            <td>the <code>option</code> element we are trying to match. Only given when attached to <code>select</code>.
-                Can be used to match against custom attributes on the <code>option</code> tag in addition to matching on the <code>option</code>'s text.</code></td></tr>
-        <tr><td>&lt;returns&gt;</td><td>boolean</td><td><code>true</code> if search term matches the text, or <code>false</code> otherwise</td></tr>
-    </table>
-    The default implementation is case insensitive and matches anywhere in ther term:
-    <code>function(term, text) { return text.toUpperCase().indexOf(term.toUpperCase())>=0; }</code>
-</td></tr>
-<tr><td>formatSelection</td><td>function</td><td>
-    Function used to render the current selection.
-    <pre>formatSelection(object, container)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>object</td><td>object</td><td>The selected result object returned from the <code>query</code> function</td></tr>
-        <tr><td>container</td><td>jQuery object</td><td>jQuery wrapper of the node to which the selection should be appended</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>Html string, a DOM element, or a jQuery object that renders the selection</td></tr>
-    </table>
-    <p>The default implementation expects the object to have a <code>text</code> property that is returned.</p>
-    <p>The implementation may choose to append elements directly to the provided <code>container</code> object, or return a single value and have it automatically appended</p>
-    <br><br>
-    <p>
-        When attached to a <code>select</code> the original <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) element is accessible inside the specified function through the property <code>item.element</code>:
+                    <p class="alert alert-info">
+                        Only applies when configured in multi-select mode.
+                    </p>
+                </td>
+            </tr>
+            <tr>
+                <td>openOnEnter</td>
+                <td>boolean</td>
+                <td>
+                    <p>
+                        If set to true the dropdown is opened when the user presses the enter key and Select2 is closed. By default this option is enabled.
+                    </p>
+                </td>
+            </tr>
+            <tr><td>id</td><td>function</td><td>
+                   Function used to get the id from the choice object or a string representing the key under which the id is stored.
+                   <pre>id(object)</pre>
+                   <table class="table table-bordered table-striped">
+                       <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                       <tr><td>object</td><td>object</td><td>A choice object</td></tr>
+                       <tr><td>&lt;returns&gt;</td><td>string</td><td>the id of the object</td></tr>
+                   </table>
+                   The default implementation expects the object to have a <code>id</code> property that is returned.
+            </td></tr>
+            <tr><td id="doc-matcher">matcher</td><td>function</td><td>
+                Used to determine whether or not the search term matches an option when a built-in query function is used.
+                The built in query function is used when Select2 is attached to a <code>select</code>, or the <code>local</code> or <code>tags</code> helpers are used.
+                <pre>matcher(term, text, option)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>term</td><td>string</td><td>search term</td></tr>
+                    <tr><td>text</td><td>string</td><td>text of the option being matched</td></tr>
+                    <tr><td>option</td><td>jquery object</td>
+                        <td>the <code>option</code> element we are trying to match. Only given when attached to <code>select</code>.
+                            Can be used to match against custom attributes on the <code>option</code> tag in addition to matching on the <code>option</code>'s text.</code></td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>boolean</td><td><code>true</code> if search term matches the text, or <code>false</code> otherwise</td></tr>
+                </table>
+                The default implementation is case insensitive and matches anywhere in the term:
+                <code>function(term, text) { return text.toUpperCase().indexOf(term.toUpperCase())>=0; }</code>
+            </td></tr>
+            <tr><td id="doc-sort-results">sortResults</td><td>function</td><td>
+                Used to sort the results list for searching right before display. Useful for sorting matches by relevance to the user's search term.
+                <pre>sortResults(results, container, query)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><td>object</td><td>object</td><td>One of the result objects returned from the <code>query</code> function</td></tr>
+                    <tr><td>container</td><td>jQuery object</td><td>jQuery wrapper of the node that should contain the representation of the result</td></tr>
+                    <tr><td>query</td><td>object</td><td>The query object used to request this set of results</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>object</td><td>A results object.</td></tr>
+                </table>
+                Defaults to no sorting:
+                <code>function(results, container, query) { return results; }</code>
+            </td></tr>
+            <tr><td>formatSelection</td><td>function</td><td>
+                Function used to render the current selection.
+                <pre>formatSelection(object, container)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>object</td><td>object</td><td>The selected result object returned from the <code>query</code> function</td></tr>
+                    <tr><td>container</td><td>jQuery object</td><td>jQuery wrapper of the node to which the selection should be appended</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>Html string, a DOM element, or a jQuery object that renders the selection</td></tr>
+                </table>
+                <p>The default implementation expects the object to have a <code>text</code> property that is returned.</p>
+                <p>The implementation may choose to append elements directly to the provided <code>container</code> object, or return a single value and have it automatically appended</p>
+                <br><br>
+                <p>
+                When attached to a <code>select</code> the original <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) element is accessible inside the specified function through the property <code>item.element</code>:
                 <pre>
                     format(item) {
                         var originalOption = item.element;
                         return item.text
                     }
                 </pre>
-    </p>
-</td></tr>
-<tr><td>formatResult</td><td>function</td><td>
-    Function used to render a result that the user can select.
-    <pre>formatResult(object, container, query)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>object</td><td>object</td><td>One of the result objects returned from the <code>query</code> function</td></tr>
-        <tr><td>container</td><td>jQuery object</td><td>jQuery wrapper of the node that should contain the representation of the result</td></tr>
-        <tr><td>query</td><td>object</td><td>The query object used to request this set of results</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>Html string, a DOM element, or a jQuery object that represents the result</td></tr>
-    </table>
-    <p>The default implementation expects the object to have a <code>text</code> property that is returned.</p>
-    <p>The implementation may choose to append elements directly to the provided <code>container</code> object, or return a single value and have it automatically appended</p>
-    <br><br>
-    <p>
-        When attached to a <code>select</code> the original <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) element is accessible inside the specified function through the property <code>item.element</code>:
+                </p>
+            </td></tr>
+            <tr><td>formatResult</td><td>function</td><td>
+                Function used to render a result that the user can select.
+                <pre>formatResult(object, container, query)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>object</td><td>object</td><td>One of the result objects returned from the <code>query</code> function</td></tr>
+                    <tr><td>container</td><td>jQuery object</td><td>jQuery wrapper of the node that should contain the representation of the result</td></tr>
+                    <tr><td>query</td><td>object</td><td>The query object used to request this set of results</td></tr>
+                    <tr><td>escapeMarkup</td><td>function</td><td>Function used to escape markup in results. If you do not expect to render custom markup you should pass your text through this function to escape any markup that may have been accidentally returned. This function is configurable in options of select2.</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>Html string, a DOM element, or a jQuery object that represents the result</td></tr>
+                </table>
+                <p>The default implementation expects the object to have a <code>text</code> property that is returned.</p>
+                <p>The implementation may choose to append elements directly to the provided <code>container</code> object, or return a single value and have it automatically appended</p>
+                <br><br>
+                <p>
+                When attached to a <code>select</code> the original <code>&lt;option&gt;</code> (or &lt;optgroup&gt;) element is accessible inside the specified function through the property <code>item.element</code>:
                 <pre>
                     format(item) {
                         var originalOption = item.element;
                         return item.text
                     }
                 </pre>
-    </p>
-</td></tr>
-<tr><td>formatResultCssClass</td><td>function</td><td>
-    Function used to add css classes to result elements
-    <pre>formatResultCssClass(object)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>object</td><td>object</td><td>One of the result objects returned from the <code>query</code> function</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>String containing css class names separated by a space</td></tr>
-    </table>
-    <p class="alert alert-info">By default when attached to a <code>select</code> css classes from <code>option</code>s will be automatically copied</p>
-</td></tr>
-<tr><td>formatNoMatches</td><td>function</td><td>
-    Function used to render the &quot;No matches&quot; message
-    <pre>formatNoMatches(term)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>term</td><td>string</td><td>Search string entered by user</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html</td></tr>
-    </table>
-</td></tr>
-<tr><td>formatSearching</td><td>function</td><td>
-    Function used to render the &quot;Searching...&quot; message that is displayed while
-    search is in progress
-    <pre>formatSearching()</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html</td></tr>
-    </table>
-</td></tr>
-<tr><td>formatInputTooShort</td><td>function</td><td>
-    Function used to render the &quot;Search input too short&quot; message
-    <pre>formatInputTooShort(term, minLength)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>term</td><td>string</td><td>Search string entered by user</td></tr>
-        <tr><td>minLength</td><td>int</td><td>Minimum required term length</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html</td></tr>
-    </table>
-</td></tr>
-<tr><td>formatSelectionTooBig</td><td>function</td><td>
-    Function used to render the &quot;You cannot select any more choices&quot; message
-    <pre>formatSelectionTooBig(maxSize)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>maxSize</td><td>string</td><td>The maximum specified size of the selection</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html</td></tr>
-    </table>
-</td></tr>
-<tr><td>formatLoadMore</td><td>function</td><td>
-    Function used to render the &quot;Loading more results...&quot; message
-    <pre>formatLoadMore(pageNumber)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>pageNumber</td><td>int</td><td>1-based page number tracked by Select2 for use with infinite scrolling of results</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html</td></tr>
-    </table>
-</td></tr>
-<tr><td>createSearchChoice</td><td>function</td><td>
-    Creates a new selectable choice from user's search term. Allows creation of choices not available via the query
-    function. Useful when the user can create choices on the fly, eg for the 'tagging' usecase.
-    <pre>createSearchChoice(term)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>term</td><td>string</td><td>Search string entered by user</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>object (optional)</td><td>Object representing the new choice.
-            Must at least contain an <code>id</code> attribute.</td></tr>
-    </table>
-    If the function returns <code>undefined</code> or <code>null</code> no choice will be created. If a new
-    choice is created it is displayed first in the selection list so that user may select it by simply pressing
-    <code>enter</code>.
+                </p>
+            </td></tr>
+            <tr><td>formatResultCssClass</td><td>function</td><td>
+                Function used to add css classes to result elements
+                <pre>formatResultCssClass(object)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>object</td><td>object</td><td>One of the result objects returned from the <code>query</code> function</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>String containing css class names separated by a space</td></tr>
+                </table>
+                <p class="alert alert-info">By default when attached to a <code>select</code> css classes from <code>option</code>s will be automatically copied</p>
+            </td></tr>
+            <tr><td>formatNoMatches</td><td>function</td><td>
+                Function used to render the &quot;No matches&quot; message
+                <pre>formatNoMatches(term)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>term</td><td>string</td><td>Search string entered by user</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html</td></tr>
+                </table>
+            </td></tr>
+            <tr><td>formatSearching</td><td>function</td><td>
+                Function used to render the &quot;Searching...&quot; message that is displayed while
+                search is in progress
+                <pre>formatSearching()</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html or <code>null</code>/<code>undefined</code> to disable the message</td></tr>
+                </table>
+            </td></tr>
+            <tr><td>formatInputTooShort</td><td>function</td><td>
+                Function used to render the &quot;Search input too short&quot; message
+                <pre>formatInputTooShort(term, minLength)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>term</td><td>string</td><td>Search string entered by user</td></tr>
+                    <tr><td>minLength</td><td>int</td><td>Minimum required term length</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html</td></tr>
+                </table>
+            </td></tr>
+            <tr><td>formatSelectionTooBig</td><td>function</td><td>
+                Function used to render the &quot;You cannot select any more choices&quot; message
+                <pre>formatSelectionTooBig(maxSize)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>maxSize</td><td>string</td><td>The maximum specified size of the selection</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>string</td><td>Message html</td></tr>
+                </table>
+            </td></tr>
+            <tr><td>createSearchChoice</td><td>function</td><td>
+                Creates a new selectable choice from user's search term. Allows creation of choices not available via the query
+                function. Useful when the user can create choices on the fly, eg for the 'tagging' usecase.
+                <pre>createSearchChoice(term)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>term</td><td>string</td><td>Search string entered by user</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>object (optional)</td><td>Object representing the new choice.
+                        Must at least contain an <code>id</code> attribute.</td></tr>
+                </table>
+                If the function returns <code>undefined</code> or <code>null</code> no choice will be created. If a new
+                choice is created it is displayed first in the selection list so that user may select it by simply pressing
+                <code>enter</code>.
 
-    <p class="alert alert-warning">When used in combination with <code>input[type=hidden]</code> tag care
-        must be taken to sanitize the <code>id</code> attribute of the choice object, especially stripping
-        <code>,</code> as it is used as a value separator</p>
-</td></tr>
-<tr><td>initSelection</td><td>function</td><td>
-    Called when Select2 is created to allow the user to initialize the selection based on the value of the
-    element select2 is attached to.
-    <p>
-        Essentially this is an <code>id->object</code> mapping function.
-    </p>
-    <pre>initSelection(element, callback)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>element</td><td>jQuery array</td><td>element Select2 is attached to</td></tr>
-        <tr><td>callback</td><td>function</td><td>callback function that should be called with the data which is either an object in case of a single select or an array of objects in case of multi-select</td></tr>
-    </table>
-    <p class="alert alert-info">This function will only be called when there is initial input to be processed.</p>
-    Here is an example implementation used for tags. Tags are the simplest form of data where the id is also
-    the text:
+                <p class="alert alert-warning">When used in combination with <code>input[type=hidden]</code> tag care
+                must be taken to sanitize the <code>id</code> attribute of the choice object, especially stripping
+                <code>,</code> as it is used as a value separator</p>
+            </td></tr>
+            <tr><td>initSelection</td><td>function</td><td>
+                Called when Select2 is created to allow the user to initialize the selection based on the value of the
+                element select2 is attached to.
+                <p>
+                Essentially this is an <code>id->object</code> mapping function.
+                </p>
+                <pre>initSelection(element, callback)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>element</td><td>jQuery array</td><td>element Select2 is attached to</td></tr>
+                    <tr><td>callback</td><td>function</td><td>callback function that should be called with the data which is either an object in case of a single select or an array of objects in case of multi-select</td></tr>
+                </table>
+                <p class="alert alert-info">This function will only be called when there is initial input to be processed.</p>
+                Here is an example implementation used for tags. Tags are the simplest form of data where the id is also
+                the text:
 <pre class="prettyprint">
 $("#tags").select2({
     initSelection : function (element, callback) {
@@ -1154,61 +1256,61 @@ $("#tags").select2({
     }
 });
 </pre>
-</td></tr>
-<tr id="doc-tokenizer"><td>tokenizer</td><td>function</td><td>
-    A tokenizer function can process the input typed into the search field after every keystroke and extract
-    and select choices. This is useful, for example, in tagging scenarios where the user can create tags quickly
-    by separating them with a comma or a space instead of pressing enter.
-    <p class="alert alert-info">Tokenizer only applies to multi-selects</p>
-    <pre>tokenizer(input, selection, selectCallback, opts)</pre>
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>input</td><td>string</td><td>The text entered into the search field so far</td></tr>
-        <tr><td>selection</td><td>array</td><td>Array of objects representing the current selection.
-            Useful if tokenizer needs to filter out duplicates.</td></tr>
-        <tr><td>selectCallback</td><td>function</td><td>Callback that can be used to add objects to the selection</td></tr>
-        <tr><td>opts</td><td>object</td><td>Options with which Select2 was initialized. Useful if tokenizer needs to access some properties in the options.</td></tr>
-        <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>Returns the string to which the input of
-            the search field should be set to. Usually this is the remainder, of any, of the string after
-            the tokens have been stripped. If <code>undefined</code> or <code>null</code> is returned the
-            input of the search field is unchanged.</code></td></tr>
-    </table>
+            </td></tr>
+            <tr id="doc-tokenizer"><td>tokenizer</td><td>function</td><td>
+                A tokenizer function can process the input typed into the search field after every keystroke and extract
+                and select choices. This is useful, for example, in tagging scenarios where the user can create tags quickly
+                by separating them with a comma or a space instead of pressing enter.
+                <p class="alert alert-info">Tokenizer only applies to multi-selects</p>
+                <pre>tokenizer(input, selection, selectCallback, opts)</pre>
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>input</td><td>string</td><td>The text entered into the search field so far</td></tr>
+                    <tr><td>selection</td><td>array</td><td>Array of objects representing the current selection.
+                        Useful if tokenizer needs to filter out duplicates.</td></tr>
+                    <tr><td>selectCallback</td><td>function</td><td>Callback that can be used to add objects to the selection</td></tr>
+                    <tr><td>opts</td><td>object</td><td>Options with which Select2 was initialized. Useful if tokenizer needs to access some properties in the options.</td></tr>
+                    <tr><td>&lt;returns&gt;</td><td>string (optional)</td><td>Returns the string to which the input of
+                        the search field should be set to. Usually this is the remainder, of any, of the string after
+                        the tokens have been stripped. If <code>undefined</code> or <code>null</code> is returned the
+                        input of the search field is unchanged.</code></td></tr>
+                </table>
 
-    The default tokenizer will only be used if the <code>tokenSeparators</code> and <code>createSearchChoice</code>
-    options are specified. The default tokenizer will split the string using any separator in <code>tokenSeparators</code>
-    and will create and select choice objects using <code>createSearchChoice</code> option. It will also
-    ignore duplicates, silently swallowing those tokens.
-</td></tr>
-<tr id="doc-tokenSeparators"><td>tokenSeparators</td><td>array</td><td>
-    An array of strings that define token separators for the default <a href="doc-tokenizer">tokenizer</a>
-    function. By default, this option is set to an empty array which means tokenization using the default
-    tokenizer is disabled. Usually it is sensible to set this option to a value similar to <code>[',', ' ']</code>
-</td></tr>
+                The default tokenizer will only be used if the <code>tokenSeparators</code> and <code>createSearchChoice</code>
+                options are specified. The default tokenizer will split the string using any separator in <code>tokenSeparators</code>
+                and will create and select choice objects using <code>createSearhChoice</code> option. It will also
+                ignore duplicates, silently swallowing those tokens.
+            </td></tr>
+            <tr id="doc-tokenSeparators"><td>tokenSeparators</td><td>array</td><td>
+                An array of strings that define token separators for the default <a href="doc-tokenizer">tokenizer</a>
+                function. By default, this option is set to an empty array which means tokenization using the default
+                tokenizer is disabled. Usually it is sensible to set this option to a value similar to <code>[',', ' ']</code>
+            </td></tr>
 
-<tr id="doc-query">
-    <td>query</td>
-    <td>function</td>
-    <td>
-        Function used to query results for the search term.
-        <pre>query(options)</pre>
-        <table class="table table-bordered table-striped">
-            <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-            <tr><td>options.term</td><td>string</td><td>Search string entered by user</td></tr>
-            <tr><td>options.page</td><td>int</td><td>1-based page number tracked by Select2 for use with infinite scrolling of results</td></tr>
-            <tr><td>options.context</td><td>object</td><td>An object that persists across the lifecycle of queries for the same search term (the query to retrieve the initial results, and subsequent queries to retrieve more result pages for the same search term). When this function is first called for a new search term this object will be null. The user may choose to set any object in the <code>results.context</code> field - this object will then be used as the context parameter for all calls to the <code>query</code> method that will load more search results for the initial search term. The object will be reset back to null when a new search term is queried. This feature is useful when a page number is not easily mapped against the server side paging mechanism. For example, some server side paging mechanism may return a &quot;continuation token&quot; that needs to be passed back to them in order to retrieve the next page of search results.</td></tr>
-            <tr id="doc-query-options-callback"><td>options.callback</td><td>function</td>
-                <td>Callback function that should be called with the <code>result</code> object. The result object:
+            <tr id="doc-query">
+                <td>query</td>
+                <td>function</td>
+                <td>
+                    Function used to query results for the search term.
+                    <pre>query(options)</pre>
                     <table class="table table-bordered table-striped">
                         <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-                        <tr><td>result.results</td><td>[object]</td><td>Array of result objects. The default renderers expect objects with <code>id</code> and <code>text</code> keys</code>. The <code>id</code> attribute is required</code>, even if custom renderers are used. The object may also contain a <code>children</code>key if hierarchical data is displayed.</td></tr>
-                        <tr><td>result.more</td><td>boolean</td><td><code>true</code>if more results are available for the current search term</td></tr>
-                        <tr><td>results.context</td><td>object</td><td>A user-defined object that should be made available as the <code>context</code> parameter to the <code>query</code> function on subsequent queries to load more result pages for the same search term. See the description of <a href="#doc-query-options-context">options.context</code></a> parameter.</td></tr>
+                        <tr><td>options.term</td><td>string</td><td>Search string entered by user</td></tr>
+                        <tr><td>options.page</td><td>int</td><td>1-based page number tracked by Select2 for use with infinite scrolling of results</td></tr>
+                        <tr><td>options.context</td><td>object</td><td>An object that persists across the lifecycle of queries for the same search term (the query to retrieve the initial results, and subsequent queries to retrieve more result pages for the same search term). When this function is first called for a new search term this object will be null. The user may choose to set any object in the <code>results.context</code> field - this object will then be used as the context parameter for all calls to the <code>query</code> method that will load more search results for the initial search term. The object will be reset back to null when a new search term is queried. This feature is useful when a page number is not easily mapped against the server side paging mechanism. For example, some server side paging mechanism may return a &quot;continuation token&quot; that needs to be passed back to them in order to retrieve the next page of search results.</td></tr>
+                        <tr id="doc-query-options-callback"><td>options.callback</td><td>function</td>
+                            <td>Callback function that should be called with the <code>result</code> object. The result object:
+                                <table class="table table-bordered table-striped">
+                                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                                    <tr><td>result.results</td><td>[object]</td><td>Array of result objects. The default renderers expect objects with <code>id</code> and <code>text</code> keys</code>. The <code>id</code> attribute is required</code>, even if custom renderers are used. The object may also contain a <code>children</code>key if hierarchical data is displayed.</td></tr>
+                                    <tr><td>result.more</td><td>boolean</td><td><code>true</code>if more results are available for the current search term</td></tr>
+                                    <tr><td>results.context</td><td>object</td><td>A user-defined object that should be made available as the <code>context</code> parameter to the <code>query</code> function on subsequent queries to load more result pages for the same search term. See the description of <a href="#doc-query-options-context">options.context</code></a> parameter.</td></tr>
+                                </table>
+                            </td></tr>
                     </table>
-                </td></tr>
-        </table>
-        <p class="alert alert-warning">In order for this function to work Select2 should be attached to a <code>input type='hidden'</code> tag instead of a <code>select</code>.</p>
-        <p>
-        <h4>Example Data</h4>
+                    <p class="alert alert-warning">In order for this function to work Select2 should be attached to a <code>input type='hidden'</code> tag instead of a <code>select</code>.</p>
+                    <p>
+                        <h4>Example Data</h4>
                         <pre>
 {
      more: false,
@@ -1218,9 +1320,9 @@ $("#tags").select2({
      ]
 }
                         </pre>
-        </p>
-        <p>
-        <h4>Example Hierarchical Data</h4>
+                    </p>
+                    <p>
+                        <h4>Example Hierarchical Data</h4>
                         <pre>
 {
     more: false,
@@ -1235,205 +1337,197 @@ $("#tags").select2({
     ]
 }
                         </pre>
-        </p>
-    </td>
-</tr>
-<tr><td>ajax</td><td>object</td><td>
-    Options for the built in ajax query function. This object acts as a shortcut for having to manually write a function that performs ajax requests. The built-in function supports more advanced features such as throttling and dropping out-of-order responses.
-
-    <table class="table table-bordered table-striped">
-        <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-        <tr><td>transport</td><td>function</td><td>Function that will be used to perform the ajax request. Must be parameter-compatible with <code>$.ajax</code>. Defaults to <code>$.ajax</code> if not specified.
-            Allows the use of various ajax wrapper libraries such as: <a href="http://www.protofunc.com/scripts/jquery/ajaxManager/">AjaxManager</a>. </td></tr>
-        <tr><td>url</td><td>string</td><td>Ajax url</td></tr>
-        <tr><td>dataType</td><td>string</td><td>Data type for the request. <code>ajax</code>, <code>jsonp</code>, other formats supported by jquery</td></tr>
-        <tr><td>quietMillis</td><td>int</td><td>Number of milliseconds to wait for the user to stop typing before issuing the ajax request</td></tr>
-        <tr><td>data</td><td>function</td><td>
-            Function to generate query parameters for the ajax request.
-            <pre>data(term, page)</pre>
-            <table class="table table-bordered table-striped">
-                <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-                <tr><td>term</td><td>string</td><td>Search term</td></tr>
-                <tr><td>page</td><td>int</td><td>1-based page number tracked by Select2 for use with infinite scrolling of results</td></tr>
-                <tr><td>context</td><td>object</td><td>See <a href="#doc-query-options-callback"><code>options.context</code></a> parameter to the <a href="#doc-query"><code>query</code></a> function above.</td></tr>
-                <tr><td>&lt;returns&gt;</td><td>object</td><td>Object containing url paramters</td></tr>
-            </table>
-        </td></tr>
-        <tr><td>results</td><td>function</td><td>
-            Function used to build the query results object from the ajax response
-            <pre>results(data, page)</pre>
-            <table class="table table-bordered table-striped">
-                <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
-                <tr><td>data</td><td>object</td><td>Retrieved data</td></tr>
-                <tr><td>page</td><td>int</td><td>Page number that was passed into the <code>data</code> function above</td></tr>
-                <tr><td>context</td><td>object</td><td>See <a href="#doc-query-options-callback"><code>options.context</code></a> parameter to the <a href="#doc-query"><code>query</code></a> function above.</td></tr>
-                <tr><td>&lt;returns&gt;</td><td>object</td><td>Results object. See &quot;options.callback&quot; in the &quot;query&quot; function for format.</td></tr>
-            </table>
-        </td></tr>
-    </table>
-    <p class="alert alert-warning">In order for this function to work Select2 should be attached to a <code>input type='hidden'</code> tag instead of a <code>select</code>.</p>
-</td></tr>
-<tr><td>data</td><td>array/object</td><td>
-    Options for the built in query function that works with arrays.
-    <p>If this element contains an array, each element in the array must contain <code>id</code> and <code>text</code> keys</p>
-    <p>Alternatively, this element can be specified as an object in which <code>results</code> key must contain the data as an array and a <code>text</code> key can either be the name of the key in data items that contains text or a function that retrieves the text given a data element from the array</p>
-</td></tr>
-<tr><td>tags</td><td>array/function</td><td>
-    Puts Select2 into 'tagging'mode where the user can add new choices and pre-existing tags are provided via
-    this options attribute which is either an <code>array</code> or a <code>function</code> that returns an
-    array of <code>objects</code> or <code>strings</code>. If <code>strings</code> are used instead of <code>objects</code>
-    they will be converted into an object that has an <code>id</code> and <code>text</code> attribute equal
-    to the value of the <code>string</code>.
-</td></tr>
-<tr><td>containerCss</td><td>function/object</td><td>
-    Inline css that will be added to select2's container. Either an object containing css property/value key pairs or a function that returns such an object.
-</td></tr>
-<tr><td>containerCssClass</td><td>function/string</td><td>
-    Css class that will be added to select2's container tag
-</td></tr>
-<tr><td>dropdownCss</td><td>function/object</td><td>
-    Inline css that will be added to select2's dropdown container. Either an object containing css property/value key pairs or a function that returns such an object.
-</td></tr>
-<tr><td>dropdownCssClass</td><td>function/string</td><td>
-    Css class that will be added to select2's dropdown container
-</td></tr>
-<tr><td>escapeMarkup</td><td>function</td><td>
-    <code>String escapeMarkup(String markup)</code>
-    <p>Function used to post-process markup returned from formatter functions. By default this function escapes html entities to prevent javascript injection.</p>
-</td></tr>
-</table>
-
-<div class="row">
-    <div class="span12"><h3>val</h3></div>
-</div>
-<p>Gets or sets the selection. If the <code>value</code> parameter is not specified, the <code>id</code> attribute of the currently selected element is returned. If the <code>value</code> parameter is specified it will become the current selection.</code></p>
-<table class="table table-bordered table-striped">
-    <tr>
-        <th>Parameter</th><th>Type</th><th>Description</th>
-    </tr>
-    <tr><td>value (optional)</td><td>object</td><td>
-
-        <table>
-            <tr>
-                <th></th><th>Single-Valued</th><th>Multi-Valued</th>
-            </tr>
-            <tr>
-                <th>Attached to <code>select</code></th>
-                <td>Value of the <code>value</code> attribute of the <code>option</code> that should be selected</td>
-                <td>Array of the <code>value</code> attributes of the <code>option</code>s that should be selected. <code>null</code> for empty.</td>
-            </tr>
-            <tr>
-                <th>Attached to <code>input[type=hidden]</code></th>
-                <td>Id of the object that should be selected. <code>""</code> to clear. Can only be used if <code>initSelection()</code> was specified.</td>
-                <td>An array of objects ids that should be selected. <code>""</code> to clear. Can only be used if <code>initSelection()</code> was specified.</td>
+                    </p>
+                </td>
             </tr>
+            <tr><td>ajax</td><td>object</td><td>
+                Options for the built in ajax query function. This object acts as a shortcut for having to manually write a function that performs ajax requests. The built-in function supports more advanced features such as throttling and dropping out-of-order responses.
+
+                <table class="table table-bordered table-striped">
+                    <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                    <tr><td>transport</td><td>function</td><td>Function that will be used to perform the ajax request. Must be parameter-compatible with <code>$.ajax</code>. Defaults to <code>$.ajax</code> if not specified.
+                        Allows the use of various ajax wrapper libraries such as: <a href="http://www.protofunc.com/scripts/jquery/ajaxManager/">AjaxManager</a>. </td></tr>
+                    <tr><td>url</td><td>string/function</td><td>String containing the ajax url or a function that returns such a string.</td></tr>
+                    <tr><td>dataType</td><td>string</td><td>Data type for the request. <code>ajax</code>, <code>jsonp</code>, other formats supported by jquery</td></tr>
+                    <tr><td>quietMillis</td><td>int</td><td>Number of milliseconds to wait for the user to stop typing before issuing the ajax request</td></tr>
+                    <tr><td>data</td><td>function</td><td>
+                        Function to generate query parameters for the ajax request.
+                        <pre>data(term, page)</pre>
+                        <table class="table table-bordered table-striped">
+                            <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                            <tr><td>term</td><td>string</td><td>Search term</td></tr>
+                            <tr><td>page</td><td>int</td><td>1-based page number tracked by Select2 for use with infinite scrolling of results</td></tr>
+                            <tr><td>context</td><td>object</td><td>See <a href="#doc-query-options-callback"><code>options.context</code></a> parameter to the <a href="#doc-query"><code>query</code></a> function above.</td></tr>
+                            <tr><td>&lt;returns&gt;</td><td>object</td><td>Object containing url paramters</td></tr>
+                        </table>
+                    </td></tr>
+                    <tr><td>results</td><td>function</td><td>
+                        Function used to build the query results object from the ajax response
+                        <pre>results(data, page)</pre>
+                        <table class="table table-bordered table-striped">
+                            <tr><th>Parameter</th><th>Type</th><th>Description</th></tr>
+                            <tr><td>data</td><td>object</td><td>Retrieved data</td></tr>
+                            <tr><td>page</td><td>int</td><td>Page number that was passed into the <code>data</code> function above</td></tr>
+                            <tr><td>context</td><td>object</td><td>See <a href="#doc-query-options-callback"><code>options.context</code></a> parameter to the <a href="#doc-query"><code>query</code></a> function above.</td></tr>
+                            <tr><td>&lt;returns&gt;</td><td>object</td><td>Results object. See &quot;options.callback&quot; in the &quot;query&quot; function for format.</td></tr>
+                        </table>
+                    </td></tr>
+                </table>
+                <p class="alert alert-warning">In order for this function to work Select2 should be attached to a <code>input type='hidden'</code> tag instead of a <code>select</code>.</p>
+            </td></tr>
+            <tr><td>data</td><td>array/object</td><td>
+                Options for the built in query function that works with arrays.
+                <p>If this element contains an array, each element in the array must contain <code>id</code> and <code>text</code> keys</p>
+                <p>Alternatively, this element can be specified as an object in which <code>results</code> key must contain the data as an array and a <code>text</code> key can either be the name of the key in data items that contains text or a function that retrieves the text given a data element from the array</p>
+            </td></tr>
+            <tr><td>tags</td><td>array/function</td><td>
+                Puts Select2 into 'tagging'mode where the user can add new choices and pre-existing tags are provided via
+                this options attribute which is either an <code>array</code> or a <code>function</code> that returns an
+                array of <code>objects</code> or <code>strings</code>. If <code>strings</code> are used instead of <code>objects</code>
+                they will be converted into an object that has an <code>id</code> and <code>text</code> attribute equal
+                to the value of the <code>string</code>.
+            </td></tr>
+            <tr><td>containerCss</td><td>function/object</td><td>
+                Inline css that will be added to select2's container. Either an object containing css property/value key pairs or a function that returns such an object.
+            </td></tr>
+            <tr><td>containerCssClass</td><td>function/string</td><td>
+                Css class that will be added to select2's container tag
+            </td></tr>
+            <tr><td>dropdownCss</td><td>function/object</td><td>
+                Inline css that will be added to select2's dropdown container. Either an object containing css property/value key pairs or a function that returns such an object.
+            </td></tr>
+            <tr><td>dropdownCssClass</td><td>function/string</td><td>
+                Css class that will be added to select2's dropdown container
+            </td></tr>
+            <tr><td>escapeMarkup</td><td>function</td><td>
+                <code>String escapeMarkup(String markup)</code>
+                <p>Function used to post-process markup returned from formatter functions. By default this function escapes html entities to prevent javascript injection.</p>
+            </td></tr>
+            <tr><td>selectOnBlur</td><td>boolean</td><td>
+                <p>Set to <code>true</code> if you want Select2 to select the currently highlighted option when it is blurred</p>
+            </td></tr>
+            <tr><td>loadMorePadding</td><td>integer</td><td>
+                Defines how many results need to be below the fold before the next page is loaded. The default value is <code>0</code> which means the result list needs to be scrolled all the way to the bottom for the next page of results to be loaded. This option can be used to trigger the load sooner, possibly resulting in a smoother user experience.
+            </td></tr>
 
         </table>
-    </td></tr>
-</table>
-<p><code>val</code> method invoked on a single-select with an unset value will return <code>""</code>, while a <code>val</code> method invoked on an empty multi-select will return <code>[]</code></p>
 
-Example: <pre class="prettyprint">alert("Selected value is: "+$("#e8").select2("val")); $("#e8").select2("val", {id:"CA", text:"Califoria"});</pre>
+      <div class="row">
+          <div class="span12"><h3>val</h3></div>
+      </div>
+      <p>Gets or sets the selection. If the <code>value</code> parameter is not specified, the <code>id</code> attribute of the currently selected element is returned. If the <code>value</code> parameter is specified it will become the current selection.</code></p>
+      <table class="table table-bordered table-striped">
+          <tr>
+              <th>Parameter</th><th>Type</th><th>Description</th>
+          </tr>
+          <tr><td>value (optional)</td><td>object</td><td>
 
-<div class="row">
-    <div class="span12"><h3>data</h3></div>
-</div>
-<p>Gets or sets the selection. Analogous to <code>val</code> method, but works with objects instead of ids.</p>
-<p><code>data</code> method invoked on a single-select with an unset value will return <code>null</code>, while a <code>data</code> method invoked on an empty multi-select will return <code>[]</code></p>
+              <table>
+                    <tr>
+                        <th></th><th>Single-Valued</th><th>Multi-Valued</th>
+                    </tr>
+                    <tr>
+                        <th>Attached to <code>select</code></th>
+                        <td>Value of the <code>value</code> attribute of the <code>option</code> that should be selected</td>
+                        <td>Array of the <code>value</code> attributes of the <code>option</code>s that should be selected. <code>null</code> for empty.</td>
+                    </tr>
+                  <tr>
+                      <th>Attached to <code>input[type=hidden]</code></th>
+                      <td>Id of the object that should be selected. <code>""</code> to clear. Can only be used if <code>initSelection()</code> was specified.</td>
+                      <td>An array of objects ids that should be selected. <code>""</code> to clear. Can only be used if <code>initSelection()</code> was specified.</td>
+                  </tr>
+
+              </table>
+          </td></tr>
+          <tr><td>triggerChange (optional)</td><td>boolean</td><td>Whether or not a <code>change</code> event should be triggered. <code>false</code> by default.</code></td></tr>
+      </table>
+        <p><code>val</code> method invoked on a single-select with an unset value will return <code>""</code>, while a <code>val</code> method invoked on an empty multi-select will return <code>[]</code></p>
+
+        Example: <pre class="prettyprint">alert("Selected value is: "+$("#e8").select2("val")); $("#e8").select2("val", {id:"CA", text:"Califoria"});</pre>
+
+        <div class="row">
+            <div class="span12"><h3>data</h3></div>
+        </div>
+        <p>Gets or sets the selection. Analogous to <code>val</code> method, but works with objects instead of ids.</p>
+        <p><code>data</code> method invoked on a single-select with an unset value will return <code>null</code>, while a <code>data</code> method invoked on an empty multi-select will return <code>[]</code></p>
 
 
-<div class="row">
-    <div class="span12"><h3>destroy</h3></div>
-</div>
-<p>Reverts changes to DOM done by Select2. Any selection done via Select2 will be preserved.</p>
+    <div class="row">
+        <div class="span12"><h3>destroy</h3></div>
+    </div>
+    <p>Reverts changes to DOM done by Select2. Any selection done via Select2 will be preserved.</p>
 
-<div class="row">
-    <div class="span12"><h3>open</h3></div>
-</div>
-<p>Opens the dropdown</p>
-<div class="row">
-    <div class="span12"><h3>close</h3></div>
-</div>
-<p>Closes the dropdown</p>
-<div class="row">
-    <div class="span12"><h3>disable</h3></div>
-</div>
-<p>Disables Select2. During this mode the user is not allowed to manipulate the selection.</p>
-<div class="row">
-    <div class="span12"><h3>enable</h3></div>
-</div>
-<p>Enables Select2.</p>
+    <div class="row">
+        <div class="span12"><h3>open</h3></div>
+    </div>
+    <p>Opens the dropdown</p>
+    <div class="row">
+        <div class="span12"><h3>close</h3></div>
+    </div>
+    <p>Closes the dropdown</p>
+    <div class="row">
+        <div class="span12"><h3>disable</h3></div>
+    </div>
+    <p>Disables Select2. During this mode the user is not allowed to manipulate the selection.</p>
+    <div class="row">
+        <div class="span12"><h3>enable</h3></div>
+    </div>
+    <p>Enables Select2.</p>
 
-<div class="row">
+    <div class="row">
     <div class="span12"><h3>container</h3></div>
-</div>
-<p>Retrieves the main container element that wraps all of DOM added by Select2
-    Example: <code>console.log($("#tags").select2("container"));</code></p>
-<div class="row">
-    <div class="span12"><h3>onSortStart</h3></div>
-</div>
-<p>Notifies Select2 that a drag and drop sorting operation has started. Select2 will hide all non-selection list items such as the search container, etc.
-    Example: <code>$("#tags").select2("onSortStart");</code></p>
-<div class="row">
-    <div class="span12"><h3>onSortEnd</h3></div>
-</div>
-<p>Notifies Select2 that a drag and drop sorting operation has finished. Select2 will re-display any elements previously hidden and update the selection of the element it is attached to.
-    Example: <code>$("#tags").select2("onSortEnd");</code>
-</p>
-<div class="row">
-    <div class="span12"><h3>focus</h3></div>
-</div>
-<p>Focuses on a specific dropdown.</code>
-</p>
-<div class="row">
-    <div class="span12"><h3>isFocused</h3></div>
-</div>
-<p>Checks if a dropdown is focused.
-</p>
-
-
-<div class="row">
-    <div class="span12"><h2>Events</h2></div>
-</div>
-
-<div class="row">
-    <div class="span12">
-        <h3>change</h3>
-        <p>Fired when selection is changed.</p>
-        <p class="alert alert-info">This event is not fired when the selection is changed using Select2's <code>val()</code> method.</p>
-        <p>The event object contains the following custom properties:
-        <dl>
-            <dt>val</dt><dd>the current selection (taking into account the result of the change) - id or array of ids</dd>
-            <dt>added</dt><dd>the added element, if any - the full element object, not just the id</dd>
-            <dt>removed</dt><dd>the removed element, if any - the full element object, not just the id</dd>
-        </dl>
-        </p>
     </div>
-</div>
-<div class="row zebra">
-    <div class="span12">
-        <h3>open</h3>
-        <p>Fired when the dropdown is shown.</p>
-        <p>The event listener can prevent the opening by calling <code>preventDefault()</code> on the supplied event object.</p>
-        </p>
+    <p>Retrieves the main container element that wraps all of DOM added by Select2
+        Example: <code>console.log($("#tags").select2("container"));</code></p>
+    <div class="row">
+        <div class="span12"><h3>onSortStart</h3></div>
     </div>
-</div>
-<div class="row">
-  <div class="span12">
-    <h3>close</h3>
-    <p>Fired when the dropdown is closed (whether by selection or cancellation).</p>
-  </div>
-</div>
-
-</section>
-
-<div class="row">
-    <div class="span12">
-        <h3>Configuring Defaults</h3>
-        Select2 exposes its default options via the <code>$.fn.select2.defaults</code> object. Properties changed in this object (same properties configurable through the constructor) will take effect for every instance created after the change
-
+    <p>Notifies Select2 that a drag and drop sorting operation has started. Select2 will hide all non-selection list items such as the search container, etc.
+        Example: <code>$("#tags").select2("onSortStart");</code></p>
+    <div class="row">
+        <div class="span12"><h3>onSortEnd</h3></div>
+    </div>
+    <p>Notifies Select2 that a drag and drop sorting operation has finished. Select2 will re-display any elements previously hidden and update the selection of the element it is attached to.
+        Example: <code>$("#tags").select2("onSortEnd");</code>
+    </p>
+
+
+        <div class="row">
+          <div class="span12"><h2>Events</h2></div>
+      </div>
+
+      <div class="row">
+          <div class="span12">
+              <h3>change</h3>
+              <p>Fired when selection is changed.</p>
+              <p class="alert alert-info">This event is not fired when the selection is changed using Select2's <code>val()</code> method.</p>
+              <p>The event object contains the following custom properties:
+              <dl>
+              <dt>val</dt><dd>the current selection (taking into account the result of the change) - id or array of ids</dd>
+              <dt>added</dt><dd>the added element, if any - the full element object, not just the id</dd>
+              <dt>removed</dt><dd>the removed element, if any - the full element object, not just the id</dd>
+                </dl>
+              </p>
+          </div>
+      </div>
+        <div class="row zebra">
+            <div class="span12">
+                <h3>open</h3>
+                <p>Fired when the dropdown is shown.</p>
+                <p>The event listener can prevent the opening by calling <code>preventDefault()</code> on the supplied event object.</p>
+                </p>
+            </div>
+        </div>
+
+      </section>
+
+    <div class="row">
+        <div class="span12">
+            <h3>Configuring Defaults</h3>
+            Select2 exposes its default options via the <code>$.fn.select2.defaults</code> object. Properties changed in this object (same properties configurable through the constructor) will take effect for every instance created after the change
+
+        </div>
     </div>
-</div>
 
 <!--
 <div style="position: absolute; left:0; top:0; background: white; border: 1px solid red;" id="focus-spy">hello there</div>
diff --git a/select2-3.3.0/LICENSE b/select2-3.3.0/LICENSE
new file mode 100755
index 00000000..df5cc0c9
--- /dev/null
+++ b/select2-3.3.0/LICENSE
@@ -0,0 +1,485 @@
+Copyright 2012 Igor Vaynberg
+ 
+Version: @@ver@@ Timestamp: @@timestamp@@
+
+This software is licensed under the Apache License, Version 2.0 (the "Apache License") or the GNU 
+General Public License version 2 (the "GPL License"). You may choose either license to govern your 
+use of this software only upon the condition that you accept all of the terms of either the Apache 
+License or the GPL License. 
+
+You may obtain a copy of the Apache License and the GPL License at:
+
+http://www.apache.org/licenses/LICENSE-2.0
+http://www.gnu.org/licenses/gpl-2.0.html
+
+Unless required by applicable law or agreed to in writing, software distributed under the Apache License 
+or the GPL Licesnse is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, 
+either express or implied. See the Apache License and the GPL License for the specific language governing 
+permissions and limitations under the Apache License and the GPL License.
+
+LICENSE #1: Apache License, Version 2.0
+
+LICENSE #2: GPL v2
+
+************************************************************
+
+LICENSE #1:
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+************************************************************
+
+LICENSE #2:
+
+                    GNU GENERAL PUBLIC LICENSE
+                       Version 2, June 1991
+
+ Copyright (C) 1989, 1991 Free Software Foundation, Inc.,
+ 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The licenses for most software are designed to take away your
+freedom to share and change it.  By contrast, the GNU General Public
+License is intended to guarantee your freedom to share and change free
+software--to make sure the software is free for all its users.  This
+General Public License applies to most of the Free Software
+Foundation's software and to any other program whose authors commit to
+using it.  (Some other Free Software Foundation software is covered by
+the GNU Lesser General Public License instead.)  You can apply it to
+your programs, too.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+this service if you wish), that you receive source code or can get it
+if you want it, that you can change the software or use pieces of it
+in new free programs; and that you know you can do these things.
+
+  To protect your rights, we need to make restrictions that forbid
+anyone to deny you these rights or to ask you to surrender the rights.
+These restrictions translate to certain responsibilities for you if you
+distribute copies of the software, or if you modify it.
+
+  For example, if you distribute copies of such a program, whether
+gratis or for a fee, you must give the recipients all the rights that
+you have.  You must make sure that they, too, receive or can get the
+source code.  And you must show them these terms so they know their
+rights.
+
+  We protect your rights with two steps: (1) copyright the software, and
+(2) offer you this license which gives you legal permission to copy,
+distribute and/or modify the software.
+
+  Also, for each author's protection and ours, we want to make certain
+that everyone understands that there is no warranty for this free
+software.  If the software is modified by someone else and passed on, we
+want its recipients to know that what they have is not the original, so
+that any problems introduced by others will not reflect on the original
+authors' reputations.
+
+  Finally, any free program is threatened constantly by software
+patents.  We wish to avoid the danger that redistributors of a free
+program will individually obtain patent licenses, in effect making the
+program proprietary.  To prevent this, we have made it clear that any
+patent must be licensed for everyone's free use or not licensed at all.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                    GNU GENERAL PUBLIC LICENSE
+   TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
+
+  0. This License applies to any program or other work which contains
+a notice placed by the copyright holder saying it may be distributed
+under the terms of this General Public License.  The "Program", below,
+refers to any such program or work, and a "work based on the Program"
+means either the Program or any derivative work under copyright law:
+that is to say, a work containing the Program or a portion of it,
+either verbatim or with modifications and/or translated into another
+language.  (Hereinafter, translation is included without limitation in
+the term "modification".)  Each licensee is addressed as "you".
+
+Activities other than copying, distribution and modification are not
+covered by this License; they are outside its scope.  The act of
+running the Program is not restricted, and the output from the Program
+is covered only if its contents constitute a work based on the
+Program (independent of having been made by running the Program).
+Whether that is true depends on what the Program does.
+
+  1. You may copy and distribute verbatim copies of the Program's
+source code as you receive it, in any medium, provided that you
+conspicuously and appropriately publish on each copy an appropriate
+copyright notice and disclaimer of warranty; keep intact all the
+notices that refer to this License and to the absence of any warranty;
+and give any other recipients of the Program a copy of this License
+along with the Program.
+
+You may charge a fee for the physical act of transferring a copy, and
+you may at your option offer warranty protection in exchange for a fee.
+
+  2. You may modify your copy or copies of the Program or any portion
+of it, thus forming a work based on the Program, and copy and
+distribute such modifications or work under the terms of Section 1
+above, provided that you also meet all of these conditions:
+
+    a) You must cause the modified files to carry prominent notices
+    stating that you changed the files and the date of any change.
+
+    b) You must cause any work that you distribute or publish, that in
+    whole or in part contains or is derived from the Program or any
+    part thereof, to be licensed as a whole at no charge to all third
+    parties under the terms of this License.
+
+    c) If the modified program normally reads commands interactively
+    when run, you must cause it, when started running for such
+    interactive use in the most ordinary way, to print or display an
+    announcement including an appropriate copyright notice and a
+    notice that there is no warranty (or else, saying that you provide
+    a warranty) and that users may redistribute the program under
+    these conditions, and telling the user how to view a copy of this
+    License.  (Exception: if the Program itself is interactive but
+    does not normally print such an announcement, your work based on
+    the Program is not required to print an announcement.)
+
+These requirements apply to the modified work as a whole.  If
+identifiable sections of that work are not derived from the Program,
+and can be reasonably considered independent and separate works in
+themselves, then this License, and its terms, do not apply to those
+sections when you distribute them as separate works.  But when you
+distribute the same sections as part of a whole which is a work based
+on the Program, the distribution of the whole must be on the terms of
+this License, whose permissions for other licensees extend to the
+entire whole, and thus to each and every part regardless of who wrote it.
+
+Thus, it is not the intent of this section to claim rights or contest
+your rights to work written entirely by you; rather, the intent is to
+exercise the right to control the distribution of derivative or
+collective works based on the Program.
+
+In addition, mere aggregation of another work not based on the Program
+with the Program (or with a work based on the Program) on a volume of
+a storage or distribution medium does not bring the other work under
+the scope of this License.
+
+  3. You may copy and distribute the Program (or a work based on it,
+under Section 2) in object code or executable form under the terms of
+Sections 1 and 2 above provided that you also do one of the following:
+
+    a) Accompany it with the complete corresponding machine-readable
+    source code, which must be distributed under the terms of Sections
+    1 and 2 above on a medium customarily used for software interchange; or,
+
+    b) Accompany it with a written offer, valid for at least three
+    years, to give any third party, for a charge no more than your
+    cost of physically performing source distribution, a complete
+    machine-readable copy of the corresponding source code, to be
+    distributed under the terms of Sections 1 and 2 above on a medium
+    customarily used for software interchange; or,
+
+    c) Accompany it with the information you received as to the offer
+    to distribute corresponding source code.  (This alternative is
+    allowed only for noncommercial distribution and only if you
+    received the program in object code or executable form with such
+    an offer, in accord with Subsection b above.)
+
+The source code for a work means the preferred form of the work for
+making modifications to it.  For an executable work, complete source
+code means all the source code for all modules it contains, plus any
+associated interface definition files, plus the scripts used to
+control compilation and installation of the executable.  However, as a
+special exception, the source code distributed need not include
+anything that is normally distributed (in either source or binary
+form) with the major components (compiler, kernel, and so on) of the
+operating system on which the executable runs, unless that component
+itself accompanies the executable.
+
+If distribution of executable or object code is made by offering
+access to copy from a designated place, then offering equivalent
+access to copy the source code from the same place counts as
+distribution of the source code, even though third parties are not
+compelled to copy the source along with the object code.
+
+  4. You may not copy, modify, sublicense, or distribute the Program
+except as expressly provided under this License.  Any attempt
+otherwise to copy, modify, sublicense or distribute the Program is
+void, and will automatically terminate your rights under this License.
+However, parties who have received copies, or rights, from you under
+this License will not have their licenses terminated so long as such
+parties remain in full compliance.
+
+  5. You are not required to accept this License, since you have not
+signed it.  However, nothing else grants you permission to modify or
+distribute the Program or its derivative works.  These actions are
+prohibited by law if you do not accept this License.  Therefore, by
+modifying or distributing the Program (or any work based on the
+Program), you indicate your acceptance of this License to do so, and
+all its terms and conditions for copying, distributing or modifying
+the Program or works based on it.
+
+  6. Each time you redistribute the Program (or any work based on the
+Program), the recipient automatically receives a license from the
+original licensor to copy, distribute or modify the Program subject to
+these terms and conditions.  You may not impose any further
+restrictions on the recipients' exercise of the rights granted herein.
+You are not responsible for enforcing compliance by third parties to
+this License.
+
+  7. If, as a consequence of a court judgment or allegation of patent
+infringement or for any other reason (not limited to patent issues),
+conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot
+distribute so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you
+may not distribute the Program at all.  For example, if a patent
+license would not permit royalty-free redistribution of the Program by
+all those who receive copies directly or indirectly through you, then
+the only way you could satisfy both it and this License would be to
+refrain entirely from distribution of the Program.
+
+If any portion of this section is held invalid or unenforceable under
+any particular circumstance, the balance of the section is intended to
+apply and the section as a whole is intended to apply in other
+circumstances.
+
+It is not the purpose of this section to induce you to infringe any
+patents or other property right claims or to contest validity of any
+such claims; this section has the sole purpose of protecting the
+integrity of the free software distribution system, which is
+implemented by public license practices.  Many people have made
+generous contributions to the wide range of software distributed
+through that system in reliance on consistent application of that
+system; it is up to the author/donor to decide if he or she is willing
+to distribute software through any other system and a licensee cannot
+impose that choice.
+
+This section is intended to make thoroughly clear what is believed to
+be a consequence of the rest of this License.
+
+  8. If the distribution and/or use of the Program is restricted in
+certain countries either by patents or by copyrighted interfaces, the
+original copyright holder who places the Program under this License
+may add an explicit geographical distribution limitation excluding
+those countries, so that distribution is permitted only in or among
+countries not thus excluded.  In such case, this License incorporates
+the limitation as if written in the body of this License.
+
+  9. The Free Software Foundation may publish revised and/or new versions
+of the General Public License from time to time.  Such new versions will
+be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+Each version is given a distinguishing version number.  If the Program
+specifies a version number of this License which applies to it and "any
+later version", you have the option of following the terms and conditions
+either of that version or of any later version published by the Free
+Software Foundation.  If the Program does not specify a version number of
+this License, you may choose any version ever published by the Free Software
+Foundation.
+
+  10. If you wish to incorporate parts of the Program into other free
+programs whose distribution conditions are different, write to the author
+to ask for permission.  For software which is copyrighted by the Free
+Software Foundation, write to the Free Software Foundation; we sometimes
+make exceptions for this.  Our decision will be guided by the two goals
+of preserving the free status of all derivatives of our free software and
+of promoting the sharing and reuse of software generally.
+
+                            NO WARRANTY
+
+  11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY
+FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW.  EXCEPT WHEN
+OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES
+PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED
+OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE.  THE ENTIRE RISK AS
+TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU.  SHOULD THE
+PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING,
+REPAIR OR CORRECTION.
+
+  12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR
+REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES,
+INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING
+OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED
+TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY
+YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER
+PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE
+POSSIBILITY OF SUCH DAMAGES.
+
diff --git a/select2-3.3.0/README.md b/select2-3.3.0/README.md
new file mode 100755
index 00000000..31025c75
--- /dev/null
+++ b/select2-3.3.0/README.md
@@ -0,0 +1,74 @@
+Select2
+=================
+
+Select2 is a jQuery based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results. Look and feel of Select2 is based on the excellent [Chosen](http://harvesthq.github.com/chosen/) library.
+
+To get started -- checkout http://ivaynberg.github.com/select2!
+
+What Does Select2 Support That Chosen Does Not?
+-------------------------------------------------
+
+* Working with large datasets: Chosen requires the entire dataset to be loaded as `option` tags in the DOM, which limits
+it to working with small-ish datasets. Select2 uses a function to find results on-the-fly, which allows it to partially
+load results.
+* Paging of results: Since Select2 works with large datasets and only loads a small amount of matching results at a time
+it has to support paging. Select2 will call the search function when the user scrolls to the bottom of currently loaded
+result set allowing for the 'infinite scrolling' of results.
+* Custom markup for results: Chosen only supports rendering text results because that is the only markup supported by
+`option` tags. Select2 provides an extension point which can be used to produce any kind of markup to represent results.
+* Ability to add results on the fly: Select2 provides the ability to add results from the search term entered by the user, which allows it to be used for
+tagging.
+
+Browser Compatibility
+--------------------
+* IE 8+ (7 mostly works except for [issue with z-index](https://github.com/ivaynberg/select2/issues/37))
+* Chrome 8+
+* Firefox 3.5+
+* Safari 3+
+* Opera 10.6+
+
+Integrations
+------------
+
+* [Wicket-Select2](https://github.com/ivaynberg/wicket-select2) (Java / Apache Wicket)
+* [select2-rails](https://github.com/argerim/select2-rails) (Ruby on Rails)
+* [AngularUI](http://angular-ui.github.com/#directives-select2) ([AngularJS](angularjs.org))
+* [Django](https://github.com/applegrew/django-select2)
+
+Bug tracker
+-----------
+
+Have a bug? Please create an issue here on GitHub!
+
+https://github.com/ivaynberg/select2/issues
+
+
+Mailing list
+------------
+
+Have a question? Ask on our mailing list!
+
+select2@googlegroups.com
+
+https://groups.google.com/d/forum/select2
+
+
+Copyright and License
+---------------------
+
+Copyright 2012 Igor Vaynberg
+
+This software is licensed under the Apache License, Version 2.0 (the "Apache License") or the GNU 
+General Public License version 2 (the "GPL License"). You may choose either license to govern your 
+use of this software only upon the condition that you accept all of the terms of either the Apache 
+License or the GPL License. 
+
+You may obtain a copy of the Apache License and the GPL License in the LICENSE file, or at:
+
+http://www.apache.org/licenses/LICENSE-2.0
+http://www.gnu.org/licenses/gpl-2.0.html
+
+Unless required by applicable law or agreed to in writing, software distributed under the Apache License 
+or the GPL Licesnse is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, 
+either express or implied. See the Apache License and the GPL License for the specific language governing 
+permissions and limitations under the Apache License and the GPL License.
\ No newline at end of file
diff --git a/select2-3.3.0/component.json b/select2-3.3.0/component.json
new file mode 100755
index 00000000..c2d5df1c
--- /dev/null
+++ b/select2-3.3.0/component.json
@@ -0,0 +1,8 @@
+{
+    "name": "select2",
+    "version": "3.3.0",
+    "main": ["select2.js", "select2.css", "select2.png", "select2x2.png", "spinner.gif"],
+    "dependencies": {
+        "jquery": "~1.4.4"
+    }
+}
diff --git a/select2-3.3.0/release.sh b/select2-3.3.0/release.sh
new file mode 100755
index 00000000..3b007ed9
--- /dev/null
+++ b/select2-3.3.0/release.sh
@@ -0,0 +1,72 @@
+#!/bin/bash
+set -e
+
+echo -n "Enter the version for this release: "
+
+read ver
+
+if [ ! $ver ]; then 
+	echo "Invalid version."
+	exit
+fi
+
+name="select2"
+js="$name.js"
+mini="$name.min.js"
+css="$name.css"
+release="$name-$ver"
+tag="$ver"
+branch="build-$ver"
+curbranch=`git branch | grep "*" | sed "s/* //"`
+timestamp=$(date)
+tokens="s/@@ver@@/$ver/g;s/\@@timestamp@@/$timestamp/g"
+remote="github"
+
+echo "Updating Version Identifiers"
+
+sed -E -e "s/\"version\": \"([0-9\.]+)\",/\"version\": \"$ver\",/g" -i "" component.json select2.jquery.json
+git add component.json
+git add select2.jquery.json
+git commit -m "modified version identifiers in descriptors for release $ver"
+git push
+ 
+git branch "$branch"
+git checkout "$branch"
+
+echo "Tokenizing..."
+
+find . -name "$js" | xargs -I{} sed -e "$tokens" -i "" {} 
+find . -name "$css" | xargs -I{} sed -e "$tokens" -i "" {}
+sed -e "s/latest/$ver/g" -i "" component.json
+
+git add "$js"
+git add "$css"
+
+echo "Minifying..."
+
+echo "/*" > "$mini"
+cat LICENSE | sed "$tokens" >> "$mini"
+echo "*/" >> "$mini"
+
+curl -s \
+	-d compilation_level=SIMPLE_OPTIMIZATIONS \
+	-d output_format=text \
+	-d output_info=compiled_code \
+	--data-urlencode "js_code@$js" \
+	http://closure-compiler.appspot.com/compile \
+	>> "$mini"
+
+git add "$mini"
+	
+git commit -m "release $ver"
+
+echo "Tagging..."
+git tag -a "$tag" -m "tagged version $ver"
+git push "$remote" --tags
+
+echo "Cleaning Up..."
+
+git checkout "$curbranch"
+git branch -D "$branch"
+
+echo "Done"
diff --git a/select2-3.3.0/select2-spinner.gif b/select2-3.3.0/select2-spinner.gif
new file mode 100755
index 00000000..5b33f7e5
Binary files /dev/null and b/select2-3.3.0/select2-spinner.gif differ
diff --git a/select2-3.3.0/select2.css b/select2-3.3.0/select2.css
new file mode 100755
index 00000000..1125546a
--- /dev/null
+++ b/select2-3.3.0/select2.css
@@ -0,0 +1,589 @@
+/*
+Version: 3.3.0 Timestamp: Tue Feb  5 18:33:54 PST 2013
+*/
+.select2-container {
+    position: relative;
+    display: inline-block;
+    /* inline-block for ie7 */
+    zoom: 1;
+    *display: inline;
+    vertical-align: top;
+}
+
+.select2-container,
+.select2-drop,
+.select2-search,
+.select2-search input{
+  /*
+    Force border-box so that % widths fit the parent
+    container without overlap because of margin/padding.
+
+    More Info : http://www.quirksmode.org/css/box.html
+  */
+  -webkit-box-sizing: border-box; /* webkit */
+   -khtml-box-sizing: border-box; /* konqueror */
+     -moz-box-sizing: border-box; /* firefox */
+      -ms-box-sizing: border-box; /* ie */
+          box-sizing: border-box; /* css3 */
+}
+
+.select2-container .select2-choice {
+    display: block;
+    height: 26px;
+    padding: 0 0 0 8px;
+    overflow: hidden;
+    position: relative;
+
+    border: 1px solid #aaa;
+    white-space: nowrap;
+    line-height: 26px;
+    color: #444;
+    text-decoration: none;
+
+    -webkit-border-radius: 4px;
+       -moz-border-radius: 4px;
+            border-radius: 4px;
+
+    -webkit-background-clip: padding-box;
+       -moz-background-clip: padding;
+            background-clip: padding-box;
+
+    background-color: #fff;
+    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eeeeee), color-stop(0.5, white));
+    background-image: -webkit-linear-gradient(center bottom, #eeeeee 0%, white 50%);
+    background-image: -moz-linear-gradient(center bottom, #eeeeee 0%, white 50%);
+    background-image: -o-linear-gradient(bottom, #eeeeee 0%, #ffffff 50%);
+    background-image: -ms-linear-gradient(top, #ffffff 0%, #eeeeee 50%);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#eeeeee', GradientType = 0);
+    background-image: linear-gradient(top, #ffffff 0%, #eeeeee 50%);
+}
+
+.select2-container.select2-drop-above .select2-choice {
+    border-bottom-color: #aaa;
+
+    -webkit-border-radius:0 0 4px 4px;
+       -moz-border-radius:0 0 4px 4px;
+            border-radius:0 0 4px 4px;
+
+    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eeeeee), color-stop(0.9, white));
+    background-image: -webkit-linear-gradient(center bottom, #eeeeee 0%, white 90%);
+    background-image: -moz-linear-gradient(center bottom, #eeeeee 0%, white 90%);
+    background-image: -o-linear-gradient(bottom, #eeeeee 0%, white 90%);
+    background-image: -ms-linear-gradient(top, #eeeeee 0%,#ffffff 90%);
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 );
+    background-image: linear-gradient(top, #eeeeee 0%,#ffffff 90%);
+}
+
+.select2-container .select2-choice span {
+    margin-right: 26px;
+    display: block;
+    overflow: hidden;
+
+    white-space: nowrap;
+
+    -ms-text-overflow: ellipsis;
+     -o-text-overflow: ellipsis;
+        text-overflow: ellipsis;
+}
+
+.select2-container .select2-choice abbr {
+    display: block;
+    width: 12px;
+    height: 12px;
+    position: absolute;
+    right: 26px;
+    top: 8px;
+
+    font-size: 1px;
+    text-decoration: none;
+
+    border: 0;
+    background: url('select2.png') right top no-repeat;
+    cursor: pointer;
+    outline: 0;
+}
+.select2-container .select2-choice abbr:hover {
+    background-position: right -11px;
+    cursor: pointer;
+}
+
+.select2-drop-mask {
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 9998;
+    opacity: 0;
+}
+
+.select2-drop {
+    width: 100%;
+    margin-top:-1px;
+    position: absolute;
+    z-index: 9999;
+    top: 100%;
+
+    background: #fff;
+    color: #000;
+    border: 1px solid #aaa;
+    border-top: 0;
+
+    -webkit-border-radius: 0 0 4px 4px;
+       -moz-border-radius: 0 0 4px 4px;
+            border-radius: 0 0 4px 4px;
+
+    -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
+       -moz-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
+         -o-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
+            box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
+}
+
+.select2-drop.select2-drop-above {
+    margin-top: 1px;
+    border-top: 1px solid #aaa;
+    border-bottom: 0;
+
+    -webkit-border-radius: 4px 4px 0 0;
+       -moz-border-radius: 4px 4px 0 0;
+            border-radius: 4px 4px 0 0;
+
+    -webkit-box-shadow: 0 -4px 5px rgba(0, 0, 0, .15);
+       -moz-box-shadow: 0 -4px 5px rgba(0, 0, 0, .15);
+         -o-box-shadow: 0 -4px 5px rgba(0, 0, 0, .15);
+            box-shadow: 0 -4px 5px rgba(0, 0, 0, .15);
+}
+
+.select2-container .select2-choice div {
+    display: block;
+    width: 18px;
+    height: 100%;
+    position: absolute;
+    right: 0;
+    top: 0;
+
+    border-left: 1px solid #aaa;
+    -webkit-border-radius: 0 4px 4px 0;
+       -moz-border-radius: 0 4px 4px 0;
+            border-radius: 0 4px 4px 0;
+
+    -webkit-background-clip: padding-box;
+       -moz-background-clip: padding;
+            background-clip: padding-box;
+
+    background: #ccc;
+    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ccc), color-stop(0.6, #eee));
+    background-image: -webkit-linear-gradient(center bottom, #ccc 0%, #eee 60%);
+    background-image: -moz-linear-gradient(center bottom, #ccc 0%, #eee 60%);
+    background-image: -o-linear-gradient(bottom, #ccc 0%, #eee 60%);
+    background-image: -ms-linear-gradient(top, #cccccc 0%, #eeeeee 60%);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#eeeeee', endColorstr = '#cccccc', GradientType = 0);
+    background-image: linear-gradient(top, #cccccc 0%, #eeeeee 60%);
+}
+
+.select2-container .select2-choice div b {
+    display: block;
+    width: 100%;
+    height: 100%;
+    background: url('select2.png') no-repeat 0 1px;
+}
+
+.select2-search {
+    display: inline-block;
+    width: 100%;
+    min-height: 26px;
+    margin: 0;
+    padding-left: 4px;
+    padding-right: 4px;
+
+    position: relative;
+    z-index: 10000;
+
+    white-space: nowrap;
+}
+
+.select2-search-hidden {
+    display: block;
+    position: absolute;
+    left: -10000px;
+}
+
+.select2-search input {
+    width: 100%;
+    height: auto !important;
+    min-height: 26px;
+    padding: 4px 20px 4px 5px;
+    margin: 0;
+
+    outline: 0;
+    font-family: sans-serif;
+    font-size: 1em;
+
+    border: 1px solid #aaa;
+    -webkit-border-radius: 0;
+       -moz-border-radius: 0;
+            border-radius: 0;
+
+    -webkit-box-shadow: none;
+       -moz-box-shadow: none;
+            box-shadow: none;
+
+    background: #fff url('select2.png') no-repeat 100% -22px;
+    background: url('select2.png') no-repeat 100% -22px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee));
+    background: url('select2.png') no-repeat 100% -22px, -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%);
+    background: url('select2.png') no-repeat 100% -22px, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%);
+    background: url('select2.png') no-repeat 100% -22px, -o-linear-gradient(bottom, white 85%, #eeeeee 99%);
+    background: url('select2.png') no-repeat 100% -22px, -ms-linear-gradient(top, #ffffff 85%, #eeeeee 99%);
+    background: url('select2.png') no-repeat 100% -22px, linear-gradient(top, #ffffff 85%, #eeeeee 99%);
+}
+
+.select2-drop.select2-drop-above .select2-search input {
+    margin-top: 4px;
+}
+
+.select2-search input.select2-active {
+    background: #fff url('select2-spinner.gif') no-repeat 100%;
+    background: url('select2-spinner.gif') no-repeat 100%, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee));
+    background: url('select2-spinner.gif') no-repeat 100%, -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%);
+    background: url('select2-spinner.gif') no-repeat 100%, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%);
+    background: url('select2-spinner.gif') no-repeat 100%, -o-linear-gradient(bottom, white 85%, #eeeeee 99%);
+    background: url('select2-spinner.gif') no-repeat 100%, -ms-linear-gradient(top, #ffffff 85%, #eeeeee 99%);
+    background: url('select2-spinner.gif') no-repeat 100%, linear-gradient(top, #ffffff 85%, #eeeeee 99%);
+}
+
+.select2-container-active .select2-choice,
+.select2-container-active .select2-choices {
+    border: 1px solid #5897fb;
+    outline: none;
+
+    -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
+       -moz-box-shadow: 0 0 5px rgba(0,0,0,.3);
+         -o-box-shadow: 0 0 5px rgba(0,0,0,.3);
+            box-shadow: 0 0 5px rgba(0,0,0,.3);
+}
+
+.select2-dropdown-open .select2-choice {
+    border: 1px solid #aaa;
+    border-bottom-color: transparent;
+    -webkit-box-shadow: 0 1px 0 #fff inset;
+       -moz-box-shadow: 0 1px 0 #fff inset;
+         -o-box-shadow: 0 1px 0 #fff inset;
+            box-shadow: 0 1px 0 #fff inset;
+
+    -webkit-border-bottom-left-radius: 0;
+        -moz-border-radius-bottomleft: 0;
+            border-bottom-left-radius: 0;
+
+    -webkit-border-bottom-right-radius: 0;
+        -moz-border-radius-bottomright: 0;
+            border-bottom-right-radius: 0;
+
+    background-color: #eee;
+    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, white), color-stop(0.5, #eeeeee));
+    background-image: -webkit-linear-gradient(center bottom, white 0%, #eeeeee 50%);
+    background-image: -moz-linear-gradient(center bottom, white 0%, #eeeeee 50%);
+    background-image: -o-linear-gradient(bottom, white 0%, #eeeeee 50%);
+    background-image: -ms-linear-gradient(top, #ffffff 0%,#eeeeee 50%);
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 );
+    background-image: linear-gradient(top, #ffffff 0%,#eeeeee 50%);
+}
+
+.select2-dropdown-open .select2-choice div {
+    background: transparent;
+    border-left: none;
+    filter: none;
+}
+.select2-dropdown-open .select2-choice div b {
+    background-position: -18px 1px;
+}
+
+/* results */
+.select2-results {
+    max-height: 200px;
+    padding: 0 0 0 4px;
+    margin: 4px 4px 4px 0;
+    position: relative;
+    overflow-x: hidden;
+    overflow-y: auto;
+}
+
+.select2-results ul.select2-result-sub {
+    margin: 0;
+}
+
+.select2-results ul.select2-result-sub > li .select2-result-label { padding-left: 20px }
+.select2-results ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 40px }
+.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 60px }
+.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 80px }
+.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 100px }
+.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 110px }
+.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label { padding-left: 120px }
+
+.select2-results li {
+    list-style: none;
+    display: list-item;
+    background-image: none;
+}
+
+.select2-results li.select2-result-with-children > .select2-result-label {
+    font-weight: bold;
+}
+
+.select2-results .select2-result-label {
+    padding: 3px 7px 4px;
+    margin: 0;
+    cursor: pointer;
+}
+
+.select2-results .select2-highlighted {
+    background: #3875d7;
+    color: #fff;
+}
+
+.select2-results li em {
+    background: #feffde;
+    font-style: normal;
+}
+
+.select2-results .select2-highlighted em {
+    background: transparent;
+}
+
+.select2-results .select2-highlighted ul {
+    background: white;
+    color: #000;
+}
+
+
+.select2-results .select2-no-results,
+.select2-results .select2-searching,
+.select2-results .select2-selection-limit {
+    background: #f4f4f4;
+    display: list-item;
+}
+
+/*
+disabled look for disabled choices in the results dropdown
+*/
+.select2-results .select2-disabled.select2-highlighted {
+    color: #666;
+    background: #f4f4f4;
+    display: list-item;
+    cursor: default;
+}
+.select2-results .select2-disabled {
+  background: #f4f4f4;
+  display: list-item;
+  cursor: default;
+}
+
+.select2-results .select2-selected {
+    display: none;
+}
+
+.select2-more-results.select2-active {
+    background: #f4f4f4 url('select2-spinner.gif') no-repeat 100%;
+}
+
+.select2-more-results {
+    background: #f4f4f4;
+    display: list-item;
+}
+
+/* disabled styles */
+
+.select2-container.select2-container-disabled .select2-choice {
+    background-color: #f4f4f4;
+    background-image: none;
+    border: 1px solid #ddd;
+    cursor: default;
+}
+
+.select2-container.select2-container-disabled .select2-choice div {
+    background-color: #f4f4f4;
+    background-image: none;
+    border-left: 0;
+}
+
+.select2-container.select2-container-disabled .select2-choice abbr {
+    display: none
+}
+
+
+/* multiselect */
+
+.select2-container-multi .select2-choices {
+    height: auto !important;
+    height: 1%;
+    margin: 0;
+    padding: 0;
+    position: relative;
+
+    border: 1px solid #aaa;
+    cursor: text;
+    overflow: hidden;
+
+    background-color: #fff;
+    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
+    background-image: -webkit-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+    background-image: -moz-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+    background-image: -o-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+    background-image: -ms-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+    background-image: linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+}
+
+.select2-locked {
+  padding: 3px 5px 3px 5px !important;
+}
+
+.select2-container-multi .select2-choices {
+    min-height: 26px;
+}
+
+.select2-container-multi.select2-container-active .select2-choices {
+    border: 1px solid #5897fb;
+    outline: none;
+
+    -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
+       -moz-box-shadow: 0 0 5px rgba(0,0,0,.3);
+         -o-box-shadow: 0 0 5px rgba(0,0,0,.3);
+            box-shadow: 0 0 5px rgba(0,0,0,.3);
+}
+.select2-container-multi .select2-choices li {
+    float: left;
+    list-style: none;
+}
+.select2-container-multi .select2-choices .select2-search-field {
+    margin: 0;
+    padding: 0;
+    white-space: nowrap;
+}
+
+.select2-container-multi .select2-choices .select2-search-field input {
+    height: 15px;
+    padding: 5px;
+    margin: 1px 0;
+
+    font-family: sans-serif;
+    font-size: 100%;
+    color: #666;
+    outline: 0;
+    border: 0;
+    -webkit-box-shadow: none;
+       -moz-box-shadow: none;
+         -o-box-shadow: none;
+            box-shadow: none;
+    background: transparent !important;
+}
+
+.select2-container-multi .select2-choices .select2-search-field input.select2-active {
+    background: #fff url('select2-spinner.gif') no-repeat 100% !important;
+}
+
+.select2-default {
+    color: #999 !important;
+}
+
+.select2-container-multi .select2-choices .select2-search-choice {
+    padding: 3px 5px 3px 18px;
+    margin: 3px 0 3px 5px;
+    position: relative;
+
+    line-height: 13px;
+    color: #333;
+    cursor: default;
+    border: 1px solid #aaaaaa;
+
+    -webkit-border-radius: 3px;
+       -moz-border-radius: 3px;
+            border-radius: 3px;
+
+    -webkit-box-shadow: 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+       -moz-box-shadow: 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+            box-shadow: 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+
+    -webkit-background-clip: padding-box;
+       -moz-background-clip: padding;
+            background-clip: padding-box;
+
+    background-color: #e4e4e4;
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#f4f4f4', GradientType=0 );
+    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee));
+    background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+    background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+    background-image: -o-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+    background-image: -ms-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+    background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+}
+.select2-container-multi .select2-choices .select2-search-choice span {
+    cursor: default;
+}
+.select2-container-multi .select2-choices .select2-search-choice-focus {
+    background: #d4d4d4;
+}
+
+.select2-search-choice-close {
+    display: block;
+    width: 12px;
+    height: 13px;
+    position: absolute;
+    right: 3px;
+    top: 4px;
+
+    font-size: 1px;
+    outline: none;
+    background: url('select2.png') right top no-repeat;
+}
+
+.select2-container-multi .select2-search-choice-close {
+    left: 3px;
+}
+
+.select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover {
+  background-position: right -11px;
+}
+.select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close {
+    background-position: right -11px;
+}
+
+/* disabled styles */
+.select2-container-multi.select2-container-disabled .select2-choices{
+    background-color: #f4f4f4;
+    background-image: none;
+    border: 1px solid #ddd;
+    cursor: default;
+}
+
+.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice {
+    padding: 3px 5px 3px 5px;
+    border: 1px solid #ddd;
+    background-image: none;
+    background-color: #f4f4f4;
+}
+
+.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close {
+    display: none;
+}
+/* end multiselect */
+
+
+.select2-result-selectable .select2-match,
+.select2-result-unselectable .select2-match {
+    text-decoration: underline;
+}
+
+.select2-offscreen {
+    position: absolute;
+    left: -10000px;
+}
+
+/* Retina-ize icons */
+
+@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi)  {
+  .select2-search input, .select2-search-choice-close, .select2-container .select2-choice abbr, .select2-container .select2-choice div b {
+      background-image: url('select2x2.png') !important;
+      background-repeat: no-repeat !important;
+      background-size: 60px 40px !important;
+  }
+  .select2-search input {
+      background-position: 100% -21px !important;
+  }
+}
diff --git a/select2-3.3.0/select2.j b/select2-3.3.0/select2.j
new file mode 100755
index 00000000..e69de29b
diff --git a/select2-3.3.0/select2.jquery.json b/select2-3.3.0/select2.jquery.json
new file mode 100755
index 00000000..6a0c04ab
--- /dev/null
+++ b/select2-3.3.0/select2.jquery.json
@@ -0,0 +1,36 @@
+{
+    "name": "select2",
+    "title": "Select2",
+    "description": "Select2 is a jQuery based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results.",
+    "keywords": [
+        "select",
+        "autocomplete",
+        "typeahead",
+        "dropdown",
+        "multiselect",
+        "tag",
+        "tagging"
+    ],
+    "version": "3.3.0",
+    "author": {
+        "name": "Igor Vaynberg",
+        "url": "https://github.com/ivaynberg"
+    },
+    "licenses": [
+        {
+            "type": "Apache",
+            "url": "http://www.apache.org/licenses/LICENSE-2.0"
+        },
+        {
+            "type": "GPL v2",
+            "url": "http://www.gnu.org/licenses/gpl-2.0.html"
+        }
+    ],
+    "bugs": "https://github.com/ivaynberg/select2/issues",
+    "homepage": "http://ivaynberg.github.com/select2",
+    "docs": "http://ivaynberg.github.com/select2/",
+    "download": "https://github.com/ivaynberg/select2/tags",
+    "dependencies": {
+        "jquery": ">=1.4.6"
+    }
+}
diff --git a/select2-3.3.0/select2.js b/select2-3.3.0/select2.js
new file mode 100755
index 00000000..0f6f1fb1
--- /dev/null
+++ b/select2-3.3.0/select2.js
@@ -0,0 +1,2596 @@
+/*
+Copyright 2012 Igor Vaynberg
+
+Version: 3.3.0 Timestamp: Tue Feb  5 18:33:54 PST 2013
+
+This software is licensed under the Apache License, Version 2.0 (the "Apache License") or the GNU
+General Public License version 2 (the "GPL License"). You may choose either license to govern your
+use of this software only upon the condition that you accept all of the terms of either the Apache
+License or the GPL License.
+
+You may obtain a copy of the Apache License and the GPL License at:
+
+    http://www.apache.org/licenses/LICENSE-2.0
+    http://www.gnu.org/licenses/gpl-2.0.html
+
+Unless required by applicable law or agreed to in writing, software distributed under the
+Apache License or the GPL Licesnse is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR
+CONDITIONS OF ANY KIND, either express or implied. See the Apache License and the GPL License for
+the specific language governing permissions and limitations under the Apache License and the GPL License.
+*/
+ (function ($) {
+ 	if(typeof $.fn.each2 == "undefined"){
+ 		$.fn.extend({
+ 			/*
+			* 4-10 times faster .each replacement
+			* use it carefully, as it overrides jQuery context of element on each iteration
+			*/
+			each2 : function (c) {
+				var j = $([0]), i = -1, l = this.length;
+				while (
+					++i < l
+					&& (j.context = j[0] = this[i])
+					&& c.call(j[0], i, j) !== false //"this"=DOM, i=index, j=jQuery object
+				);
+				return this;
+			}
+ 		});
+ 	}
+})(jQuery);
+
+(function ($, undefined) {
+    "use strict";
+    /*global document, window, jQuery, console */
+
+    if (window.Select2 !== undefined) {
+        return;
+    }
+
+    var KEY, AbstractSelect2, SingleSelect2, MultiSelect2, nextUid, sizer,
+        lastMousePosition, $document;
+
+    KEY = {
+        TAB: 9,
+        ENTER: 13,
+        ESC: 27,
+        SPACE: 32,
+        LEFT: 37,
+        UP: 38,
+        RIGHT: 39,
+        DOWN: 40,
+        SHIFT: 16,
+        CTRL: 17,
+        ALT: 18,
+        PAGE_UP: 33,
+        PAGE_DOWN: 34,
+        HOME: 36,
+        END: 35,
+        BACKSPACE: 8,
+        DELETE: 46,
+        isArrow: function (k) {
+            k = k.which ? k.which : k;
+            switch (k) {
+            case KEY.LEFT:
+            case KEY.RIGHT:
+            case KEY.UP:
+            case KEY.DOWN:
+                return true;
+            }
+            return false;
+        },
+        isControl: function (e) {
+            var k = e.which;
+            switch (k) {
+            case KEY.SHIFT:
+            case KEY.CTRL:
+            case KEY.ALT:
+                return true;
+            }
+
+            if (e.metaKey) return true;
+
+            return false;
+        },
+        isFunctionKey: function (k) {
+            k = k.which ? k.which : k;
+            return k >= 112 && k <= 123;
+        }
+    };
+
+    $document = $(document);
+
+    nextUid=(function() { var counter=1; return function() { return counter++; }; }());
+
+    function indexOf(value, array) {
+        var i = 0, l = array.length;
+        for (; i < l; i = i + 1) if (value === array[i]) return i;
+        return -1;
+    }
+
+    /**
+     * Compares equality of a and b
+     * @param a
+     * @param b
+     */
+    function equal(a, b) {
+        return a===b;
+    }
+
+    /**
+     * Splits the string into an array of values, trimming each value. An empty array is returned for nulls or empty
+     * strings
+     * @param string
+     * @param separator
+     */
+    function splitVal(string, separator) {
+        var val, i, l;
+        if (string === null || string.length < 1) return [];
+        val = string.split(separator);
+        for (i = 0, l = val.length; i < l; i = i + 1) val[i] = $.trim(val[i]);
+        return val;
+    }
+
+    function getSideBorderPadding(element) {
+        return element.outerWidth(false) - element.width();
+    }
+
+    function installKeyUpChangeEvent(element) {
+        var key="keyup-change-value";
+        element.bind("keydown", function () {
+            if ($.data(element, key) === undefined) {
+                $.data(element, key, element.val());
+            }
+        });
+        element.bind("keyup", function () {
+            var val= $.data(element, key);
+            if (val !== undefined && element.val() !== val) {
+                $.removeData(element, key);
+                element.trigger("keyup-change");
+            }
+        });
+    }
+
+    $document.bind("mousemove", function (e) {
+        lastMousePosition = {x: e.pageX, y: e.pageY};
+    });
+
+    /**
+     * filters mouse events so an event is fired only if the mouse moved.
+     *
+     * filters out mouse events that occur when mouse is stationary but
+     * the elements under the pointer are scrolled.
+     */
+    function installFilteredMouseMove(element) {
+	    element.bind("mousemove", function (e) {
+            var lastpos = lastMousePosition;
+            if (lastpos === undefined || lastpos.x !== e.pageX || lastpos.y !== e.pageY) {
+                $(e.target).trigger("mousemove-filtered", e);
+            }
+        });
+    }
+
+    /**
+     * Debounces a function. Returns a function that calls the original fn function only if no invocations have been made
+     * within the last quietMillis milliseconds.
+     *
+     * @param quietMillis number of milliseconds to wait before invoking fn
+     * @param fn function to be debounced
+     * @param ctx object to be used as this reference within fn
+     * @return debounced version of fn
+     */
+    function debounce(quietMillis, fn, ctx) {
+        ctx = ctx || undefined;
+        var timeout;
+        return function () {
+            var args = arguments;
+            window.clearTimeout(timeout);
+            timeout = window.setTimeout(function() {
+                fn.apply(ctx, args);
+            }, quietMillis);
+        };
+    }
+
+    /**
+     * A simple implementation of a thunk
+     * @param formula function used to lazily initialize the thunk
+     * @return {Function}
+     */
+    function thunk(formula) {
+        var evaluated = false,
+            value;
+        return function() {
+            if (evaluated === false) { value = formula(); evaluated = true; }
+            return value;
+        };
+    };
+
+    function installDebouncedScroll(threshold, element) {
+        var notify = debounce(threshold, function (e) { element.trigger("scroll-debounced", e);});
+        element.bind("scroll", function (e) {
+            if (indexOf(e.target, element.get()) >= 0) notify(e);
+        });
+    }
+
+    function killEvent(event) {
+        event.preventDefault();
+        event.stopPropagation();
+    }
+    function killEventImmediately(event) {
+        event.preventDefault();
+        event.stopImmediatePropagation();
+    }
+
+    function measureTextWidth(e) {
+        if (!sizer){
+        	var style = e[0].currentStyle || window.getComputedStyle(e[0], null);
+        	sizer = $(document.createElement("div")).css({
+	            position: "absolute",
+	            left: "-10000px",
+	            top: "-10000px",
+	            display: "none",
+	            fontSize: style.fontSize,
+	            fontFamily: style.fontFamily,
+	            fontStyle: style.fontStyle,
+	            fontWeight: style.fontWeight,
+	            letterSpacing: style.letterSpacing,
+	            textTransform: style.textTransform,
+	            whiteSpace: "nowrap"
+	        });
+            sizer.attr("class","select2-sizer");
+        	$("body").append(sizer);
+        }
+        sizer.text(e.val());
+        return sizer.width();
+    }
+
+    function markMatch(text, term, markup, escapeMarkup) {
+        var match=text.toUpperCase().indexOf(term.toUpperCase()),
+            tl=term.length;
+
+        if (match<0) {
+            markup.push(escapeMarkup(text));
+            return;
+        }
+
+        markup.push(escapeMarkup(text.substring(0, match)));
+        markup.push("<span class='select2-match'>");
+        markup.push(escapeMarkup(text.substring(match, match + tl)));
+        markup.push("</span>");
+        markup.push(escapeMarkup(text.substring(match + tl, text.length)));
+    }
+
+    /**
+     * Produces an ajax-based query function
+     *
+     * @param options object containing configuration paramters
+     * @param options.transport function that will be used to execute the ajax request. must be compatible with parameters supported by $.ajax
+     * @param options.url url for the data
+     * @param options.data a function(searchTerm, pageNumber, context) that should return an object containing query string parameters for the above url.
+     * @param options.dataType request data type: ajax, jsonp, other datatatypes supported by jQuery's $.ajax function or the transport function if specified
+     * @param options.traditional a boolean flag that should be true if you wish to use the traditional style of param serialization for the ajax request
+     * @param options.quietMillis (optional) milliseconds to wait before making the ajaxRequest, helps debounce the ajax function if invoked too often
+     * @param options.results a function(remoteData, pageNumber) that converts data returned form the remote request to the format expected by Select2.
+     *      The expected format is an object containing the following keys:
+     *      results array of objects that will be used as choices
+     *      more (optional) boolean indicating whether there are more results available
+     *      Example: {results:[{id:1, text:'Red'},{id:2, text:'Blue'}], more:true}
+     */
+    function ajax(options) {
+        var timeout, // current scheduled but not yet executed request
+            requestSequence = 0, // sequence used to drop out-of-order responses
+            handler = null,
+            quietMillis = options.quietMillis || 100;
+
+        return function (query) {
+            window.clearTimeout(timeout);
+            timeout = window.setTimeout(function () {
+                requestSequence += 1; // increment the sequence
+                var requestNumber = requestSequence, // this request's sequence number
+                    data = options.data, // ajax data function
+                    url = options.url, // ajax url string or function
+                    transport = options.transport || $.ajax,
+                    traditional = options.traditional || false,
+                    type = options.type || 'GET'; // set type of request (GET or POST)
+
+                data = data ? data.call(this, query.term, query.page, query.context) : null;
+                url = (typeof url === 'function') ? url.call(this, query.term, query.page, query.context) : url;
+
+                if( null !== handler) { handler.abort(); }
+
+                handler = transport.call(null, {
+                    url: url,
+                    dataType: options.dataType,
+                    data: data,
+                    type: type,
+                    traditional: traditional,
+                    success: function (data) {
+                        if (requestNumber < requestSequence) {
+                            return;
+                        }
+                        // TODO 3.0 - replace query.page with query so users have access to term, page, etc.
+                        var results = options.results(data, query.page);
+                        query.callback(results);
+                    }
+                });
+            }, quietMillis);
+        };
+    }
+
+    /**
+     * Produces a query function that works with a local array
+     *
+     * @param options object containing configuration parameters. The options parameter can either be an array or an
+     * object.
+     *
+     * If the array form is used it is assumed that it contains objects with 'id' and 'text' keys.
+     *
+     * If the object form is used ti is assumed that it contains 'data' and 'text' keys. The 'data' key should contain
+     * an array of objects that will be used as choices. These objects must contain at least an 'id' key. The 'text'
+     * key can either be a String in which case it is expected that each element in the 'data' array has a key with the
+     * value of 'text' which will be used to match choices. Alternatively, text can be a function(item) that can extract
+     * the text.
+     */
+    function local(options) {
+        var data = options, // data elements
+            dataText,
+            text = function (item) { return ""+item.text; }; // function used to retrieve the text portion of a data item that is matched against the search
+
+        if (!$.isArray(data)) {
+            text = data.text;
+            // if text is not a function we assume it to be a key name
+            if (!$.isFunction(text)) {
+              dataText = data.text; // we need to store this in a separate variable because in the next step data gets reset and data.text is no longer available
+              text = function (item) { return item[dataText]; };
+            }
+            data = data.results;
+        }
+
+        return function (query) {
+            var t = query.term, filtered = { results: [] }, process;
+            if (t === "") {
+                query.callback({results: data});
+                return;
+            }
+
+            process = function(datum, collection) {
+                var group, attr;
+                datum = datum[0];
+                if (datum.children) {
+                    group = {};
+                    for (attr in datum) {
+                        if (datum.hasOwnProperty(attr)) group[attr]=datum[attr];
+                    }
+                    group.children=[];
+                    $(datum.children).each2(function(i, childDatum) { process(childDatum, group.children); });
+                    if (group.children.length || query.matcher(t, text(group), datum)) {
+                        collection.push(group);
+                    }
+                } else {
+                    if (query.matcher(t, text(datum), datum)) {
+                        collection.push(datum);
+                    }
+                }
+            };
+
+            $(data).each2(function(i, datum) { process(datum, filtered.results); });
+            query.callback(filtered);
+        };
+    }
+
+    // TODO javadoc
+    function tags(data) {
+        var isFunc = $.isFunction(data);
+        return function (query) {
+            var t = query.term, filtered = {results: []};
+            $(isFunc ? data() : data).each(function () {
+                var isObject = this.text !== undefined,
+                    text = isObject ? this.text : this;
+                if (t === "" || query.matcher(t, text)) {
+                    filtered.results.push(isObject ? this : {id: this, text: this});
+                }
+            });
+            query.callback(filtered);
+        };
+    }
+
+    /**
+     * Checks if the formatter function should be used.
+     *
+     * Throws an error if it is not a function. Returns true if it should be used,
+     * false if no formatting should be performed.
+     *
+     * @param formatter
+     */
+    function checkFormatter(formatter, formatterName) {
+        if ($.isFunction(formatter)) return true;
+        if (!formatter) return false;
+        throw new Error("formatterName must be a function or a falsy value");
+    }
+
+    function evaluate(val) {
+        return $.isFunction(val) ? val() : val;
+    }
+
+    function countResults(results) {
+        var count = 0;
+        $.each(results, function(i, item) {
+            if (item.children) {
+                count += countResults(item.children);
+            } else {
+                count++;
+            }
+        });
+        return count;
+    }
+
+    /**
+     * Default tokenizer. This function uses breaks the input on substring match of any string from the
+     * opts.tokenSeparators array and uses opts.createSearchChoice to create the choice object. Both of those
+     * two options have to be defined in order for the tokenizer to work.
+     *
+     * @param input text user has typed so far or pasted into the search field
+     * @param selection currently selected choices
+     * @param selectCallback function(choice) callback tho add the choice to selection
+     * @param opts select2's opts
+     * @return undefined/null to leave the current input unchanged, or a string to change the input to the returned value
+     */
+    function defaultTokenizer(input, selection, selectCallback, opts) {
+        var original = input, // store the original so we can compare and know if we need to tell the search to update its text
+            dupe = false, // check for whether a token we extracted represents a duplicate selected choice
+            token, // token
+            index, // position at which the separator was found
+            i, l, // looping variables
+            separator; // the matched separator
+
+        if (!opts.createSearchChoice || !opts.tokenSeparators || opts.tokenSeparators.length < 1) return undefined;
+
+        while (true) {
+            index = -1;
+
+            for (i = 0, l = opts.tokenSeparators.length; i < l; i++) {
+                separator = opts.tokenSeparators[i];
+                index = input.indexOf(separator);
+                if (index >= 0) break;
+            }
+
+            if (index < 0) break; // did not find any token separator in the input string, bail
+
+            token = input.substring(0, index);
+            input = input.substring(index + separator.length);
+
+            if (token.length > 0) {
+                token = opts.createSearchChoice(token, selection);
+                if (token !== undefined && token !== null && opts.id(token) !== undefined && opts.id(token) !== null) {
+                    dupe = false;
+                    for (i = 0, l = selection.length; i < l; i++) {
+                        if (equal(opts.id(token), opts.id(selection[i]))) {
+                            dupe = true; break;
+                        }
+                    }
+
+                    if (!dupe) selectCallback(token);
+                }
+            }
+        }
+
+        if (original!==input) return input;
+    }
+
+    /**
+     * Creates a new class
+     *
+     * @param superClass
+     * @param methods
+     */
+    function clazz(SuperClass, methods) {
+        var constructor = function () {};
+        constructor.prototype = new SuperClass;
+        constructor.prototype.constructor = constructor;
+        constructor.prototype.parent = SuperClass.prototype;
+        constructor.prototype = $.extend(constructor.prototype, methods);
+        return constructor;
+    }
+
+    AbstractSelect2 = clazz(Object, {
+
+        // abstract
+        bind: function (func) {
+            var self = this;
+            return function () {
+                func.apply(self, arguments);
+            };
+        },
+
+        // abstract
+        init: function (opts) {
+            var results, search, resultsSelector = ".select2-results", mask;
+
+            // prepare options
+            this.opts = opts = this.prepareOpts(opts);
+
+            this.id=opts.id;
+
+            // destroy if called on an existing component
+            if (opts.element.data("select2") !== undefined &&
+                opts.element.data("select2") !== null) {
+                this.destroy();
+            }
+
+            this.enabled=true;
+            this.container = this.createContainer();
+
+            this.containerId="s2id_"+(opts.element.attr("id") || "autogen"+nextUid());
+            this.containerSelector="#"+this.containerId.replace(/([;&,\.\+\*\~':"\!\^#$%@\[\]\(\)=>\|])/g, '\\$1');
+            this.container.attr("id", this.containerId);
+
+            // cache the body so future lookups are cheap
+            this.body = thunk(function() { return opts.element.closest("body"); });
+
+            // create the dropdown mask if doesnt already exist
+            mask = $("#select2-drop-mask");
+            if (mask.length == 0) {
+                mask = $(document.createElement("div"));
+                mask.attr("id","select2-drop-mask").attr("class","select2-drop-mask");
+                mask.hide();
+                mask.appendTo(this.body());
+                mask.bind("mousedown touchstart", function (e) {
+                    var dropdown = $("#select2-drop"), self;
+                    if (dropdown.length > 0) {
+                        self=dropdown.data("select2");
+                        if (self.opts.selectOnBlur) {
+                            self.selectHighlighted({noFocus: true});
+                        }
+                        self.close();
+                    }
+                });
+            }
+
+            if (opts.element.attr("class") !== undefined) {
+                this.container.addClass(opts.element.attr("class").replace(/validate\[[\S ]+] ?/, ''));
+            }
+
+            this.container.css(evaluate(opts.containerCss));
+            this.container.addClass(evaluate(opts.containerCssClass));
+
+            this.elementTabIndex = this.opts.element.attr("tabIndex");
+
+            // swap container for the element
+            this.opts.element
+                .data("select2", this)
+                .addClass("select2-offscreen")
+                .bind("focus.select2", function() { $(this).select2("focus")})
+                .attr("tabIndex", "-1")
+                .before(this.container);
+            this.container.data("select2", this);
+
+            this.dropdown = this.container.find(".select2-drop");
+            this.dropdown.addClass(evaluate(opts.dropdownCssClass));
+            this.dropdown.data("select2", this);
+
+            this.results = results = this.container.find(resultsSelector);
+            this.search = search = this.container.find("input.select2-input");
+
+            search.attr("tabIndex", this.elementTabIndex);
+
+            this.resultsPage = 0;
+            this.context = null;
+
+            // initialize the container
+            this.initContainer();
+            this.initContainerWidth();
+
+            installFilteredMouseMove(this.results);
+            this.dropdown.delegate(resultsSelector, "mousemove-filtered", this.bind(this.highlightUnderEvent));
+
+            installDebouncedScroll(80, this.results);
+            this.dropdown.delegate(resultsSelector, "scroll-debounced", this.bind(this.loadMoreIfNeeded));
+
+            // if jquery.mousewheel plugin is installed we can prevent out-of-bounds scrolling of results via mousewheel
+            if ($.fn.mousewheel) {
+                results.mousewheel(function (e, delta, deltaX, deltaY) {
+                    var top = results.scrollTop(), height;
+                    if (deltaY > 0 && top - deltaY <= 0) {
+                        results.scrollTop(0);
+                        killEvent(e);
+                    } else if (deltaY < 0 && results.get(0).scrollHeight - results.scrollTop() + deltaY <= results.height()) {
+                        results.scrollTop(results.get(0).scrollHeight - results.height());
+                        killEvent(e);
+                    }
+                });
+            }
+
+            installKeyUpChangeEvent(search);
+            search.bind("keyup-change", this.bind(this.updateResults));
+            search.bind("focus", function () { search.addClass("select2-focused"); if (search.val() === " ") search.val(""); });
+            search.bind("blur", function () { search.removeClass("select2-focused");});
+
+            this.dropdown.delegate(resultsSelector, "mouseup", this.bind(function (e) {
+                if ($(e.target).closest(".select2-result-selectable").length > 0) {
+                    this.highlightUnderEvent(e);
+                    this.selectHighlighted(e);
+                } else {
+                    this.focusSearch();
+                }
+                killEvent(e);
+            }));
+
+            // trap all mouse events from leaving the dropdown. sometimes there may be a modal that is listening
+            // for mouse events outside of itself so it can close itself. since the dropdown is now outside the select2's
+            // dom it will trigger the popup close, which is not what we want
+            this.dropdown.bind("click mouseup mousedown", function (e) { e.stopPropagation(); });
+
+            if ($.isFunction(this.opts.initSelection)) {
+                // initialize selection based on the current value of the source element
+                this.initSelection();
+
+                // if the user has provided a function that can set selection based on the value of the source element
+                // we monitor the change event on the element and trigger it, allowing for two way synchronization
+                this.monitorSource();
+            }
+
+            if (opts.element.is(":disabled") || opts.element.is("[readonly='readonly']")) this.disable();
+        },
+
+        // abstract
+        destroy: function () {
+            var select2 = this.opts.element.data("select2");
+
+            if (this.propertyObserver) { delete this.propertyObserver; this.propertyObserver = null; }
+
+            if (select2 !== undefined) {
+
+                select2.container.remove();
+                select2.dropdown.remove();
+                select2.opts.element
+                    .removeData("select2")
+                    .unbind(".select2")
+                    .attr("tabIndex", this.elementTabIndex)
+                    .show();
+            }
+        },
+
+        // abstract
+        prepareOpts: function (opts) {
+            var element, select, idKey, ajaxUrl;
+
+            element = opts.element;
+
+            if (element.get(0).tagName.toLowerCase() === "select") {
+                this.select = select = opts.element;
+            }
+
+            if (select) {
+                // these options are not allowed when attached to a select because they are picked up off the element itself
+                $.each(["id", "multiple", "ajax", "query", "createSearchChoice", "initSelection", "data", "tags"], function () {
+                    if (this in opts) {
+                        throw new Error("Option '" + this + "' is not allowed for Select2 when attached to a <select> element.");
+                    }
+                });
+            }
+
+            opts = $.extend({}, {
+                populateResults: function(container, results, query) {
+                    var populate,  data, result, children, id=this.opts.id, self=this;
+
+                    populate=function(results, container, depth) {
+
+                        var i, l, result, selectable, disabled, compound, node, label, innerContainer, formatted;
+
+                        results = opts.sortResults(results, container, query);
+
+                        for (i = 0, l = results.length; i < l; i = i + 1) {
+
+                            result=results[i];
+
+                            disabled = (result.disabled === true);
+                            selectable = (!disabled) && (id(result) !== undefined);
+
+                            compound=result.children && result.children.length > 0;
+
+                            node=$("<li></li>");
+                            node.addClass("select2-results-dept-"+depth);
+                            node.addClass("select2-result");
+                            node.addClass(selectable ? "select2-result-selectable" : "select2-result-unselectable");
+                            if (disabled) { node.addClass("select2-disabled"); }
+                            if (compound) { node.addClass("select2-result-with-children"); }
+                            node.addClass(self.opts.formatResultCssClass(result));
+
+                            label=$(document.createElement("div"));
+                            label.addClass("select2-result-label");
+
+                            formatted=opts.formatResult(result, label, query, self.opts.escapeMarkup);
+                            if (formatted!==undefined) {
+                                label.html(formatted);
+                            }
+
+                            node.append(label);
+
+                            if (compound) {
+
+                                innerContainer=$("<ul></ul>");
+                                innerContainer.addClass("select2-result-sub");
+                                populate(result.children, innerContainer, depth+1);
+                                node.append(innerContainer);
+                            }
+
+                            node.data("select2-data", result);
+                            container.append(node);
+                        }
+                    };
+
+                    populate(results, container, 0);
+                }
+            }, $.fn.select2.defaults, opts);
+
+            if (typeof(opts.id) !== "function") {
+                idKey = opts.id;
+                opts.id = function (e) { return e[idKey]; };
+            }
+
+            if ($.isArray(opts.element.data("select2Tags"))) {
+                if ("tags" in opts) {
+                    throw "tags specified as both an attribute 'data-select2-tags' and in options of Select2 " + opts.element.attr("id");
+                }
+                opts.tags=opts.element.attr("data-select2-tags");
+            }
+
+            if (select) {
+                opts.query = this.bind(function (query) {
+                    var data = { results: [], more: false },
+                        term = query.term,
+                        children, firstChild, process;
+
+                    process=function(element, collection) {
+                        var group;
+                        if (element.is("option")) {
+                            if (query.matcher(term, element.text(), element)) {
+                                collection.push({id:element.attr("value"), text:element.text(), element: element.get(), css: element.attr("class"), disabled: equal(element.attr("disabled"), "disabled") });
+                            }
+                        } else if (element.is("optgroup")) {
+                            group={text:element.attr("label"), children:[], element: element.get(), css: element.attr("class")};
+                            element.children().each2(function(i, elm) { process(elm, group.children); });
+                            if (group.children.length>0) {
+                                collection.push(group);
+                            }
+                        }
+                    };
+
+                    children=element.children();
+
+                    // ignore the placeholder option if there is one
+                    if (this.getPlaceholder() !== undefined && children.length > 0) {
+                        firstChild = children[0];
+                        if ($(firstChild).text() === "") {
+                            children=children.not(firstChild);
+                        }
+                    }
+
+                    children.each2(function(i, elm) { process(elm, data.results); });
+
+                    query.callback(data);
+                });
+                // this is needed because inside val() we construct choices from options and there id is hardcoded
+                opts.id=function(e) { return e.id; };
+                opts.formatResultCssClass = function(data) { return data.css; }
+            } else {
+                if (!("query" in opts)) {
+
+                    if ("ajax" in opts) {
+                        ajaxUrl = opts.element.data("ajax-url");
+                        if (ajaxUrl && ajaxUrl.length > 0) {
+                            opts.ajax.url = ajaxUrl;
+                        }
+                        opts.query = ajax(opts.ajax);
+                    } else if ("data" in opts) {
+                        opts.query = local(opts.data);
+                    } else if ("tags" in opts) {
+                        opts.query = tags(opts.tags);
+                        if (opts.createSearchChoice === undefined) {
+                            opts.createSearchChoice = function (term) { return {id: term, text: term}; };
+                        }
+                        opts.initSelection = function (element, callback) {
+                            var data = [];
+                            $(splitVal(element.val(), opts.separator)).each(function () {
+                                var id = this, text = this, tags=opts.tags;
+                                if ($.isFunction(tags)) tags=tags();
+                                $(tags).each(function() { if (equal(this.id, id)) { text = this.text; return false; } });
+                                data.push({id: id, text: text});
+                            });
+
+                            callback(data);
+                        };
+                    }
+                }
+            }
+            if (typeof(opts.query) !== "function") {
+                throw "query function not defined for Select2 " + opts.element.attr("id");
+            }
+
+            return opts;
+        },
+
+        /**
+         * Monitor the original element for changes and update select2 accordingly
+         */
+        // abstract
+        monitorSource: function () {
+            var el = this.opts.element, sync;
+
+            el.bind("change.select2", this.bind(function (e) {
+                if (this.opts.element.data("select2-change-triggered") !== true) {
+                    this.initSelection();
+                }
+            }));
+
+            sync = this.bind(function () {
+                var enabled = this.opts.element.attr("disabled") !== "disabled";
+                var readonly = this.opts.element.attr("readonly") === "readonly";
+
+                enabled = enabled && !readonly;
+
+                if (this.enabled !== enabled) {
+                    if (enabled) {
+                        this.enable();
+                    } else {
+                        this.disable();
+                    }
+                }
+            });
+
+            // mozilla and IE
+            el.bind("propertychange.select2 DOMAttrModified.select2", sync);
+            // safari and chrome
+            if (typeof WebKitMutationObserver !== "undefined") {
+                if (this.propertyObserver) { delete this.propertyObserver; this.propertyObserver = null; }
+                this.propertyObserver = new WebKitMutationObserver(function (mutations) {
+                    mutations.forEach(sync);
+                });
+                this.propertyObserver.observe(el.get(0), { attributes:true, subtree:false });
+            }
+        },
+
+        /**
+         * Triggers the change event on the source element
+         */
+        // abstract
+        triggerChange: function (details) {
+
+            details = details || {};
+            details= $.extend({}, details, { type: "change", val: this.val() });
+            // prevents recursive triggering
+            this.opts.element.data("select2-change-triggered", true);
+            this.opts.element.trigger(details);
+            this.opts.element.data("select2-change-triggered", false);
+
+            // some validation frameworks ignore the change event and listen instead to keyup, click for selects
+            // so here we trigger the click event manually
+            this.opts.element.click();
+
+            // ValidationEngine ignorea the change event and listens instead to blur
+            // so here we trigger the blur event manually if so desired
+            if (this.opts.blurOnChange)
+                this.opts.element.blur();
+        },
+
+        // abstract
+        enable: function() {
+            if (this.enabled) return;
+
+            this.enabled=true;
+            this.container.removeClass("select2-container-disabled");
+            this.opts.element.removeAttr("disabled");
+        },
+
+        // abstract
+        disable: function() {
+            if (!this.enabled) return;
+
+            this.close();
+
+            this.enabled=false;
+            this.container.addClass("select2-container-disabled");
+            this.opts.element.attr("disabled", "disabled");
+        },
+
+        // abstract
+        opened: function () {
+            return this.container.hasClass("select2-dropdown-open");
+        },
+
+        // abstract
+        positionDropdown: function() {
+            var offset = this.container.offset(),
+                height = this.container.outerHeight(false),
+                width = this.container.outerWidth(false),
+                dropHeight = this.dropdown.outerHeight(false),
+	        viewPortRight = $(window).scrollLeft() + document.documentElement.clientWidth,
+                viewportBottom = $(window).scrollTop() + document.documentElement.clientHeight,
+                dropTop = offset.top + height,
+                dropLeft = offset.left,
+                enoughRoomBelow = dropTop + dropHeight <= viewportBottom,
+                enoughRoomAbove = (offset.top - dropHeight) >= this.body().scrollTop(),
+	        dropWidth = this.dropdown.outerWidth(false),
+	        enoughRoomOnRight = dropLeft + dropWidth <= viewPortRight,
+                aboveNow = this.dropdown.hasClass("select2-drop-above"),
+                bodyOffset,
+                above,
+                css;
+
+            // console.log("below/ droptop:", dropTop, "dropHeight", dropHeight, "sum", (dropTop+dropHeight)+" viewport bottom", viewportBottom, "enough?", enoughRoomBelow);
+            // console.log("above/ offset.top", offset.top, "dropHeight", dropHeight, "top", (offset.top-dropHeight), "scrollTop", this.body().scrollTop(), "enough?", enoughRoomAbove);
+
+            // fix positioning when body has an offset and is not position: static
+
+            if (this.body().css('position') !== 'static') {
+                bodyOffset = this.body().offset();
+                dropTop -= bodyOffset.top;
+                dropLeft -= bodyOffset.left;
+            }
+
+            // always prefer the current above/below alignment, unless there is not enough room
+
+            if (aboveNow) {
+                above = true;
+                if (!enoughRoomAbove && enoughRoomBelow) above = false;
+            } else {
+                above = false;
+                if (!enoughRoomBelow && enoughRoomAbove) above = true;
+            }
+
+	    if (!enoughRoomOnRight) {
+		   dropLeft = offset.left + width - dropWidth;
+	    }
+
+            if (above) {
+                dropTop = offset.top - dropHeight;
+                this.container.addClass("select2-drop-above");
+                this.dropdown.addClass("select2-drop-above");
+            }
+            else {
+                this.container.removeClass("select2-drop-above");
+                this.dropdown.removeClass("select2-drop-above");
+            }
+
+            css = $.extend({
+                top: dropTop,
+                left: dropLeft,
+                width: width
+            }, evaluate(this.opts.dropdownCss));
+
+            this.dropdown.css(css);
+        },
+
+        // abstract
+        shouldOpen: function() {
+            var event;
+
+            if (this.opened()) return false;
+
+            event = $.Event("open");
+            this.opts.element.trigger(event);
+            return !event.isDefaultPrevented();
+        },
+
+        // abstract
+        clearDropdownAlignmentPreference: function() {
+            // clear the classes used to figure out the preference of where the dropdown should be opened
+            this.container.removeClass("select2-drop-above");
+            this.dropdown.removeClass("select2-drop-above");
+        },
+
+        /**
+         * Opens the dropdown
+         *
+         * @return {Boolean} whether or not dropdown was opened. This method will return false if, for example,
+         * the dropdown is already open, or if the 'open' event listener on the element called preventDefault().
+         */
+        // abstract
+        open: function () {
+
+            if (!this.shouldOpen()) return false;
+
+            window.setTimeout(this.bind(this.opening), 1);
+
+            return true;
+        },
+
+        /**
+         * Performs the opening of the dropdown
+         */
+        // abstract
+        opening: function() {
+            var cid = this.containerId,
+                scroll = "scroll." + cid,
+                resize = "resize."+cid,
+                orient = "orientationchange."+cid,
+                mask;
+
+            this.clearDropdownAlignmentPreference();
+
+            if (this.search.val() === " ") { this.search.val(""); }
+
+            this.container.addClass("select2-dropdown-open").addClass("select2-container-active");
+
+
+            if(this.dropdown[0] !== this.body().children().last()[0]) {
+                this.dropdown.detach().appendTo(this.body());
+            }
+
+            this.updateResults(true);
+
+            mask = $("#select2-drop-mask");
+
+            // ensure the mask is always right before the dropdown
+            if (this.dropdown.prev()[0] !== mask[0]) {
+                this.dropdown.before(mask);
+            }
+
+            // move the global id to the correct dropdown
+            $("#select2-drop").removeAttr("id");
+            this.dropdown.attr("id", "select2-drop");
+
+            // show the elements
+            mask.css({
+                width: document.documentElement.scrollWidth,
+                height: document.documentElement.scrollHeight});
+            mask.show();
+            this.dropdown.show();
+            this.positionDropdown();
+
+            this.dropdown.addClass("select2-drop-active");
+            this.ensureHighlightVisible();
+
+            // attach listeners to events that can change the position of the container and thus require
+            // the position of the dropdown to be updated as well so it does not come unglued from the container
+            this.container.parents().add(window).each(function () {
+                $(this).bind(resize+" "+scroll+" "+orient, function (e) {
+                    $("#select2-drop-mask").css({
+                        width:document.documentElement.scrollWidth,
+                        height:document.documentElement.scrollHeight});
+                    $("#select2-drop").data("select2").positionDropdown();
+                });
+            });
+
+            this.focusSearch();
+        },
+
+        // abstract
+        close: function () {
+            if (!this.opened()) return;
+
+            var cid = this.containerId,
+                scroll = "scroll." + cid,
+                resize = "resize."+cid,
+                orient = "orientationchange."+cid;
+
+            // unbind event listeners
+            this.container.parents().add(window).each(function () { $(this).unbind(scroll).unbind(resize).unbind(orient); });
+
+            this.clearDropdownAlignmentPreference();
+
+            $("#select2-drop-mask").hide();
+            this.dropdown.removeAttr("id"); // only the active dropdown has the select2-drop id
+            this.dropdown.hide();
+            this.container.removeClass("select2-dropdown-open").removeClass("select2-container-active");
+            this.results.empty();
+            this.clearSearch();
+
+            this.opts.element.trigger($.Event("close"));
+        },
+
+        // abstract
+        clearSearch: function () {
+
+        },
+
+        // abstract
+        ensureHighlightVisible: function () {
+            var results = this.results, children, index, child, hb, rb, y, more;
+
+            index = this.highlight();
+
+            if (index < 0) return;
+
+            if (index == 0) {
+
+                // if the first element is highlighted scroll all the way to the top,
+                // that way any unselectable headers above it will also be scrolled
+                // into view
+
+                results.scrollTop(0);
+                return;
+            }
+
+            children = this.findHighlightableChoices();
+
+            child = $(children[index]);
+
+            hb = child.offset().top + child.outerHeight(true);
+
+            // if this is the last child lets also make sure select2-more-results is visible
+            if (index === children.length - 1) {
+                more = results.find("li.select2-more-results");
+                if (more.length > 0) {
+                    hb = more.offset().top + more.outerHeight(true);
+                }
+            }
+
+            rb = results.offset().top + results.outerHeight(true);
+            if (hb > rb) {
+                results.scrollTop(results.scrollTop() + (hb - rb));
+            }
+            y = child.offset().top - results.offset().top;
+
+            // make sure the top of the element is visible
+            if (y < 0 && child.css('display') != 'none' ) {
+                results.scrollTop(results.scrollTop() + y); // y is negative
+            }
+        },
+
+        // abstract
+        findHighlightableChoices: function() {
+            var h=this.results.find(".select2-result-selectable:not(.select2-selected):not(.select2-disabled)");
+            return this.results.find(".select2-result-selectable:not(.select2-selected):not(.select2-disabled)");
+        },
+
+        // abstract
+        moveHighlight: function (delta) {
+            var choices = this.findHighlightableChoices(),
+                index = this.highlight();
+
+            while (index > -1 && index < choices.length) {
+                index += delta;
+                var choice = $(choices[index]);
+                if (choice.hasClass("select2-result-selectable") && !choice.hasClass("select2-disabled") && !choice.hasClass("select2-selected")) {
+                    this.highlight(index);
+                    break;
+                }
+            }
+        },
+
+        // abstract
+        highlight: function (index) {
+            var choices = this.findHighlightableChoices();
+
+            if (arguments.length === 0) {
+                return indexOf(choices.filter(".select2-highlighted")[0], choices.get());
+            }
+
+            if (index >= choices.length) index = choices.length - 1;
+            if (index < 0) index = 0;
+
+            this.results.find(".select2-highlighted").removeClass("select2-highlighted");
+
+            $(choices[index]).addClass("select2-highlighted");
+            this.ensureHighlightVisible();
+        },
+
+        // abstract
+        countSelectableResults: function() {
+            return this.findHighlightableChoices().length;
+        },
+
+        // abstract
+        highlightUnderEvent: function (event) {
+            var el = $(event.target).closest(".select2-result-selectable");
+            if (el.length > 0 && !el.is(".select2-highlighted")) {
+        		var choices = this.findHighlightableChoices();
+                this.highlight(choices.index(el));
+            } else if (el.length == 0) {
+                // if we are over an unselectable item remove al highlights
+                this.results.find(".select2-highlighted").removeClass("select2-highlighted");
+            }
+        },
+
+        // abstract
+        loadMoreIfNeeded: function () {
+            var results = this.results,
+                more = results.find("li.select2-more-results"),
+                below, // pixels the element is below the scroll fold, below==0 is when the element is starting to be visible
+                offset = -1, // index of first element without data
+                page = this.resultsPage + 1,
+                self=this,
+                term=this.search.val(),
+                context=this.context;
+
+            if (more.length === 0) return;
+            below = more.offset().top - results.offset().top - results.height();
+
+            if (below <= this.opts.loadMorePadding) {
+                more.addClass("select2-active");
+                this.opts.query({
+                        term: term,
+                        page: page,
+                        context: context,
+                        matcher: this.opts.matcher,
+                        callback: this.bind(function (data) {
+
+                    // ignore a response if the select2 has been closed before it was received
+                    if (!self.opened()) return;
+
+
+                    self.opts.populateResults.call(this, results, data.results, {term: term, page: page, context:context});
+
+                    if (data.more===true) {
+                        more.detach().appendTo(results).text(self.opts.formatLoadMore(page+1));
+                        window.setTimeout(function() { self.loadMoreIfNeeded(); }, 10);
+                    } else {
+                        more.remove();
+                    }
+                    self.positionDropdown();
+                    self.resultsPage = page;
+                })});
+            }
+        },
+
+        /**
+         * Default tokenizer function which does nothing
+         */
+        tokenize: function() {
+
+        },
+
+        /**
+         * @param initial whether or not this is the call to this method right after the dropdown has been opened
+         */
+        // abstract
+        updateResults: function (initial) {
+            var search = this.search, results = this.results, opts = this.opts, data, self=this, input;
+
+            // if the search is currently hidden we do not alter the results
+            if (initial !== true && (this.showSearchInput === false || !this.opened())) {
+                return;
+            }
+
+            search.addClass("select2-active");
+
+            function postRender() {
+                results.scrollTop(0);
+                search.removeClass("select2-active");
+                self.positionDropdown();
+            }
+
+            function render(html) {
+                results.html(html);
+                postRender();
+            }
+
+            var maxSelSize = $.isFunction(opts.maximumSelectionSize) ? opts.maximumSelectionSize() : opts.maximumSelectionSize;
+            if (maxSelSize >=1) {
+                data = this.data();
+                if ($.isArray(data) && data.length >= maxSelSize && checkFormatter(opts.formatSelectionTooBig, "formatSelectionTooBig")) {
+            	    render("<li class='select2-selection-limit'>" + opts.formatSelectionTooBig(maxSelSize) + "</li>");
+            	    return;
+                }
+            }
+
+            if (search.val().length < opts.minimumInputLength) {
+                if (checkFormatter(opts.formatInputTooShort, "formatInputTooShort")) {
+                    render("<li class='select2-no-results'>" + opts.formatInputTooShort(search.val(), opts.minimumInputLength) + "</li>");
+                } else {
+                    render("");
+                }
+                return;
+            }
+            else if (opts.formatSearching() && initial===true) {
+                render("<li class='select2-searching'>" + opts.formatSearching() + "</li>");
+            }
+
+            if (opts.maximumInputLength && search.val().length > opts.maximumInputLength) {
+                if (checkFormatter(opts.formatInputTooLong, "formatInputTooLong")) {
+                    render("<li class='select2-no-results'>" + opts.formatInputTooLong(search.val(), opts.maximumInputLength) + "</li>");
+                } else {
+                    render("");
+                }
+                return;
+            }
+
+            // give the tokenizer a chance to pre-process the input
+            input = this.tokenize();
+            if (input != undefined && input != null) {
+                search.val(input);
+            }
+
+            this.resultsPage = 1;
+            opts.query({
+                    term: search.val(),
+                    page: this.resultsPage,
+                    context: null,
+                    matcher: opts.matcher,
+                    callback: this.bind(function (data) {
+                var def; // default choice
+
+                // ignore a response if the select2 has been closed before it was received
+                if (!this.opened()) return;
+
+                // save context, if any
+                this.context = (data.context===undefined) ? null : data.context;
+
+                // create a default choice and prepend it to the list
+                if (this.opts.createSearchChoice && search.val() !== "") {
+                    def = this.opts.createSearchChoice.call(null, search.val(), data.results);
+                    if (def !== undefined && def !== null && self.id(def) !== undefined && self.id(def) !== null) {
+                        if ($(data.results).filter(
+                            function () {
+                                return equal(self.id(this), self.id(def));
+                            }).length === 0) {
+                            data.results.unshift(def);
+                        }
+                    }
+                }
+
+                if (data.results.length === 0 && checkFormatter(opts.formatNoMatches, "formatNoMatches")) {
+                    render("<li class='select2-no-results'>" + opts.formatNoMatches(search.val()) + "</li>");
+                    return;
+                }
+
+                results.empty();
+                self.opts.populateResults.call(this, results, data.results, {term: search.val(), page: this.resultsPage, context:null});
+
+                if (data.more === true && checkFormatter(opts.formatLoadMore, "formatLoadMore")) {
+                    results.append("<li class='select2-more-results'>" + self.opts.escapeMarkup(opts.formatLoadMore(this.resultsPage)) + "</li>");
+                    window.setTimeout(function() { self.loadMoreIfNeeded(); }, 10);
+                }
+
+                this.postprocessResults(data, initial);
+
+                postRender();
+            })});
+        },
+
+        // abstract
+        cancel: function () {
+            this.close();
+        },
+
+        // abstract
+        blur: function () {
+            // if selectOnBlur == true, select the currently highlighted option
+            if (this.opts.selectOnBlur)
+                this.selectHighlighted({noFocus: true});
+
+            this.close();
+            this.container.removeClass("select2-container-active");
+            this.dropdown.removeClass("select2-drop-active");
+            // synonymous to .is(':focus'), which is available in jquery >= 1.6
+            if (this.search[0] === document.activeElement) { this.search.blur(); }
+            this.clearSearch();
+            this.selection.find(".select2-search-choice-focus").removeClass("select2-search-choice-focus");
+            this.opts.element.triggerHandler("blur");
+        },
+
+        // abstract
+        focusSearch: function () {
+            // need to do it here as well as in timeout so it works in IE
+            this.search.show();
+            this.search.focus();
+
+            /* we do this in a timeout so that current event processing can complete before this code is executed.
+             this makes sure the search field is focussed even if the current event would blur it */
+            window.setTimeout(this.bind(function () {
+                // reset the value so IE places the cursor at the end of the input box
+                this.search.show();
+                this.search.focus();
+                this.search.val(this.search.val());
+            }), 10);
+        },
+
+        // abstract
+        selectHighlighted: function (options) {
+            var index=this.highlight(),
+                highlighted=this.results.find(".select2-highlighted"),
+                data = highlighted.closest('.select2-result').data("select2-data");
+
+            if (data) {
+                this.highlight(index);
+                this.onSelect(data, options);
+            }
+        },
+
+        // abstract
+        getPlaceholder: function () {
+
+            // if a placeholder is specified on a select without the first empty option ignore it
+            if (this.select) {
+               if (this.select.find("option").first().text() !== "") {
+                   return undefined;
+               }
+            }
+
+            return this.opts.element.attr("placeholder") ||
+                this.opts.element.attr("data-placeholder") || // jquery 1.4 compat
+                this.opts.element.data("placeholder") ||
+                this.opts.placeholder;
+        },
+
+        /**
+         * Get the desired width for the container element.  This is
+         * derived first from option `width` passed to select2, then
+         * the inline 'style' on the original element, and finally
+         * falls back to the jQuery calculated element width.
+         */
+        // abstract
+        initContainerWidth: function () {
+            function resolveContainerWidth() {
+                var style, attrs, matches, i, l;
+
+                if (this.opts.width === "off") {
+                    return null;
+                } else if (this.opts.width === "element"){
+                    return this.opts.element.outerWidth(false) === 0 ? 'auto' : this.opts.element.outerWidth(false) + 'px';
+                } else if (this.opts.width === "copy" || this.opts.width === "resolve") {
+                    // check if there is inline style on the element that contains width
+                    style = this.opts.element.attr('style');
+                    if (style !== undefined) {
+                        attrs = style.split(';');
+                        for (i = 0, l = attrs.length; i < l; i = i + 1) {
+                            matches = attrs[i].replace(/\s/g, '')
+                                .match(/width:(([-+]?([0-9]*\.)?[0-9]+)(px|em|ex|%|in|cm|mm|pt|pc))/);
+                            if (matches !== null && matches.length >= 1)
+                                return matches[1];
+                        }
+                    }
+
+                    if (this.opts.width === "resolve") {
+                        // next check if css('width') can resolve a width that is percent based, this is sometimes possible
+                        // when attached to input type=hidden or elements hidden via css
+                        style = this.opts.element.css('width');
+                        if (style.indexOf("%") > 0) return style;
+
+                        // finally, fallback on the calculated width of the element
+                        return (this.opts.element.outerWidth(false) === 0 ? 'auto' : this.opts.element.outerWidth(false) + 'px');
+                    }
+
+                    return null;
+                } else if ($.isFunction(this.opts.width)) {
+                    return this.opts.width();
+                } else {
+                    return this.opts.width;
+               }
+            };
+
+            var width = resolveContainerWidth.call(this);
+            if (width !== null) {
+                this.container.attr("style", "width: "+width);
+            }
+        }
+    });
+
+    SingleSelect2 = clazz(AbstractSelect2, {
+
+        // single
+
+		createContainer: function () {
+            var container = $(document.createElement("div")).attr({
+                "class": "select2-container"
+            }).html([
+                "    <a href='javascript:void(0)' onclick='return false;' class='select2-choice'>",
+                "   <span></span><abbr class='select2-search-choice-close' style='display:none;'></abbr>",
+                "   <div><b></b></div>" ,
+                "</a>",
+                "    <div class='select2-drop select2-offscreen'>" ,
+                "   <div class='select2-search'>" ,
+                "       <input type='text' autocomplete='off' class='select2-input'/>" ,
+                "   </div>" ,
+                "   <ul class='select2-results'>" ,
+                "   </ul>" ,
+                "</div>"].join(""));
+            return container;
+        },
+
+        // single
+        disable: function() {
+            if (!this.enabled) return;
+
+            this.parent.disable.apply(this, arguments);
+
+            this.selection.attr("tabIndex", "-1");
+            this.search.attr("tabIndex", "-1");
+        },
+
+        // single
+        enable: function() {
+            if (this.enabled) return;
+
+            this.parent.enable.apply(this, arguments);
+
+            if (this.elementTabIndex) {
+                this.selection.attr("tabIndex", this.elementTabIndex)
+            } else {
+                this.selection.removeAttr("tabIndex");
+            }
+
+            this.search.removeAttr("tabIndex");
+        },
+
+        // single
+        opening: function () {
+            this.search.show();
+            this.parent.opening.apply(this, arguments);
+            this.dropdown.removeClass("select2-offscreen");
+        },
+
+        // single
+        close: function () {
+            if (!this.opened()) return;
+            this.parent.close.apply(this, arguments);
+            this.dropdown.removeAttr("style").addClass("select2-offscreen").insertAfter(this.selection).show();
+        },
+
+        // single
+        focus: function () {
+            this.close();
+            this.selection.focus();
+            this.opts.element.triggerHandler("focus");
+        },
+
+        // single
+        isFocused: function () {
+            return this.selection[0] === document.activeElement;
+        },
+
+        // single
+        cancel: function () {
+            this.parent.cancel.apply(this, arguments);
+            this.selection.focus();
+        },
+
+        // single
+        initContainer: function () {
+
+            var selection,
+                container = this.container,
+                dropdown = this.dropdown,
+                clickingInside = false;
+
+            this.selection = selection = container.find(".select2-choice");
+
+            this.search.bind("keydown", this.bind(function (e) {
+                if (!this.enabled) return;
+
+                if (e.which === KEY.PAGE_UP || e.which === KEY.PAGE_DOWN) {
+                    // prevent the page from scrolling
+                    killEvent(e);
+                    return;
+                }
+
+                if (this.opened()) {
+                    switch (e.which) {
+                        case KEY.UP:
+                        case KEY.DOWN:
+                            this.moveHighlight((e.which === KEY.UP) ? -1 : 1);
+                            killEvent(e);
+                            return;
+                        case KEY.TAB:
+                        case KEY.ENTER:
+                            this.selectHighlighted();
+                            killEvent(e);
+                            return;
+                        case KEY.ESC:
+                            this.cancel(e);
+                            killEvent(e);
+                            return;
+                    }
+                } else {
+
+                    if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e) || e.which === KEY.ESC) {
+                        return;
+                    }
+
+                    if (this.opts.openOnEnter === false && e.which === KEY.ENTER) {
+                        return;
+                    }
+
+                    this.open();
+
+                    if (e.which === KEY.ENTER) {
+                        // do not propagate the event otherwise we open, and propagate enter which closes
+                        return;
+                    }
+                }
+            }));
+
+            this.search.bind("focus", this.bind(function() {
+                this.selection.attr("tabIndex", "-1");
+            }));
+            this.search.bind("blur", this.bind(function() {
+                if (!this.opened()) this.container.removeClass("select2-container-active");
+                window.setTimeout(this.bind(function() {
+                    // restore original tab index
+                    var ti=this.elementTabIndex || 0;
+                    if (ti) {
+                        this.selection.attr("tabIndex", ti);
+                    } else {
+                        this.selection.removeAttr("tabIndex");
+                    }
+                }), 10);
+            }));
+
+            selection.delegate("abbr", "mousedown", this.bind(function (e) {
+                if (!this.enabled) return;
+                this.clear();
+                killEventImmediately(e);
+                this.close();
+                this.triggerChange();
+                this.selection.focus();
+            }));
+
+            selection.bind("mousedown", this.bind(function (e) {
+                clickingInside = true;
+
+                if (this.opened()) {
+                    this.close();
+                    this.selection.focus();
+                } else if (this.enabled) {
+                    this.open();
+                }
+
+                clickingInside = false;
+            }));
+
+            dropdown.bind("mousedown", this.bind(function() { this.search.focus(); }));
+
+            selection.bind("focus", this.bind(function() {
+                if (!this.enabled) return;
+
+                this.container.addClass("select2-container-active");
+                // hide the search so the tab key does not focus on it
+                this.search.attr("tabIndex", "-1");
+            }));
+
+            selection.bind("blur", this.bind(function() {
+                if (!this.opened()) {
+                    this.container.removeClass("select2-container-active");
+                }
+                window.setTimeout(this.bind(function() { this.search.attr("tabIndex", this.elementTabIndex || 0); }), 10);
+            }));
+
+            selection.bind("keydown", this.bind(function(e) {
+                if (!this.enabled) return;
+
+                if (e.which == KEY.DOWN || e.which == KEY.UP
+                    || (e.which == KEY.ENTER && this.opts.openOnEnter)) {
+                    this.open();
+                    killEvent(e);
+                    return;
+                }
+
+                if (e.which == KEY.DELETE || e.which == KEY.BACKSPACE) {
+                    if (this.opts.allowClear) {
+                        this.clear();
+                    }
+                    killEvent(e);
+                    return;
+                }
+            }));
+            selection.bind("keypress", this.bind(function(e) {
+		if (e.which == KEY.DELETE || e.which == KEY.BACKSPACE || e.which == KEY.TAB || e.which == KEY.ENTER || e.which == 0) {
+			return
+		}
+                var key = String.fromCharCode(e.which);
+                this.search.val(key);
+                this.open();
+            }));
+
+            this.setPlaceholder();
+
+            this.search.bind("focus", this.bind(function() {
+                this.container.addClass("select2-container-active");
+            }));
+        },
+
+        // single
+        clear: function() {
+            this.opts.element.val("");
+            this.selection.find("span").empty();
+            this.selection.removeData("select2-data");
+            this.setPlaceholder();
+        },
+
+        /**
+         * Sets selection based on source element's value
+         */
+        // single
+        initSelection: function () {
+            var selected;
+            if (this.opts.element.val() === "" && this.opts.element.text() === "") {
+                this.close();
+                this.setPlaceholder();
+            } else {
+                var self = this;
+                this.opts.initSelection.call(null, this.opts.element, function(selected){
+                    if (selected !== undefined && selected !== null) {
+                        self.updateSelection(selected);
+                        self.close();
+                        self.setPlaceholder();
+                    }
+                });
+            }
+        },
+
+        // single
+        prepareOpts: function () {
+            var opts = this.parent.prepareOpts.apply(this, arguments);
+
+            if (opts.element.get(0).tagName.toLowerCase() === "select") {
+                // install the selection initializer
+                opts.initSelection = function (element, callback) {
+                    var selected = element.find(":selected");
+                    // a single select box always has a value, no need to null check 'selected'
+                    if ($.isFunction(callback))
+                        callback({id: selected.attr("value"), text: selected.text(), element:selected});
+                };
+            } else if ("data" in opts) {
+                // install default initSelection when applied to hidden input and data is local
+                opts.initSelection = opts.initSelection || function (element, callback) {
+                    var id = element.val();
+                    //search in data by id
+                    opts.query({
+                        matcher: function(term, text, el){
+                            return equal(id, opts.id(el));
+                        },
+                        callback: !$.isFunction(callback) ? $.noop : function(filtered) {
+                            callback(filtered.results.length ? filtered.results[0] : null);
+                        }
+                    });
+                };
+            }
+
+            return opts;
+        },
+
+        // single
+        setPlaceholder: function () {
+            var placeholder = this.getPlaceholder();
+
+            if (this.opts.element.val() === "" && placeholder !== undefined) {
+
+                // check for a first blank option if attached to a select
+                if (this.select && this.select.find("option:first").text() !== "") return;
+
+                this.selection.find("span").html(this.opts.escapeMarkup(placeholder));
+
+                this.selection.addClass("select2-default");
+
+                this.selection.find("abbr").hide();
+            }
+        },
+
+        // single
+        postprocessResults: function (data, initial) {
+            var selected = 0, self = this, showSearchInput = true;
+
+            // find the selected element in the result list
+
+            this.findHighlightableChoices().each2(function (i, elm) {
+                if (equal(self.id(elm.data("select2-data")), self.opts.element.val())) {
+                    selected = i;
+                    return false;
+                }
+            });
+
+            // and highlight it
+
+            this.highlight(selected);
+
+            // hide the search box if this is the first we got the results and there are a few of them
+
+            if (initial === true) {
+                showSearchInput = this.showSearchInput = countResults(data.results) >= this.opts.minimumResultsForSearch;
+                this.dropdown.find(".select2-search")[showSearchInput ? "removeClass" : "addClass"]("select2-search-hidden");
+
+                //add "select2-with-searchbox" to the container if search box is shown
+                $(this.dropdown, this.container)[showSearchInput ? "addClass" : "removeClass"]("select2-with-searchbox");
+            }
+
+        },
+
+        // single
+        onSelect: function (data, options) {
+            var old = this.opts.element.val();
+
+            this.opts.element.val(this.id(data));
+            this.updateSelection(data);
+            this.close();
+
+            if (!options || !options.noFocus)
+                this.selection.focus();
+
+            if (!equal(old, this.id(data))) { this.triggerChange(); }
+        },
+
+        // single
+        updateSelection: function (data) {
+
+            var container=this.selection.find("span"), formatted;
+
+            this.selection.data("select2-data", data);
+
+            container.empty();
+            formatted=this.opts.formatSelection(data, container);
+            if (formatted !== undefined) {
+                container.append(this.opts.escapeMarkup(formatted));
+            }
+
+            this.selection.removeClass("select2-default");
+
+            if (this.opts.allowClear && this.getPlaceholder() !== undefined) {
+                this.selection.find("abbr").show();
+            }
+        },
+
+        // single
+        val: function () {
+            var val, triggerChange = false, data = null, self = this;
+
+            if (arguments.length === 0) {
+                return this.opts.element.val();
+            }
+
+            val = arguments[0];
+
+            if (arguments.length > 1) {
+                triggerChange = arguments[1];
+            }
+
+            if (this.select) {
+                this.select
+                    .val(val)
+                    .find(":selected").each2(function (i, elm) {
+                        data = {id: elm.attr("value"), text: elm.text()};
+                        return false;
+                    });
+                this.updateSelection(data);
+                this.setPlaceholder();
+                if (triggerChange) {
+                    this.triggerChange();
+                }
+            } else {
+                if (this.opts.initSelection === undefined) {
+                    throw new Error("cannot call val() if initSelection() is not defined");
+                }
+                // val is an id. !val is true for [undefined,null,'',0] - 0 is legal
+                if (!val && val !== 0) {
+                    this.clear();
+                    if (triggerChange) {
+                        this.triggerChange();
+                    }
+                    return;
+                }
+                this.opts.element.val(val);
+                this.opts.initSelection(this.opts.element, function(data){
+                    self.opts.element.val(!data ? "" : self.id(data));
+                    self.updateSelection(data);
+                    self.setPlaceholder();
+                    self.triggerChange();
+                });
+            }
+        },
+
+        // single
+        clearSearch: function () {
+            this.search.val("");
+        },
+
+        // single
+        data: function(value) {
+            var data;
+
+            if (arguments.length === 0) {
+                data = this.selection.data("select2-data");
+                if (data == undefined) data = null;
+                return data;
+            } else {
+                if (!value || value === "") {
+                    this.clear();
+                } else {
+                    this.opts.element.val(!value ? "" : this.id(value));
+                    this.updateSelection(value);
+                }
+            }
+        }
+    });
+
+    MultiSelect2 = clazz(AbstractSelect2, {
+
+        // multi
+        createContainer: function () {
+            var container = $(document.createElement("div")).attr({
+                "class": "select2-container select2-container-multi"
+            }).html([
+                "    <ul class='select2-choices'>",
+                //"<li class='select2-search-choice'><span>California</span><a href="javascript:void(0)" class="select2-search-choice-close"></a></li>" ,
+                "  <li class='select2-search-field'>" ,
+                "    <input type='text' autocomplete='off' class='select2-input'>" ,
+                "  </li>" ,
+                "</ul>" ,
+                "<div class='select2-drop select2-drop-multi' style='display:none;'>" ,
+                "   <ul class='select2-results'>" ,
+                "   </ul>" ,
+                "</div>"].join(""));
+			return container;
+        },
+
+        // multi
+        prepareOpts: function () {
+            var opts = this.parent.prepareOpts.apply(this, arguments);
+
+            // TODO validate placeholder is a string if specified
+
+            if (opts.element.get(0).tagName.toLowerCase() === "select") {
+                // install sthe selection initializer
+                opts.initSelection = function (element,callback) {
+
+                    var data = [];
+                    element.find(":selected").each2(function (i, elm) {
+                        data.push({id: elm.attr("value"), text: elm.text(), element: elm});
+                    });
+
+                    if ($.isFunction(callback))
+                        callback(data);
+                };
+            } else if ("data" in opts) {
+                // install default initSelection when applied to hidden input and data is local
+                opts.initSelection = opts.initSelection || function (element, callback) {
+                    var ids = splitVal(element.val(), opts.separator);
+                    //search in data by array of ids
+                    opts.query({
+                        matcher: function(term, text, el){
+                            return $.grep(ids, function(id) {
+                                return equal(id, opts.id(el));
+                            }).length;
+                        },
+                        callback: !$.isFunction(callback) ? $.noop : function(filtered) {
+                            callback(filtered.results);
+                        }
+                    });
+                };
+            }
+
+            return opts;
+        },
+
+        // multi
+        initContainer: function () {
+
+            var selector = ".select2-choices", selection;
+
+            this.searchContainer = this.container.find(".select2-search-field");
+            this.selection = selection = this.container.find(selector);
+
+            this.search.bind("keydown", this.bind(function (e) {
+                if (!this.enabled) return;
+
+                if (e.which === KEY.BACKSPACE && this.search.val() === "") {
+                    this.close();
+
+                    var choices,
+                        selected = selection.find(".select2-search-choice-focus");
+                    if (selected.length > 0) {
+                        this.unselect(selected.first());
+                        this.search.width(10);
+                        killEvent(e);
+                        return;
+                    }
+
+                    choices = selection.find(".select2-search-choice:not(.select2-locked)");
+                    if (choices.length > 0) {
+                        choices.last().addClass("select2-search-choice-focus");
+                    }
+                } else {
+                    selection.find(".select2-search-choice-focus").removeClass("select2-search-choice-focus");
+                }
+
+                if (this.opened()) {
+                    switch (e.which) {
+                    case KEY.UP:
+                    case KEY.DOWN:
+                        this.moveHighlight((e.which === KEY.UP) ? -1 : 1);
+                        killEvent(e);
+                        return;
+                    case KEY.ENTER:
+                    case KEY.TAB:
+                        this.selectHighlighted();
+                        killEvent(e);
+                        return;
+                    case KEY.ESC:
+                        this.cancel(e);
+                        killEvent(e);
+                        return;
+                    }
+                }
+
+                if (e.which === KEY.TAB || KEY.isControl(e) || KEY.isFunctionKey(e)
+                 || e.which === KEY.BACKSPACE || e.which === KEY.ESC) {
+                    return;
+                }
+
+                if (this.opts.openOnEnter === false && e.which === KEY.ENTER) {
+                    return;
+                }
+
+                this.open();
+
+                if (e.which === KEY.PAGE_UP || e.which === KEY.PAGE_DOWN) {
+                    // prevent the page from scrolling
+                    killEvent(e);
+                }
+            }));
+
+            this.search.bind("keyup", this.bind(this.resizeSearch));
+
+            this.search.bind("blur", this.bind(function(e) {
+                this.container.removeClass("select2-container-active");
+                this.search.removeClass("select2-focused");
+                if (!this.opened()) this.clearSearch();
+                e.stopImmediatePropagation();
+            }));
+
+            this.container.delegate(selector, "mousedown", this.bind(function (e) {
+                if (!this.enabled) return;
+                if ($(e.target).closest(".select2-search-choice").length > 0) {
+                    // clicked inside a select2 search choice, do not open
+                    return;
+                }
+                this.clearPlaceholder();
+                this.open();
+                this.focusSearch();
+                e.preventDefault();
+            }));
+
+            this.container.delegate(selector, "focus", this.bind(function () {
+                if (!this.enabled) return;
+                this.container.addClass("select2-container-active");
+                this.dropdown.addClass("select2-drop-active");
+                this.clearPlaceholder();
+            }));
+
+            // set the placeholder if necessary
+            this.clearSearch();
+        },
+
+        // multi
+        enable: function() {
+            if (this.enabled) return;
+
+            this.parent.enable.apply(this, arguments);
+
+            this.search.removeAttr("disabled");
+        },
+
+        // multi
+        disable: function() {
+            if (!this.enabled) return;
+
+            this.parent.disable.apply(this, arguments);
+
+            this.search.attr("disabled", true);
+        },
+
+        // multi
+        initSelection: function () {
+            var data;
+            if (this.opts.element.val() === "" && this.opts.element.text() === "") {
+                this.updateSelection([]);
+                this.close();
+                // set the placeholder if necessary
+                this.clearSearch();
+            }
+            if (this.select || this.opts.element.val() !== "") {
+                var self = this;
+                this.opts.initSelection.call(null, this.opts.element, function(data){
+                    if (data !== undefined && data !== null) {
+                        self.updateSelection(data);
+                        self.close();
+                        // set the placeholder if necessary
+                        self.clearSearch();
+                    }
+                });
+            }
+        },
+
+        // multi
+        clearSearch: function () {
+            var placeholder = this.getPlaceholder();
+
+            if (placeholder !== undefined  && this.getVal().length === 0 && this.search.hasClass("select2-focused") === false) {
+                this.search.val(placeholder).addClass("select2-default");
+                // stretch the search box to full width of the container so as much of the placeholder is visible as possible
+                this.resizeSearch();
+            } else {
+                // we set this to " " instead of "" and later clear it on focus() because there is a firefox bug
+                // that does not properly render the caret when the field starts out blank
+                this.search.val(" ").width(10);
+            }
+        },
+
+        // multi
+        clearPlaceholder: function () {
+            if (this.search.hasClass("select2-default")) {
+                this.search.val("").removeClass("select2-default");
+            } else {
+                // work around for the space character we set to avoid firefox caret bug
+                if (this.search.val() === " ") this.search.val("");
+            }
+        },
+
+        // multi
+        opening: function () {
+            this.parent.opening.apply(this, arguments);
+
+            this.clearPlaceholder();
+			this.resizeSearch();
+            this.focusSearch();
+        },
+
+        // multi
+        close: function () {
+            if (!this.opened()) return;
+            this.parent.close.apply(this, arguments);
+        },
+
+        // multi
+        focus: function () {
+            this.close();
+            this.search.focus();
+            this.opts.element.triggerHandler("focus");
+        },
+
+        // multi
+        isFocused: function () {
+            return this.search.hasClass("select2-focused");
+        },
+
+        // multi
+        updateSelection: function (data) {
+            var ids = [], filtered = [], self = this;
+
+            // filter out duplicates
+            $(data).each(function () {
+                if (indexOf(self.id(this), ids) < 0) {
+                    ids.push(self.id(this));
+                    filtered.push(this);
+                }
+            });
+            data = filtered;
+
+            this.selection.find(".select2-search-choice").remove();
+            $(data).each(function () {
+                self.addSelectedChoice(this);
+            });
+            self.postprocessResults();
+        },
+
+        tokenize: function() {
+            var input = this.search.val();
+            input = this.opts.tokenizer(input, this.data(), this.bind(this.onSelect), this.opts);
+            if (input != null && input != undefined) {
+                this.search.val(input);
+                if (input.length > 0) {
+                    this.open();
+                }
+            }
+
+        },
+
+        // multi
+        onSelect: function (data, options) {
+            this.addSelectedChoice(data);
+            if (this.select || !this.opts.closeOnSelect) this.postprocessResults();
+
+            if (this.opts.closeOnSelect) {
+                this.close();
+                this.search.width(10);
+            } else {
+                if (this.countSelectableResults()>0) {
+                    this.search.width(10);
+                    this.resizeSearch();
+                    this.positionDropdown();
+                } else {
+                    // if nothing left to select close
+                    this.close();
+                }
+            }
+
+            // since its not possible to select an element that has already been
+            // added we do not need to check if this is a new element before firing change
+            this.triggerChange({ added: data });
+
+            if (!options || !options.noFocus)
+                this.focusSearch();
+        },
+
+        // multi
+        cancel: function () {
+            this.close();
+            this.focusSearch();
+        },
+
+        addSelectedChoice: function (data) {
+            var enableChoice = !data.locked,
+                enabledItem = $(
+                    "<li class='select2-search-choice'>" +
+                    "    <div></div>" +
+                    "    <a href='#' onclick='return false;' class='select2-search-choice-close' tabindex='-1'></a>" +
+                    "</li>"),
+                disabledItem = $(
+                    "<li class='select2-search-choice select2-locked'>" +
+                    "<div></div>" +
+                    "</li>");
+            var choice = enableChoice ? enabledItem : disabledItem,
+                id = this.id(data),
+                val = this.getVal(),
+                formatted;
+
+            formatted=this.opts.formatSelection(data, choice.find("div"));
+            if (formatted != undefined) {
+                choice.find("div").replaceWith("<div>"+this.opts.escapeMarkup(formatted)+"</div>");
+            }
+
+            if(enableChoice){
+              choice.find(".select2-search-choice-close")
+                  .bind("mousedown", killEvent)
+                  .bind("click dblclick", this.bind(function (e) {
+                  if (!this.enabled) return;
+
+                  $(e.target).closest(".select2-search-choice").fadeOut('fast', this.bind(function(){
+                      this.unselect($(e.target));
+                      this.selection.find(".select2-search-choice-focus").removeClass("select2-search-choice-focus");
+                      this.close();
+                      this.focusSearch();
+                  })).dequeue();
+                  killEvent(e);
+              })).bind("focus", this.bind(function () {
+                  if (!this.enabled) return;
+                  this.container.addClass("select2-container-active");
+                  this.dropdown.addClass("select2-drop-active");
+              }));
+            }
+
+            choice.data("select2-data", data);
+            choice.insertBefore(this.searchContainer);
+
+            val.push(id);
+            this.setVal(val);
+        },
+
+        // multi
+        unselect: function (selected) {
+            var val = this.getVal(),
+                data,
+                index;
+
+            selected = selected.closest(".select2-search-choice");
+
+            if (selected.length === 0) {
+                throw "Invalid argument: " + selected + ". Must be .select2-search-choice";
+            }
+
+            data = selected.data("select2-data");
+
+            if (!data) {
+                // prevent a race condition when the 'x' is clicked really fast repeatedly the event can be queued
+                // and invoked on an element already removed
+                return;
+            }
+
+            index = indexOf(this.id(data), val);
+
+            if (index >= 0) {
+                val.splice(index, 1);
+                this.setVal(val);
+                if (this.select) this.postprocessResults();
+            }
+            selected.remove();
+            this.triggerChange({ removed: data });
+        },
+
+        // multi
+        postprocessResults: function () {
+            var val = this.getVal(),
+                choices = this.results.find(".select2-result"),
+                compound = this.results.find(".select2-result-with-children"),
+                self = this;
+
+            choices.each2(function (i, choice) {
+                var id = self.id(choice.data("select2-data"));
+                if (indexOf(id, val) >= 0) {
+                    choice.addClass("select2-selected");
+                    // mark all children of the selected parent as selected
+                    choice.find(".select2-result-selectable").addClass("select2-selected");
+                }
+            });
+
+            compound.each2(function(i, choice) {
+                // hide an optgroup if it doesnt have any selectable children
+                if (!choice.is('.select2-result-selectable')
+                    && choice.find(".select2-result-selectable:not(.select2-selected)").length === 0) {
+                    choice.addClass("select2-selected");
+                }
+            });
+
+            if (this.highlight() == -1){
+                self.highlight(0);
+            }
+
+        },
+
+        // multi
+        resizeSearch: function () {
+
+            var minimumWidth, left, maxWidth, containerLeft, searchWidth,
+            	sideBorderPadding = getSideBorderPadding(this.search);
+
+            minimumWidth = measureTextWidth(this.search) + 10;
+
+            left = this.search.offset().left;
+
+            maxWidth = this.selection.width();
+            containerLeft = this.selection.offset().left;
+
+            searchWidth = maxWidth - (left - containerLeft) - sideBorderPadding;
+            if (searchWidth < minimumWidth) {
+                searchWidth = maxWidth - sideBorderPadding;
+            }
+
+            if (searchWidth < 40) {
+                searchWidth = maxWidth - sideBorderPadding;
+            }
+
+            if (searchWidth <= 0) {
+              searchWidth = minimumWidth
+            }
+
+            this.search.width(searchWidth);
+        },
+
+        // multi
+        getVal: function () {
+            var val;
+            if (this.select) {
+                val = this.select.val();
+                return val === null ? [] : val;
+            } else {
+                val = this.opts.element.val();
+                return splitVal(val, this.opts.separator);
+            }
+        },
+
+        // multi
+        setVal: function (val) {
+            var unique;
+            if (this.select) {
+                this.select.val(val);
+            } else {
+                unique = [];
+                // filter out duplicates
+                $(val).each(function () {
+                    if (indexOf(this, unique) < 0) unique.push(this);
+                });
+                this.opts.element.val(unique.length === 0 ? "" : unique.join(this.opts.separator));
+            }
+        },
+
+        // multi
+        val: function () {
+            var val, triggerChange = false, data = [], self=this;
+
+            if (arguments.length === 0) {
+                return this.getVal();
+            }
+
+            val = arguments[0];
+
+            if (arguments.length > 1) {
+                triggerChange = arguments[1];
+            }
+
+            // val is an id. !val is true for [undefined,null,'',0] - 0 is legal
+            if (!val && val !== 0) {
+                this.opts.element.val("");
+                this.updateSelection([]);
+                this.clearSearch();
+                if (triggerChange) {
+                    this.triggerChange();
+                }
+                return;
+            }
+
+            // val is a list of ids
+            this.setVal(val);
+
+            if (this.select) {
+                this.select.find(":selected").each(function () {
+                    data.push({id: $(this).attr("value"), text: $(this).text()});
+                });
+                this.updateSelection(data);
+                if (triggerChange) {
+                    this.triggerChange();
+                }
+            } else {
+                if (this.opts.initSelection === undefined) {
+                    throw new Error("val() cannot be called if initSelection() is not defined")
+                }
+
+                this.opts.initSelection(this.opts.element, function(data){
+                    var ids=$(data).map(self.id);
+                    self.setVal(ids);
+                    self.updateSelection(data);
+                    self.clearSearch();
+                    if (triggerChange) {
+                        self.triggerChange();
+                    }
+                });
+            }
+            this.clearSearch();
+        },
+
+        // multi
+        onSortStart: function() {
+            if (this.select) {
+                throw new Error("Sorting of elements is not supported when attached to <select>. Attach to <input type='hidden'/> instead.");
+            }
+
+            // collapse search field into 0 width so its container can be collapsed as well
+            this.search.width(0);
+            // hide the container
+            this.searchContainer.hide();
+        },
+
+        // multi
+        onSortEnd:function() {
+
+            var val=[], self=this;
+
+            // show search and move it to the end of the list
+            this.searchContainer.show();
+            // make sure the search container is the last item in the list
+            this.searchContainer.appendTo(this.searchContainer.parent());
+            // since we collapsed the width in dragStarted, we resize it here
+            this.resizeSearch();
+
+            // update selection
+
+            this.selection.find(".select2-search-choice").each(function() {
+                val.push(self.opts.id($(this).data("select2-data")));
+            });
+            this.setVal(val);
+            this.triggerChange();
+        },
+
+        // multi
+        data: function(values) {
+            var self=this, ids;
+            if (arguments.length === 0) {
+                 return this.selection
+                     .find(".select2-search-choice")
+                     .map(function() { return $(this).data("select2-data"); })
+                     .get();
+            } else {
+                if (!values) { values = []; }
+                ids = $.map(values, function(e) { return self.opts.id(e)});
+                this.setVal(ids);
+                this.updateSelection(values);
+                this.clearSearch();
+            }
+        }
+    });
+
+    $.fn.select2 = function () {
+
+        var args = Array.prototype.slice.call(arguments, 0),
+            opts,
+            select2,
+            value, multiple, allowedMethods = ["val", "destroy", "opened", "open", "close", "focus", "isFocused", "container", "onSortStart", "onSortEnd", "enable", "disable", "positionDropdown", "data"];
+
+        this.each(function () {
+            if (args.length === 0 || typeof(args[0]) === "object") {
+                opts = args.length === 0 ? {} : $.extend({}, args[0]);
+                opts.element = $(this);
+
+                if (opts.element.get(0).tagName.toLowerCase() === "select") {
+                    multiple = opts.element.attr("multiple");
+                } else {
+                    multiple = opts.multiple || false;
+                    if ("tags" in opts) {opts.multiple = multiple = true;}
+                }
+
+                select2 = multiple ? new MultiSelect2() : new SingleSelect2();
+                select2.init(opts);
+            } else if (typeof(args[0]) === "string") {
+
+                if (indexOf(args[0], allowedMethods) < 0) {
+                    throw "Unknown method: " + args[0];
+                }
+
+                value = undefined;
+                select2 = $(this).data("select2");
+                if (select2 === undefined) return;
+                if (args[0] === "container") {
+                    value=select2.container;
+                } else {
+                    value = select2[args[0]].apply(select2, args.slice(1));
+                }
+                if (value !== undefined) {return false;}
+            } else {
+                throw "Invalid arguments to select2 plugin: " + args;
+            }
+        });
+        return (value === undefined) ? this : value;
+    };
+
+    // plugin defaults, accessible to users
+    $.fn.select2.defaults = {
+        width: "copy",
+        loadMorePadding: 0,
+        closeOnSelect: true,
+        openOnEnter: true,
+        containerCss: {},
+        dropdownCss: {},
+        containerCssClass: "",
+        dropdownCssClass: "",
+        formatResult: function(result, container, query, escapeMarkup) {
+            var markup=[];
+            markMatch(result.text, query.term, markup, escapeMarkup);
+            return markup.join("");
+        },
+        formatSelection: function (data, container) {
+            return data ? data.text : undefined;
+        },
+        sortResults: function (results, container, query) {
+            return results;
+        },
+        formatResultCssClass: function(data) {return undefined;},
+        formatNoMatches: function () { return "No matches found"; },
+        formatInputTooShort: function (input, min) { var n = min - input.length; return "Please enter " + n + " more character" + (n == 1? "" : "s"); },
+        formatInputTooLong: function (input, max) { var n = input.length - max; return "Please enter " + n + " less character" + (n == 1? "" : "s"); },
+        formatSelectionTooBig: function (limit) { return "You can only select " + limit + " item" + (limit == 1 ? "" : "s"); },
+        formatLoadMore: function (pageNumber) { return "Loading more results..."; },
+        formatSearching: function () { return "Searching..."; },
+        minimumResultsForSearch: 0,
+        minimumInputLength: 0,
+        maximumInputLength: null,
+        maximumSelectionSize: 0,
+        id: function (e) { return e.id; },
+        matcher: function(term, text) {
+            return text.toUpperCase().indexOf(term.toUpperCase()) >= 0;
+        },
+        separator: ",",
+        tokenSeparators: [],
+        tokenizer: defaultTokenizer,
+        escapeMarkup: function (markup) {
+            var replace_map = {
+                '\\': '&#92;',
+                '&': '&amp;',
+                '<': '&lt;',
+                '>': '&gt;',
+                '"': '&quot;',
+                "'": '&apos;',
+                "/": '&#47;'
+            };
+
+            return String(markup).replace(/[&<>"'/\\]/g, function (match) {
+                    return replace_map[match[0]];
+            });
+        },
+        blurOnChange: false,
+        selectOnBlur: false
+    };
+
+    // exports
+    window.Select2 = {
+        query: {
+            ajax: ajax,
+            local: local,
+            tags: tags
+        }, util: {
+            debounce: debounce,
+            markMatch: markMatch
+        }, "class": {
+            "abstract": AbstractSelect2,
+            "single": SingleSelect2,
+            "multi": MultiSelect2
+        }
+    };
+
+}(jQuery));
diff --git a/select2-3.3.0/select2.min.js b/select2-3.3.0/select2.min.js
new file mode 100755
index 00000000..7befda91
--- /dev/null
+++ b/select2-3.3.0/select2.min.js
@@ -0,0 +1,560 @@
+/*
+Copyright 2012 Igor Vaynberg
+ 
+Version: 3.3.0 Timestamp: Tue Feb  5 18:33:54 PST 2013
+
+This software is licensed under the Apache License, Version 2.0 (the "Apache License") or the GNU 
+General Public License version 2 (the "GPL License"). You may choose either license to govern your 
+use of this software only upon the condition that you accept all of the terms of either the Apache 
+License or the GPL License. 
+
+You may obtain a copy of the Apache License and the GPL License at:
+
+http://www.apache.org/licenses/LICENSE-2.0
+http://www.gnu.org/licenses/gpl-2.0.html
+
+Unless required by applicable law or agreed to in writing, software distributed under the Apache License 
+or the GPL Licesnse is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, 
+either express or implied. See the Apache License and the GPL License for the specific language governing 
+permissions and limitations under the Apache License and the GPL License.
+
+LICENSE #1: Apache License, Version 2.0
+
+LICENSE #2: GPL v2
+
+************************************************************
+
+LICENSE #1:
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+************************************************************
+
+LICENSE #2:
+
+                    GNU GENERAL PUBLIC LICENSE
+                       Version 2, June 1991
+
+ Copyright (C) 1989, 1991 Free Software Foundation, Inc.,
+ 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The licenses for most software are designed to take away your
+freedom to share and change it.  By contrast, the GNU General Public
+License is intended to guarantee your freedom to share and change free
+software--to make sure the software is free for all its users.  This
+General Public License applies to most of the Free Software
+Foundation's software and to any other program whose authors commit to
+using it.  (Some other Free Software Foundation software is covered by
+the GNU Lesser General Public License instead.)  You can apply it to
+your programs, too.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+this service if you wish), that you receive source code or can get it
+if you want it, that you can change the software or use pieces of it
+in new free programs; and that you know you can do these things.
+
+  To protect your rights, we need to make restrictions that forbid
+anyone to deny you these rights or to ask you to surrender the rights.
+These restrictions translate to certain responsibilities for you if you
+distribute copies of the software, or if you modify it.
+
+  For example, if you distribute copies of such a program, whether
+gratis or for a fee, you must give the recipients all the rights that
+you have.  You must make sure that they, too, receive or can get the
+source code.  And you must show them these terms so they know their
+rights.
+
+  We protect your rights with two steps: (1) copyright the software, and
+(2) offer you this license which gives you legal permission to copy,
+distribute and/or modify the software.
+
+  Also, for each author's protection and ours, we want to make certain
+that everyone understands that there is no warranty for this free
+software.  If the software is modified by someone else and passed on, we
+want its recipients to know that what they have is not the original, so
+that any problems introduced by others will not reflect on the original
+authors' reputations.
+
+  Finally, any free program is threatened constantly by software
+patents.  We wish to avoid the danger that redistributors of a free
+program will individually obtain patent licenses, in effect making the
+program proprietary.  To prevent this, we have made it clear that any
+patent must be licensed for everyone's free use or not licensed at all.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                    GNU GENERAL PUBLIC LICENSE
+   TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
+
+  0. This License applies to any program or other work which contains
+a notice placed by the copyright holder saying it may be distributed
+under the terms of this General Public License.  The "Program", below,
+refers to any such program or work, and a "work based on the Program"
+means either the Program or any derivative work under copyright law:
+that is to say, a work containing the Program or a portion of it,
+either verbatim or with modifications and/or translated into another
+language.  (Hereinafter, translation is included without limitation in
+the term "modification".)  Each licensee is addressed as "you".
+
+Activities other than copying, distribution and modification are not
+covered by this License; they are outside its scope.  The act of
+running the Program is not restricted, and the output from the Program
+is covered only if its contents constitute a work based on the
+Program (independent of having been made by running the Program).
+Whether that is true depends on what the Program does.
+
+  1. You may copy and distribute verbatim copies of the Program's
+source code as you receive it, in any medium, provided that you
+conspicuously and appropriately publish on each copy an appropriate
+copyright notice and disclaimer of warranty; keep intact all the
+notices that refer to this License and to the absence of any warranty;
+and give any other recipients of the Program a copy of this License
+along with the Program.
+
+You may charge a fee for the physical act of transferring a copy, and
+you may at your option offer warranty protection in exchange for a fee.
+
+  2. You may modify your copy or copies of the Program or any portion
+of it, thus forming a work based on the Program, and copy and
+distribute such modifications or work under the terms of Section 1
+above, provided that you also meet all of these conditions:
+
+    a) You must cause the modified files to carry prominent notices
+    stating that you changed the files and the date of any change.
+
+    b) You must cause any work that you distribute or publish, that in
+    whole or in part contains or is derived from the Program or any
+    part thereof, to be licensed as a whole at no charge to all third
+    parties under the terms of this License.
+
+    c) If the modified program normally reads commands interactively
+    when run, you must cause it, when started running for such
+    interactive use in the most ordinary way, to print or display an
+    announcement including an appropriate copyright notice and a
+    notice that there is no warranty (or else, saying that you provide
+    a warranty) and that users may redistribute the program under
+    these conditions, and telling the user how to view a copy of this
+    License.  (Exception: if the Program itself is interactive but
+    does not normally print such an announcement, your work based on
+    the Program is not required to print an announcement.)
+
+These requirements apply to the modified work as a whole.  If
+identifiable sections of that work are not derived from the Program,
+and can be reasonably considered independent and separate works in
+themselves, then this License, and its terms, do not apply to those
+sections when you distribute them as separate works.  But when you
+distribute the same sections as part of a whole which is a work based
+on the Program, the distribution of the whole must be on the terms of
+this License, whose permissions for other licensees extend to the
+entire whole, and thus to each and every part regardless of who wrote it.
+
+Thus, it is not the intent of this section to claim rights or contest
+your rights to work written entirely by you; rather, the intent is to
+exercise the right to control the distribution of derivative or
+collective works based on the Program.
+
+In addition, mere aggregation of another work not based on the Program
+with the Program (or with a work based on the Program) on a volume of
+a storage or distribution medium does not bring the other work under
+the scope of this License.
+
+  3. You may copy and distribute the Program (or a work based on it,
+under Section 2) in object code or executable form under the terms of
+Sections 1 and 2 above provided that you also do one of the following:
+
+    a) Accompany it with the complete corresponding machine-readable
+    source code, which must be distributed under the terms of Sections
+    1 and 2 above on a medium customarily used for software interchange; or,
+
+    b) Accompany it with a written offer, valid for at least three
+    years, to give any third party, for a charge no more than your
+    cost of physically performing source distribution, a complete
+    machine-readable copy of the corresponding source code, to be
+    distributed under the terms of Sections 1 and 2 above on a medium
+    customarily used for software interchange; or,
+
+    c) Accompany it with the information you received as to the offer
+    to distribute corresponding source code.  (This alternative is
+    allowed only for noncommercial distribution and only if you
+    received the program in object code or executable form with such
+    an offer, in accord with Subsection b above.)
+
+The source code for a work means the preferred form of the work for
+making modifications to it.  For an executable work, complete source
+code means all the source code for all modules it contains, plus any
+associated interface definition files, plus the scripts used to
+control compilation and installation of the executable.  However, as a
+special exception, the source code distributed need not include
+anything that is normally distributed (in either source or binary
+form) with the major components (compiler, kernel, and so on) of the
+operating system on which the executable runs, unless that component
+itself accompanies the executable.
+
+If distribution of executable or object code is made by offering
+access to copy from a designated place, then offering equivalent
+access to copy the source code from the same place counts as
+distribution of the source code, even though third parties are not
+compelled to copy the source along with the object code.
+
+  4. You may not copy, modify, sublicense, or distribute the Program
+except as expressly provided under this License.  Any attempt
+otherwise to copy, modify, sublicense or distribute the Program is
+void, and will automatically terminate your rights under this License.
+However, parties who have received copies, or rights, from you under
+this License will not have their licenses terminated so long as such
+parties remain in full compliance.
+
+  5. You are not required to accept this License, since you have not
+signed it.  However, nothing else grants you permission to modify or
+distribute the Program or its derivative works.  These actions are
+prohibited by law if you do not accept this License.  Therefore, by
+modifying or distributing the Program (or any work based on the
+Program), you indicate your acceptance of this License to do so, and
+all its terms and conditions for copying, distributing or modifying
+the Program or works based on it.
+
+  6. Each time you redistribute the Program (or any work based on the
+Program), the recipient automatically receives a license from the
+original licensor to copy, distribute or modify the Program subject to
+these terms and conditions.  You may not impose any further
+restrictions on the recipients' exercise of the rights granted herein.
+You are not responsible for enforcing compliance by third parties to
+this License.
+
+  7. If, as a consequence of a court judgment or allegation of patent
+infringement or for any other reason (not limited to patent issues),
+conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot
+distribute so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you
+may not distribute the Program at all.  For example, if a patent
+license would not permit royalty-free redistribution of the Program by
+all those who receive copies directly or indirectly through you, then
+the only way you could satisfy both it and this License would be to
+refrain entirely from distribution of the Program.
+
+If any portion of this section is held invalid or unenforceable under
+any particular circumstance, the balance of the section is intended to
+apply and the section as a whole is intended to apply in other
+circumstances.
+
+It is not the purpose of this section to induce you to infringe any
+patents or other property right claims or to contest validity of any
+such claims; this section has the sole purpose of protecting the
+integrity of the free software distribution system, which is
+implemented by public license practices.  Many people have made
+generous contributions to the wide range of software distributed
+through that system in reliance on consistent application of that
+system; it is up to the author/donor to decide if he or she is willing
+to distribute software through any other system and a licensee cannot
+impose that choice.
+
+This section is intended to make thoroughly clear what is believed to
+be a consequence of the rest of this License.
+
+  8. If the distribution and/or use of the Program is restricted in
+certain countries either by patents or by copyrighted interfaces, the
+original copyright holder who places the Program under this License
+may add an explicit geographical distribution limitation excluding
+those countries, so that distribution is permitted only in or among
+countries not thus excluded.  In such case, this License incorporates
+the limitation as if written in the body of this License.
+
+  9. The Free Software Foundation may publish revised and/or new versions
+of the General Public License from time to time.  Such new versions will
+be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+Each version is given a distinguishing version number.  If the Program
+specifies a version number of this License which applies to it and "any
+later version", you have the option of following the terms and conditions
+either of that version or of any later version published by the Free
+Software Foundation.  If the Program does not specify a version number of
+this License, you may choose any version ever published by the Free Software
+Foundation.
+
+  10. If you wish to incorporate parts of the Program into other free
+programs whose distribution conditions are different, write to the author
+to ask for permission.  For software which is copyrighted by the Free
+Software Foundation, write to the Free Software Foundation; we sometimes
+make exceptions for this.  Our decision will be guided by the two goals
+of preserving the free status of all derivatives of our free software and
+of promoting the sharing and reuse of software generally.
+
+                            NO WARRANTY
+
+  11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY
+FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW.  EXCEPT WHEN
+OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES
+PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED
+OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE.  THE ENTIRE RISK AS
+TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU.  SHOULD THE
+PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING,
+REPAIR OR CORRECTION.
+
+  12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR
+REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES,
+INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING
+OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED
+TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY
+YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER
+PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE
+POSSIBILITY OF SUCH DAMAGES.
+
+*/
+(function(f){"undefined"==typeof f.fn.each2&&f.fn.extend({each2:function(g){for(var j=f([0]),m=-1,v=this.length;++m<v&&(j.context=j[0]=this[m])&&!1!==g.call(j[0],m,j););return this}})})(jQuery);
+(function(f,g){function j(a,b){for(var c=0,d=b.length;c<d;c+=1)if(a===b[c])return c;return-1}function m(a,b){return a===b}function v(a,b){var c,d,h;if(null===a||1>a.length)return[];c=a.split(b);d=0;for(h=c.length;d<h;d+=1)c[d]=f.trim(c[d]);return c}function C(a,b,c){c=c||g;var d;return function(){var h=arguments;window.clearTimeout(d);d=window.setTimeout(function(){b.apply(c,h)},a)}}function n(a){a.preventDefault();a.stopPropagation()}function D(a,b,c,d){var h=a.toUpperCase().indexOf(b.toUpperCase());
+b=b.length;0>h?c.push(d(a)):(c.push(d(a.substring(0,h))),c.push("<span class='select2-match'>"),c.push(d(a.substring(h,h+b))),c.push("</span>"),c.push(d(a.substring(h+b,a.length))))}function E(a){var b,c=0,d=null,h=a.quietMillis||100;return function(q){window.clearTimeout(b);b=window.setTimeout(function(){var b=c+=1,h=a.data,l=a.url,p=a.transport||f.ajax,e=a.traditional||!1,g=a.type||"GET",h=h?h.call(this,q.term,q.page,q.context):null,l="function"===typeof l?l.call(this,q.term,q.page,q.context):l;
+null!==d&&d.abort();d=p.call(null,{url:l,dataType:a.dataType,data:h,type:g,traditional:e,success:function(d){b<c||(d=a.results(d,q.page),q.callback(d))}})},h)}}function F(a){var b=a,c,d=function(a){return""+a.text};f.isArray(b)||(d=b.text,f.isFunction(d)||(c=b.text,d=function(a){return a[c]}),b=b.results);return function(a){var c=a.term,k={results:[]},e;""===c?a.callback({results:b}):(e=function(b,k){var g,x;b=b[0];if(b.children){g={};for(x in b)b.hasOwnProperty(x)&&(g[x]=b[x]);g.children=[];f(b.children).each2(function(a,
+b){e(b,g.children)});(g.children.length||a.matcher(c,d(g),b))&&k.push(g)}else a.matcher(c,d(b),b)&&k.push(b)},f(b).each2(function(a,b){e(b,k.results)}),a.callback(k))}}function G(a){var b=f.isFunction(a);return function(c){var d=c.term,h={results:[]};f(b?a():a).each(function(){var a=this.text!==g,b=a?this.text:this;if(""===d||c.matcher(d,b))h.results.push(a?this:{id:this,text:this})});c.callback(h)}}function w(a){if(f.isFunction(a))return!0;if(!a)return!1;throw Error("formatterName must be a function or a falsy value");
+}function y(a){return f.isFunction(a)?a():a}function H(a){var b=0;f.each(a,function(a,d){d.children?b+=H(d.children):b++});return b}function L(a,b,c,d){var h=a,f=!1,k,e,l,p;if(!d.createSearchChoice||!d.tokenSeparators||1>d.tokenSeparators.length)return g;for(;;){f=-1;e=0;for(l=d.tokenSeparators.length;e<l&&!(p=d.tokenSeparators[e],f=a.indexOf(p),0<=f);e++);if(0>f)break;k=a.substring(0,f);a=a.substring(f+p.length);if(0<k.length&&(k=d.createSearchChoice(k,b),k!==g&&null!==k&&d.id(k)!==g&&null!==d.id(k))){f=
+!1;e=0;for(l=b.length;e<l;e++)if(m(d.id(k),d.id(b[e]))){f=!0;break}f||c(k)}}if(h!==a)return a}function z(a,b){var c=function(){};c.prototype=new a;c.prototype.constructor=c;c.prototype.parent=a.prototype;c.prototype=f.extend(c.prototype,b);return c}if(window.Select2===g){var e,r,A,B,I,u,J;e={TAB:9,ENTER:13,ESC:27,SPACE:32,LEFT:37,UP:38,RIGHT:39,DOWN:40,SHIFT:16,CTRL:17,ALT:18,PAGE_UP:33,PAGE_DOWN:34,HOME:36,END:35,BACKSPACE:8,DELETE:46,isArrow:function(a){a=a.which?a.which:a;switch(a){case e.LEFT:case e.RIGHT:case e.UP:case e.DOWN:return!0}return!1},
+isControl:function(a){switch(a.which){case e.SHIFT:case e.CTRL:case e.ALT:return!0}return a.metaKey?!0:!1},isFunctionKey:function(a){a=a.which?a.which:a;return 112<=a&&123>=a}};r=f(document);var M=1;I=function(){return M++};r.bind("mousemove",function(a){J={x:a.pageX,y:a.pageY}});r=z(Object,{bind:function(a){var b=this;return function(){a.apply(b,arguments)}},init:function(a){var b,c,d;this.opts=a=this.prepareOpts(a);this.id=a.id;a.element.data("select2")!==g&&null!==a.element.data("select2")&&this.destroy();
+this.enabled=!0;this.container=this.createContainer();this.containerId="s2id_"+(a.element.attr("id")||"autogen"+I());this.containerSelector="#"+this.containerId.replace(/([;&,\.\+\*\~':"\!\^#$%@\[\]\(\)=>\|])/g,"\\$1");this.container.attr("id",this.containerId);var h=!1,q;this.body=function(){!1===h&&(q=a.element.closest("body"),h=!0);return q};d=f("#select2-drop-mask");0==d.length&&(d=f(document.createElement("div")),d.attr("id","select2-drop-mask").attr("class","select2-drop-mask"),d.hide(),d.appendTo(this.body()),
+d.bind("mousedown touchstart",function(){var a=f("#select2-drop");0<a.length&&(a=a.data("select2"),a.opts.selectOnBlur&&a.selectHighlighted({noFocus:!0}),a.close())}));a.element.attr("class")!==g&&this.container.addClass(a.element.attr("class").replace(/validate\[[\S ]+] ?/,""));this.container.css(y(a.containerCss));this.container.addClass(y(a.containerCssClass));this.elementTabIndex=this.opts.element.attr("tabIndex");this.opts.element.data("select2",this).addClass("select2-offscreen").bind("focus.select2",
+function(){f(this).select2("focus")}).attr("tabIndex","-1").before(this.container);this.container.data("select2",this);this.dropdown=this.container.find(".select2-drop");this.dropdown.addClass(y(a.dropdownCssClass));this.dropdown.data("select2",this);this.results=b=this.container.find(".select2-results");this.search=c=this.container.find("input.select2-input");c.attr("tabIndex",this.elementTabIndex);this.resultsPage=0;this.context=null;this.initContainer();this.initContainerWidth();this.results.bind("mousemove",
+function(a){var b=J;(b===g||b.x!==a.pageX||b.y!==a.pageY)&&f(a.target).trigger("mousemove-filtered",a)});this.dropdown.delegate(".select2-results","mousemove-filtered",this.bind(this.highlightUnderEvent));var e=this.results,K=C(80,function(a){e.trigger("scroll-debounced",a)});e.bind("scroll",function(a){0<=j(a.target,e.get())&&K(a)});this.dropdown.delegate(".select2-results","scroll-debounced",this.bind(this.loadMoreIfNeeded));f.fn.mousewheel&&b.mousewheel(function(a,c,d,h){c=b.scrollTop();0<h&&0>=
+c-h?(b.scrollTop(0),n(a)):0>h&&b.get(0).scrollHeight-b.scrollTop()+h<=b.height()&&(b.scrollTop(b.get(0).scrollHeight-b.height()),n(a))});c.bind("keydown",function(){f.data(c,"keyup-change-value")===g&&f.data(c,"keyup-change-value",c.val())});c.bind("keyup",function(){var a=f.data(c,"keyup-change-value");a!==g&&c.val()!==a&&(f.removeData(c,"keyup-change-value"),c.trigger("keyup-change"))});c.bind("keyup-change",this.bind(this.updateResults));c.bind("focus",function(){c.addClass("select2-focused");
+" "===c.val()&&c.val("")});c.bind("blur",function(){c.removeClass("select2-focused")});this.dropdown.delegate(".select2-results","mouseup",this.bind(function(a){0<f(a.target).closest(".select2-result-selectable").length?(this.highlightUnderEvent(a),this.selectHighlighted(a)):this.focusSearch();n(a)}));this.dropdown.bind("click mouseup mousedown",function(a){a.stopPropagation()});f.isFunction(this.opts.initSelection)&&(this.initSelection(),this.monitorSource());(a.element.is(":disabled")||a.element.is("[readonly='readonly']"))&&
+this.disable()},destroy:function(){var a=this.opts.element.data("select2");this.propertyObserver&&(delete this.propertyObserver,this.propertyObserver=null);a!==g&&(a.container.remove(),a.dropdown.remove(),a.opts.element.removeData("select2").unbind(".select2").attr("tabIndex",this.elementTabIndex).show())},prepareOpts:function(a){var b,c,d;b=a.element;"select"===b.get(0).tagName.toLowerCase()&&(this.select=c=a.element);c&&f.each("id multiple ajax query createSearchChoice initSelection data tags".split(" "),
+function(){if(this in a)throw Error("Option '"+this+"' is not allowed for Select2 when attached to a <select> element.");});a=f.extend({},{populateResults:function(b,c,d){var e,l=this.opts.id,p=this;e=function(b,c,h){var q,n,j,m,r,t,s;b=a.sortResults(b,c,d);q=0;for(n=b.length;q<n;q+=1)j=b[q],r=!0===j.disabled,m=!r&&l(j)!==g,t=j.children&&0<j.children.length,s=f("<li></li>"),s.addClass("select2-results-dept-"+h),s.addClass("select2-result"),s.addClass(m?"select2-result-selectable":"select2-result-unselectable"),
+r&&s.addClass("select2-disabled"),t&&s.addClass("select2-result-with-children"),s.addClass(p.opts.formatResultCssClass(j)),m=f(document.createElement("div")),m.addClass("select2-result-label"),r=a.formatResult(j,m,d,p.opts.escapeMarkup),r!==g&&m.html(r),s.append(m),t&&(t=f("<ul></ul>"),t.addClass("select2-result-sub"),e(j.children,t,h+1),s.append(t)),s.data("select2-data",j),c.append(s)};e(c,b,0)}},f.fn.select2.defaults,a);"function"!==typeof a.id&&(d=a.id,a.id=function(a){return a[d]});if(f.isArray(a.element.data("select2Tags"))){if("tags"in
+a)throw"tags specified as both an attribute 'data-select2-tags' and in options of Select2 "+a.element.attr("id");a.tags=a.element.attr("data-select2-tags")}if(c)a.query=this.bind(function(a){var c={results:[],more:!1},d=a.term,e,l,p;p=function(b,c){var f;b.is("option")?a.matcher(d,b.text(),b)&&c.push({id:b.attr("value"),text:b.text(),element:b.get(),css:b.attr("class"),disabled:m(b.attr("disabled"),"disabled")}):b.is("optgroup")&&(f={text:b.attr("label"),children:[],element:b.get(),css:b.attr("class")},
+b.children().each2(function(a,b){p(b,f.children)}),0<f.children.length&&c.push(f))};e=b.children();this.getPlaceholder()!==g&&0<e.length&&(l=e[0],""===f(l).text()&&(e=e.not(l)));e.each2(function(a,b){p(b,c.results)});a.callback(c)}),a.id=function(a){return a.id},a.formatResultCssClass=function(a){return a.css};else if(!("query"in a))if("ajax"in a){if((c=a.element.data("ajax-url"))&&0<c.length)a.ajax.url=c;a.query=E(a.ajax)}else"data"in a?a.query=F(a.data):"tags"in a&&(a.query=G(a.tags),a.createSearchChoice===
+g&&(a.createSearchChoice=function(a){return{id:a,text:a}}),a.initSelection=function(b,c){var d=[];f(v(b.val(),a.separator)).each(function(){var b=this,c=this,h=a.tags;f.isFunction(h)&&(h=h());f(h).each(function(){if(this.id===b)return c=this.text,!1});d.push({id:b,text:c})});c(d)});if("function"!==typeof a.query)throw"query function not defined for Select2 "+a.element.attr("id");return a},monitorSource:function(){var a=this.opts.element,b;a.bind("change.select2",this.bind(function(){!0!==this.opts.element.data("select2-change-triggered")&&
+this.initSelection()}));b=this.bind(function(){var a="disabled"!==this.opts.element.attr("disabled"),b="readonly"===this.opts.element.attr("readonly"),a=a&&!b;this.enabled!==a&&(a?this.enable():this.disable())});a.bind("propertychange.select2 DOMAttrModified.select2",b);"undefined"!==typeof WebKitMutationObserver&&(this.propertyObserver&&(delete this.propertyObserver,this.propertyObserver=null),this.propertyObserver=new WebKitMutationObserver(function(a){a.forEach(b)}),this.propertyObserver.observe(a.get(0),
+{attributes:!0,subtree:!1}))},triggerChange:function(a){a=a||{};a=f.extend({},a,{type:"change",val:this.val()});this.opts.element.data("select2-change-triggered",!0);this.opts.element.trigger(a);this.opts.element.data("select2-change-triggered",!1);this.opts.element.click();this.opts.blurOnChange&&this.opts.element.blur()},enable:function(){this.enabled||(this.enabled=!0,this.container.removeClass("select2-container-disabled"),this.opts.element.removeAttr("disabled"))},disable:function(){this.enabled&&
+(this.close(),this.enabled=!1,this.container.addClass("select2-container-disabled"),this.opts.element.attr("disabled","disabled"))},opened:function(){return this.container.hasClass("select2-dropdown-open")},positionDropdown:function(){var a=this.container.offset(),b=this.container.outerHeight(!1),c=this.container.outerWidth(!1),d=this.dropdown.outerHeight(!1),h=f(window).scrollLeft()+document.documentElement.clientWidth,e=f(window).scrollTop()+document.documentElement.clientHeight,b=a.top+b,g=a.left,
+e=b+d<=e,j=a.top-d>=this.body().scrollTop(),l=this.dropdown.outerWidth(!1),h=g+l<=h,p=this.dropdown.hasClass("select2-drop-above"),m;"static"!==this.body().css("position")&&(m=this.body().offset(),b-=m.top,g-=m.left);p?(p=!0,!j&&e&&(p=!1)):(p=!1,!e&&j&&(p=!0));h||(g=a.left+c-l);p?(b=a.top-d,this.container.addClass("select2-drop-above"),this.dropdown.addClass("select2-drop-above")):(this.container.removeClass("select2-drop-above"),this.dropdown.removeClass("select2-drop-above"));a=f.extend({top:b,
+left:g,width:c},y(this.opts.dropdownCss));this.dropdown.css(a)},shouldOpen:function(){var a;if(this.opened())return!1;a=f.Event("open");this.opts.element.trigger(a);return!a.isDefaultPrevented()},clearDropdownAlignmentPreference:function(){this.container.removeClass("select2-drop-above");this.dropdown.removeClass("select2-drop-above")},open:function(){if(!this.shouldOpen())return!1;window.setTimeout(this.bind(this.opening),1);return!0},opening:function(){var a=this.containerId,b="scroll."+a,c="resize."+
+a,d="orientationchange."+a;this.clearDropdownAlignmentPreference();" "===this.search.val()&&this.search.val("");this.container.addClass("select2-dropdown-open").addClass("select2-container-active");this.dropdown[0]!==this.body().children().last()[0]&&this.dropdown.detach().appendTo(this.body());this.updateResults(!0);a=f("#select2-drop-mask");this.dropdown.prev()[0]!==a[0]&&this.dropdown.before(a);f("#select2-drop").removeAttr("id");this.dropdown.attr("id","select2-drop");a.css({width:document.documentElement.scrollWidth,
+height:document.documentElement.scrollHeight});a.show();this.dropdown.show();this.positionDropdown();this.dropdown.addClass("select2-drop-active");this.ensureHighlightVisible();this.container.parents().add(window).each(function(){f(this).bind(c+" "+b+" "+d,function(){f("#select2-drop-mask").css({width:document.documentElement.scrollWidth,height:document.documentElement.scrollHeight});f("#select2-drop").data("select2").positionDropdown()})});this.focusSearch()},close:function(){if(this.opened()){var a=
+this.containerId,b="scroll."+a,c="resize."+a,d="orientationchange."+a;this.container.parents().add(window).each(function(){f(this).unbind(b).unbind(c).unbind(d)});this.clearDropdownAlignmentPreference();f("#select2-drop-mask").hide();this.dropdown.removeAttr("id");this.dropdown.hide();this.container.removeClass("select2-dropdown-open").removeClass("select2-container-active");this.results.empty();this.clearSearch();this.opts.element.trigger(f.Event("close"))}},clearSearch:function(){},ensureHighlightVisible:function(){var a=
+this.results,b,c,d,h;c=this.highlight();0>c||(0==c?a.scrollTop(0):(b=this.findHighlightableChoices(),d=f(b[c]),h=d.offset().top+d.outerHeight(!0),c===b.length-1&&(b=a.find("li.select2-more-results"),0<b.length&&(h=b.offset().top+b.outerHeight(!0))),b=a.offset().top+a.outerHeight(!0),h>b&&a.scrollTop(a.scrollTop()+(h-b)),h=d.offset().top-a.offset().top,0>h&&"none"!=d.css("display")&&a.scrollTop(a.scrollTop()+h)))},findHighlightableChoices:function(){this.results.find(".select2-result-selectable:not(.select2-selected):not(.select2-disabled)");
+return this.results.find(".select2-result-selectable:not(.select2-selected):not(.select2-disabled)")},moveHighlight:function(a){for(var b=this.findHighlightableChoices(),c=this.highlight();-1<c&&c<b.length;){var c=c+a,d=f(b[c]);if(d.hasClass("select2-result-selectable")&&!d.hasClass("select2-disabled")&&!d.hasClass("select2-selected")){this.highlight(c);break}}},highlight:function(a){var b=this.findHighlightableChoices();if(0===arguments.length)return j(b.filter(".select2-highlighted")[0],b.get());
+a>=b.length&&(a=b.length-1);0>a&&(a=0);this.results.find(".select2-highlighted").removeClass("select2-highlighted");f(b[a]).addClass("select2-highlighted");this.ensureHighlightVisible()},countSelectableResults:function(){return this.findHighlightableChoices().length},highlightUnderEvent:function(a){a=f(a.target).closest(".select2-result-selectable");if(0<a.length&&!a.is(".select2-highlighted")){var b=this.findHighlightableChoices();this.highlight(b.index(a))}else 0==a.length&&this.results.find(".select2-highlighted").removeClass("select2-highlighted")},
+loadMoreIfNeeded:function(){var a=this.results,b=a.find("li.select2-more-results"),c,d=this.resultsPage+1,f=this,e=this.search.val(),g=this.context;0!==b.length&&(c=b.offset().top-a.offset().top-a.height(),c<=this.opts.loadMorePadding&&(b.addClass("select2-active"),this.opts.query({term:e,page:d,context:g,matcher:this.opts.matcher,callback:this.bind(function(c){f.opened()&&(f.opts.populateResults.call(this,a,c.results,{term:e,page:d,context:g}),!0===c.more?(b.detach().appendTo(a).text(f.opts.formatLoadMore(d+
+1)),window.setTimeout(function(){f.loadMoreIfNeeded()},10)):b.remove(),f.positionDropdown(),f.resultsPage=d)})})))},tokenize:function(){},updateResults:function(a){function b(){h.scrollTop(0);d.removeClass("select2-active");j.positionDropdown()}function c(a){h.html(a);b()}var d=this.search,h=this.results,e=this.opts,k,j=this;if(!(!0!==a&&(!1===this.showSearchInput||!this.opened()))){d.addClass("select2-active");var l=f.isFunction(e.maximumSelectionSize)?e.maximumSelectionSize():e.maximumSelectionSize;
+if(1<=l&&(k=this.data(),f.isArray(k)&&k.length>=l&&w(e.formatSelectionTooBig,"formatSelectionTooBig"))){c("<li class='select2-selection-limit'>"+e.formatSelectionTooBig(l)+"</li>");return}d.val().length<e.minimumInputLength?w(e.formatInputTooShort,"formatInputTooShort")?c("<li class='select2-no-results'>"+e.formatInputTooShort(d.val(),e.minimumInputLength)+"</li>"):c(""):(e.formatSearching()&&!0===a&&c("<li class='select2-searching'>"+e.formatSearching()+"</li>"),e.maximumInputLength&&d.val().length>
+e.maximumInputLength?w(e.formatInputTooLong,"formatInputTooLong")?c("<li class='select2-no-results'>"+e.formatInputTooLong(d.val(),e.maximumInputLength)+"</li>"):c(""):(k=this.tokenize(),k!=g&&null!=k&&d.val(k),this.resultsPage=1,e.query({term:d.val(),page:this.resultsPage,context:null,matcher:e.matcher,callback:this.bind(function(k){var l;this.opened()&&(this.context=k.context===g?null:k.context,this.opts.createSearchChoice&&""!==d.val()&&(l=this.opts.createSearchChoice.call(null,d.val(),k.results),
+l!==g&&null!==l&&j.id(l)!==g&&null!==j.id(l)&&0===f(k.results).filter(function(){return m(j.id(this),j.id(l))}).length&&k.results.unshift(l)),0===k.results.length&&w(e.formatNoMatches,"formatNoMatches")?c("<li class='select2-no-results'>"+e.formatNoMatches(d.val())+"</li>"):(h.empty(),j.opts.populateResults.call(this,h,k.results,{term:d.val(),page:this.resultsPage,context:null}),!0===k.more&&w(e.formatLoadMore,"formatLoadMore")&&(h.append("<li class='select2-more-results'>"+j.opts.escapeMarkup(e.formatLoadMore(this.resultsPage))+
+"</li>"),window.setTimeout(function(){j.loadMoreIfNeeded()},10)),this.postprocessResults(k,a),b()))})})))}},cancel:function(){this.close()},blur:function(){this.opts.selectOnBlur&&this.selectHighlighted({noFocus:!0});this.close();this.container.removeClass("select2-container-active");this.dropdown.removeClass("select2-drop-active");this.search[0]===document.activeElement&&this.search.blur();this.clearSearch();this.selection.find(".select2-search-choice-focus").removeClass("select2-search-choice-focus");
+this.opts.element.triggerHandler("blur")},focusSearch:function(){this.search.show();this.search.focus();window.setTimeout(this.bind(function(){this.search.show();this.search.focus();this.search.val(this.search.val())}),10)},selectHighlighted:function(a){var b=this.highlight(),c=this.results.find(".select2-highlighted").closest(".select2-result").data("select2-data");c&&(this.highlight(b),this.onSelect(c,a))},getPlaceholder:function(){return this.select&&""!==this.select.find("option").first().text()?
+g:this.opts.element.attr("placeholder")||this.opts.element.attr("data-placeholder")||this.opts.element.data("placeholder")||this.opts.placeholder},initContainerWidth:function(){var a=function(){var a,c,d,e;if("off"===this.opts.width)return null;if("element"===this.opts.width)return 0===this.opts.element.outerWidth(!1)?"auto":this.opts.element.outerWidth(!1)+"px";if("copy"===this.opts.width||"resolve"===this.opts.width){a=this.opts.element.attr("style");if(a!==g){a=a.split(";");d=0;for(e=a.length;d<
+e;d+=1)if(c=a[d].replace(/\s/g,"").match(/width:(([-+]?([0-9]*\.)?[0-9]+)(px|em|ex|%|in|cm|mm|pt|pc))/),null!==c&&1<=c.length)return c[1]}return"resolve"===this.opts.width?(a=this.opts.element.css("width"),0<a.indexOf("%")?a:0===this.opts.element.outerWidth(!1)?"auto":this.opts.element.outerWidth(!1)+"px"):null}return f.isFunction(this.opts.width)?this.opts.width():this.opts.width}.call(this);null!==a&&this.container.attr("style","width: "+a)}});A=z(r,{createContainer:function(){return f(document.createElement("div")).attr({"class":"select2-container"}).html("    <a href='javascript:void(0)' onclick='return false;' class='select2-choice'>   <span></span><abbr class='select2-search-choice-close' style='display:none;'></abbr>   <div><b></b></div></a>    <div class='select2-drop select2-offscreen'>   <div class='select2-search'>       <input type='text' autocomplete='off' class='select2-input'/>   </div>   <ul class='select2-results'>   </ul></div>")},
+disable:function(){this.enabled&&(this.parent.disable.apply(this,arguments),this.selection.attr("tabIndex","-1"),this.search.attr("tabIndex","-1"))},enable:function(){this.enabled||(this.parent.enable.apply(this,arguments),this.elementTabIndex?this.selection.attr("tabIndex",this.elementTabIndex):this.selection.removeAttr("tabIndex"),this.search.removeAttr("tabIndex"))},opening:function(){this.search.show();this.parent.opening.apply(this,arguments);this.dropdown.removeClass("select2-offscreen")},close:function(){this.opened()&&
+(this.parent.close.apply(this,arguments),this.dropdown.removeAttr("style").addClass("select2-offscreen").insertAfter(this.selection).show())},focus:function(){this.close();this.selection.focus();this.opts.element.triggerHandler("focus")},isFocused:function(){return this.selection[0]===document.activeElement},cancel:function(){this.parent.cancel.apply(this,arguments);this.selection.focus()},initContainer:function(){var a,b=this.dropdown;this.selection=a=this.container.find(".select2-choice");this.search.bind("keydown",
+this.bind(function(a){if(this.enabled)if(a.which===e.PAGE_UP||a.which===e.PAGE_DOWN)n(a);else if(this.opened())switch(a.which){case e.UP:case e.DOWN:this.moveHighlight(a.which===e.UP?-1:1);n(a);break;case e.TAB:case e.ENTER:this.selectHighlighted();n(a);break;case e.ESC:this.cancel(a),n(a)}else a.which===e.TAB||e.isControl(a)||e.isFunctionKey(a)||a.which===e.ESC||!1===this.opts.openOnEnter&&a.which===e.ENTER||this.open()}));this.search.bind("focus",this.bind(function(){this.selection.attr("tabIndex",
+"-1")}));this.search.bind("blur",this.bind(function(){this.opened()||this.container.removeClass("select2-container-active");window.setTimeout(this.bind(function(){var a=this.elementTabIndex||0;a?this.selection.attr("tabIndex",a):this.selection.removeAttr("tabIndex")}),10)}));a.delegate("abbr","mousedown",this.bind(function(a){this.enabled&&(this.clear(),a.preventDefault(),a.stopImmediatePropagation(),this.close(),this.triggerChange(),this.selection.focus())}));a.bind("mousedown",this.bind(function(){this.opened()?
+(this.close(),this.selection.focus()):this.enabled&&this.open()}));b.bind("mousedown",this.bind(function(){this.search.focus()}));a.bind("focus",this.bind(function(){this.enabled&&(this.container.addClass("select2-container-active"),this.search.attr("tabIndex","-1"))}));a.bind("blur",this.bind(function(){this.opened()||this.container.removeClass("select2-container-active");window.setTimeout(this.bind(function(){this.search.attr("tabIndex",this.elementTabIndex||0)}),10)}));a.bind("keydown",this.bind(function(a){if(this.enabled)if(a.which==
+e.DOWN||a.which==e.UP||a.which==e.ENTER&&this.opts.openOnEnter)this.open(),n(a);else if(a.which==e.DELETE||a.which==e.BACKSPACE)this.opts.allowClear&&this.clear(),n(a)}));a.bind("keypress",this.bind(function(a){a.which==e.DELETE||(a.which==e.BACKSPACE||a.which==e.TAB||a.which==e.ENTER||0==a.which)||(a=String.fromCharCode(a.which),this.search.val(a),this.open())}));this.setPlaceholder();this.search.bind("focus",this.bind(function(){this.container.addClass("select2-container-active")}))},clear:function(){this.opts.element.val("");
+this.selection.find("span").empty();this.selection.removeData("select2-data");this.setPlaceholder()},initSelection:function(){if(""===this.opts.element.val()&&""===this.opts.element.text())this.close(),this.setPlaceholder();else{var a=this;this.opts.initSelection.call(null,this.opts.element,function(b){b!==g&&null!==b&&(a.updateSelection(b),a.close(),a.setPlaceholder())})}},prepareOpts:function(){var a=this.parent.prepareOpts.apply(this,arguments);"select"===a.element.get(0).tagName.toLowerCase()?
+a.initSelection=function(a,c){var d=a.find(":selected");f.isFunction(c)&&c({id:d.attr("value"),text:d.text(),element:d})}:"data"in a&&(a.initSelection=a.initSelection||function(b,c){var d=b.val();a.query({matcher:function(b,c,f){return m(d,a.id(f))},callback:!f.isFunction(c)?f.noop:function(a){c(a.results.length?a.results[0]:null)}})});return a},setPlaceholder:function(){var a=this.getPlaceholder();""===this.opts.element.val()&&a!==g&&!(this.select&&""!==this.select.find("option:first").text())&&
+(this.selection.find("span").html(this.opts.escapeMarkup(a)),this.selection.addClass("select2-default"),this.selection.find("abbr").hide())},postprocessResults:function(a,b){var c=0,d=this,e=!0;this.findHighlightableChoices().each2(function(a,b){if(m(d.id(b.data("select2-data")),d.opts.element.val()))return c=a,!1});this.highlight(c);!0===b&&(e=this.showSearchInput=H(a.results)>=this.opts.minimumResultsForSearch,this.dropdown.find(".select2-search")[e?"removeClass":"addClass"]("select2-search-hidden"),
+f(this.dropdown,this.container)[e?"addClass":"removeClass"]("select2-with-searchbox"))},onSelect:function(a,b){var c=this.opts.element.val();this.opts.element.val(this.id(a));this.updateSelection(a);this.close();(!b||!b.noFocus)&&this.selection.focus();m(c,this.id(a))||this.triggerChange()},updateSelection:function(a){var b=this.selection.find("span");this.selection.data("select2-data",a);b.empty();a=this.opts.formatSelection(a,b);a!==g&&b.append(this.opts.escapeMarkup(a));this.selection.removeClass("select2-default");
+this.opts.allowClear&&this.getPlaceholder()!==g&&this.selection.find("abbr").show()},val:function(){var a,b=!1,c=null,d=this;if(0===arguments.length)return this.opts.element.val();a=arguments[0];1<arguments.length&&(b=arguments[1]);if(this.select)this.select.val(a).find(":selected").each2(function(a,b){c={id:b.attr("value"),text:b.text()};return!1}),this.updateSelection(c),this.setPlaceholder(),b&&this.triggerChange();else{if(this.opts.initSelection===g)throw Error("cannot call val() if initSelection() is not defined");
+!a&&0!==a?(this.clear(),b&&this.triggerChange()):(this.opts.element.val(a),this.opts.initSelection(this.opts.element,function(a){d.opts.element.val(!a?"":d.id(a));d.updateSelection(a);d.setPlaceholder();d.triggerChange()}))}},clearSearch:function(){this.search.val("")},data:function(a){var b;if(0===arguments.length)return b=this.selection.data("select2-data"),b==g&&(b=null),b;!a||""===a?this.clear():(this.opts.element.val(!a?"":this.id(a)),this.updateSelection(a))}});B=z(r,{createContainer:function(){return f(document.createElement("div")).attr({"class":"select2-container select2-container-multi"}).html("    <ul class='select2-choices'>  <li class='select2-search-field'>    <input type='text' autocomplete='off' class='select2-input'>  </li></ul><div class='select2-drop select2-drop-multi' style='display:none;'>   <ul class='select2-results'>   </ul></div>")},
+prepareOpts:function(){var a=this.parent.prepareOpts.apply(this,arguments);"select"===a.element.get(0).tagName.toLowerCase()?a.initSelection=function(a,c){var d=[];a.find(":selected").each2(function(a,b){d.push({id:b.attr("value"),text:b.text(),element:b})});f.isFunction(c)&&c(d)}:"data"in a&&(a.initSelection=a.initSelection||function(b,c){var d=v(b.val(),a.separator);a.query({matcher:function(b,c,e){return f.grep(d,function(b){return m(b,a.id(e))}).length},callback:!f.isFunction(c)?f.noop:function(a){c(a.results)}})});
+return a},initContainer:function(){var a;this.searchContainer=this.container.find(".select2-search-field");this.selection=a=this.container.find(".select2-choices");this.search.bind("keydown",this.bind(function(b){if(this.enabled){if(b.which===e.BACKSPACE&&""===this.search.val()){this.close();var c;c=a.find(".select2-search-choice-focus");if(0<c.length){this.unselect(c.first());this.search.width(10);n(b);return}c=a.find(".select2-search-choice:not(.select2-locked)");0<c.length&&c.last().addClass("select2-search-choice-focus")}else a.find(".select2-search-choice-focus").removeClass("select2-search-choice-focus");
+if(this.opened())switch(b.which){case e.UP:case e.DOWN:this.moveHighlight(b.which===e.UP?-1:1);n(b);return;case e.ENTER:case e.TAB:this.selectHighlighted();n(b);return;case e.ESC:this.cancel(b);n(b);return}if(!(b.which===e.TAB||e.isControl(b)||e.isFunctionKey(b)||b.which===e.BACKSPACE||b.which===e.ESC)&&!(!1===this.opts.openOnEnter&&b.which===e.ENTER))this.open(),(b.which===e.PAGE_UP||b.which===e.PAGE_DOWN)&&n(b)}}));this.search.bind("keyup",this.bind(this.resizeSearch));this.search.bind("blur",this.bind(function(a){this.container.removeClass("select2-container-active");
+this.search.removeClass("select2-focused");this.opened()||this.clearSearch();a.stopImmediatePropagation()}));this.container.delegate(".select2-choices","mousedown",this.bind(function(a){this.enabled&&!(0<f(a.target).closest(".select2-search-choice").length)&&(this.clearPlaceholder(),this.open(),this.focusSearch(),a.preventDefault())}));this.container.delegate(".select2-choices","focus",this.bind(function(){this.enabled&&(this.container.addClass("select2-container-active"),this.dropdown.addClass("select2-drop-active"),
+this.clearPlaceholder())}));this.clearSearch()},enable:function(){this.enabled||(this.parent.enable.apply(this,arguments),this.search.removeAttr("disabled"))},disable:function(){this.enabled&&(this.parent.disable.apply(this,arguments),this.search.attr("disabled",!0))},initSelection:function(){""===this.opts.element.val()&&""===this.opts.element.text()&&(this.updateSelection([]),this.close(),this.clearSearch());if(this.select||""!==this.opts.element.val()){var a=this;this.opts.initSelection.call(null,
+this.opts.element,function(b){b!==g&&null!==b&&(a.updateSelection(b),a.close(),a.clearSearch())})}},clearSearch:function(){var a=this.getPlaceholder();a!==g&&0===this.getVal().length&&!1===this.search.hasClass("select2-focused")?(this.search.val(a).addClass("select2-default"),this.resizeSearch()):this.search.val(" ").width(10)},clearPlaceholder:function(){this.search.hasClass("select2-default")?this.search.val("").removeClass("select2-default"):" "===this.search.val()&&this.search.val("")},opening:function(){this.parent.opening.apply(this,
+arguments);this.clearPlaceholder();this.resizeSearch();this.focusSearch()},close:function(){this.opened()&&this.parent.close.apply(this,arguments)},focus:function(){this.close();this.search.focus();this.opts.element.triggerHandler("focus")},isFocused:function(){return this.search.hasClass("select2-focused")},updateSelection:function(a){var b=[],c=[],d=this;f(a).each(function(){0>j(d.id(this),b)&&(b.push(d.id(this)),c.push(this))});a=c;this.selection.find(".select2-search-choice").remove();f(a).each(function(){d.addSelectedChoice(this)});
+d.postprocessResults()},tokenize:function(){var a=this.search.val(),a=this.opts.tokenizer(a,this.data(),this.bind(this.onSelect),this.opts);null!=a&&a!=g&&(this.search.val(a),0<a.length&&this.open())},onSelect:function(a,b){this.addSelectedChoice(a);(this.select||!this.opts.closeOnSelect)&&this.postprocessResults();this.opts.closeOnSelect?(this.close(),this.search.width(10)):0<this.countSelectableResults()?(this.search.width(10),this.resizeSearch(),this.positionDropdown()):this.close();this.triggerChange({added:a});
+(!b||!b.noFocus)&&this.focusSearch()},cancel:function(){this.close();this.focusSearch()},addSelectedChoice:function(a){var b=!a.locked,c=f("<li class='select2-search-choice'>    <div></div>    <a href='#' onclick='return false;' class='select2-search-choice-close' tabindex='-1'></a></li>"),d=f("<li class='select2-search-choice select2-locked'><div></div></li>"),c=b?c:d,d=this.id(a),e=this.getVal(),j;j=this.opts.formatSelection(a,c.find("div"));j!=g&&c.find("div").replaceWith("<div>"+this.opts.escapeMarkup(j)+
+"</div>");b&&c.find(".select2-search-choice-close").bind("mousedown",n).bind("click dblclick",this.bind(function(a){this.enabled&&(f(a.target).closest(".select2-search-choice").fadeOut("fast",this.bind(function(){this.unselect(f(a.target));this.selection.find(".select2-search-choice-focus").removeClass("select2-search-choice-focus");this.close();this.focusSearch()})).dequeue(),n(a))})).bind("focus",this.bind(function(){this.enabled&&(this.container.addClass("select2-container-active"),this.dropdown.addClass("select2-drop-active"))}));
+c.data("select2-data",a);c.insertBefore(this.searchContainer);e.push(d);this.setVal(e)},unselect:function(a){var b=this.getVal(),c,d;a=a.closest(".select2-search-choice");if(0===a.length)throw"Invalid argument: "+a+". Must be .select2-search-choice";if(c=a.data("select2-data"))d=j(this.id(c),b),0<=d&&(b.splice(d,1),this.setVal(b),this.select&&this.postprocessResults()),a.remove(),this.triggerChange({removed:c})},postprocessResults:function(){var a=this.getVal(),b=this.results.find(".select2-result"),
+c=this.results.find(".select2-result-with-children"),d=this;b.each2(function(b,c){var e=d.id(c.data("select2-data"));0<=j(e,a)&&(c.addClass("select2-selected"),c.find(".select2-result-selectable").addClass("select2-selected"))});c.each2(function(a,b){!b.is(".select2-result-selectable")&&0===b.find(".select2-result-selectable:not(.select2-selected)").length&&b.addClass("select2-selected")});-1==this.highlight()&&d.highlight(0)},resizeSearch:function(){var a,b,c,d,e=this.search.outerWidth(!1)-this.search.width();
+a=this.search;u||(c=a[0].currentStyle||window.getComputedStyle(a[0],null),u=f(document.createElement("div")).css({position:"absolute",left:"-10000px",top:"-10000px",display:"none",fontSize:c.fontSize,fontFamily:c.fontFamily,fontStyle:c.fontStyle,fontWeight:c.fontWeight,letterSpacing:c.letterSpacing,textTransform:c.textTransform,whiteSpace:"nowrap"}),u.attr("class","select2-sizer"),f("body").append(u));u.text(a.val());a=u.width()+10;b=this.search.offset().left;c=this.selection.width();d=this.selection.offset().left;
+b=c-(b-d)-e;b<a&&(b=c-e);40>b&&(b=c-e);0>=b&&(b=a);this.search.width(b)},getVal:function(){var a;if(this.select)return a=this.select.val(),null===a?[]:a;a=this.opts.element.val();return v(a,this.opts.separator)},setVal:function(a){var b;this.select?this.select.val(a):(b=[],f(a).each(function(){0>j(this,b)&&b.push(this)}),this.opts.element.val(0===b.length?"":b.join(this.opts.separator)))},val:function(){var a,b=!1,c=[],d=this;if(0===arguments.length)return this.getVal();a=arguments[0];1<arguments.length&&
+(b=arguments[1]);if(!a&&0!==a)this.opts.element.val(""),this.updateSelection([]),this.clearSearch(),b&&this.triggerChange();else{this.setVal(a);if(this.select)this.select.find(":selected").each(function(){c.push({id:f(this).attr("value"),text:f(this).text()})}),this.updateSelection(c),b&&this.triggerChange();else{if(this.opts.initSelection===g)throw Error("val() cannot be called if initSelection() is not defined");this.opts.initSelection(this.opts.element,function(a){var c=f(a).map(d.id);d.setVal(c);
+d.updateSelection(a);d.clearSearch();b&&d.triggerChange()})}this.clearSearch()}},onSortStart:function(){if(this.select)throw Error("Sorting of elements is not supported when attached to <select>. Attach to <input type='hidden'/> instead.");this.search.width(0);this.searchContainer.hide()},onSortEnd:function(){var a=[],b=this;this.searchContainer.show();this.searchContainer.appendTo(this.searchContainer.parent());this.resizeSearch();this.selection.find(".select2-search-choice").each(function(){a.push(b.opts.id(f(this).data("select2-data")))});
+this.setVal(a);this.triggerChange()},data:function(a){var b=this,c;if(0===arguments.length)return this.selection.find(".select2-search-choice").map(function(){return f(this).data("select2-data")}).get();a||(a=[]);c=f.map(a,function(a){return b.opts.id(a)});this.setVal(c);this.updateSelection(a);this.clearSearch()}});f.fn.select2=function(){var a=Array.prototype.slice.call(arguments,0),b,c,d,e,m="val destroy opened open close focus isFocused container onSortStart onSortEnd enable disable positionDropdown data".split(" ");
+this.each(function(){if(0===a.length||"object"===typeof a[0])b=0===a.length?{}:f.extend({},a[0]),b.element=f(this),"select"===b.element.get(0).tagName.toLowerCase()?e=b.element.attr("multiple"):(e=b.multiple||!1,"tags"in b&&(b.multiple=e=!0)),c=e?new B:new A,c.init(b);else if("string"===typeof a[0]){if(0>j(a[0],m))throw"Unknown method: "+a[0];d=g;c=f(this).data("select2");if(c!==g&&(d="container"===a[0]?c.container:c[a[0]].apply(c,a.slice(1)),d!==g))return!1}else throw"Invalid arguments to select2 plugin: "+
+a;});return d===g?this:d};f.fn.select2.defaults={width:"copy",loadMorePadding:0,closeOnSelect:!0,openOnEnter:!0,containerCss:{},dropdownCss:{},containerCssClass:"",dropdownCssClass:"",formatResult:function(a,b,c,d){b=[];D(a.text,c.term,b,d);return b.join("")},formatSelection:function(a){return a?a.text:g},sortResults:function(a){return a},formatResultCssClass:function(){return g},formatNoMatches:function(){return"No matches found"},formatInputTooShort:function(a,b){var c=b-a.length;return"Please enter "+
+c+" more character"+(1==c?"":"s")},formatInputTooLong:function(a,b){var c=a.length-b;return"Please enter "+c+" less character"+(1==c?"":"s")},formatSelectionTooBig:function(a){return"You can only select "+a+" item"+(1==a?"":"s")},formatLoadMore:function(){return"Loading more results..."},formatSearching:function(){return"Searching..."},minimumResultsForSearch:0,minimumInputLength:0,maximumInputLength:null,maximumSelectionSize:0,id:function(a){return a.id},matcher:function(a,b){return 0<=b.toUpperCase().indexOf(a.toUpperCase())},
+separator:",",tokenSeparators:[],tokenizer:L,escapeMarkup:function(a){var b={"\\":"&#92;","&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&apos;","/":"&#47;"};return String(a).replace(/[&<>"'/\\]/g,function(a){return b[a[0]]})},blurOnChange:!1,selectOnBlur:!1};window.Select2={query:{ajax:E,local:F,tags:G},util:{debounce:C,markMatch:D},"class":{"abstract":r,single:A,multi:B}}}})(jQuery);
diff --git a/select2-3.3.0/select2.png b/select2-3.3.0/select2.png
new file mode 100755
index 00000000..1d804ffb
Binary files /dev/null and b/select2-3.3.0/select2.png differ
diff --git a/select2-3.3.0/select2x2.png b/select2-3.3.0/select2x2.png
new file mode 100755
index 00000000..4bdd5c96
Binary files /dev/null and b/select2-3.3.0/select2x2.png differ
diff --git a/select2-3.3.0/test-619.html b/select2-3.3.0/test-619.html
new file mode 100755
index 00000000..613af682
--- /dev/null
+++ b/select2-3.3.0/test-619.html
@@ -0,0 +1,28 @@
+<html>
+  <head>
+    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
+    <link href="select2.css" rel="stylesheet"/>
+    <script type="text/javascript" src="select2.js"></script>
+ </head>
+ <body>
+   <select id="s1">
+     <option value="A"></option>
+     <option value="B"></option>
+   </select>
+
+    <script type="text/javascript">
+      $(document).ready(function () {
+      $("#s1").select2({}).on("change", function () {
+         alert("Changed caused by val()");
+      }).select2("val", "A");
+
+      // This should not trigger a change
+      $("#s1").select2("val", "B", false);
+      });
+
+    </script>
+
+
+ </body>
+
+</html>
diff --git a/select2-latest.html b/select2-latest.html
index e001fc55..58411caa 100644
--- a/select2-latest.html
+++ b/select2-latest.html
@@ -2,7 +2,7 @@
 layout: main
 title: Select2 Latest
 group: navigation
-version: 3.3
+version: 3.4
 ---
 
 <link href="select2-master/select2.css" rel="stylesheet"/>
@@ -228,7 +228,7 @@ $("#e10_3").select2({
                     <li>Loading...</li>
                     <script>
                         $(function() {
-                            var url="https://api.github.com/repos/ivaynberg/select2/issues?state=closed&milestone=7";
+                            var url="https://api.github.com/repos/ivaynberg/select2/issues?state=closed&milestone=8";
                             $.ajax({
                                 url: url,
                                 dataType: "jsonp"
diff --git a/select2-master b/select2-master
index b55efddf..76b503e3 160000
--- a/select2-master
+++ b/select2-master
@@ -1 +1 @@
-Subproject commit b55efddf07952dc934c4230d69610023d6e191f3
+Subproject commit 76b503e3e51eed8e1dbb3a773e92b860c921c116