select2 v4.0.0

by pricejt

HTML

<link rel="stylesheet" href="https://select2.github.io/dist/css/select2.min.css">
<script src="https://select2.github.io/dist/js/select2.full.js"></script>
<select>

CSS

/* select2 version 4.0.0 Beta 2 */

JavaScript

$(function () {
        var origData = '{0:{ Value:"0413-0415" }, 1:{ Value:"1-7800 LBO" }, 2:{ Value:"1-7804" }, 3:{ Value:"1-7805" }}';
        var data = parseData(origData);
        console.log(data);
    $('select')
        .select2({
            //multiple: true,
            data: data
            //tokenSeparators: ['|']
        })
        .on('change', function(){
            console.log( $(this).val() );
        });
});

function parseData(data)
{
	var correctedData = [];
	data = data.replace('{','[');
	data = data.replace(/,$/,"") + "]";
	var re = /\{.*?\}/g;
	var index, len;
	var m = data.match(re);

	for (var el in m) {
		
		m[el] = m[el].replace('Value','"id"');
		m[el] = m[el].replace('Description','"text"');
		if(!m[el].includes("text:"))
		{
		var n = m[el].lastIndexOf('}') -1;
		m[el] = m[el].substring(0,n) + ', ' + m[el].replace('{','').replace('id','text'); 
		}
		correctedData.push($.parseJSON(m[el]));
		
	}
	//correctedData = correctedData.trim().replace(/,$/, "");
	//correctedData = correctedData.replace(/"/g, "'");
	//correctedData = correctedData + ']';
	
	return correctedData;
}