JSFiddle - React, Tailwind, and code Playground

by Miguel Roman

HTML

<script src="http://cdn.kendostatic.com/2013.2.918/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.default.min.css">
<div class="row-fluid">
    <div class="span3" >
        <label class="control-label">Institucion</label>
    </div>
    <div class="span9"  >
        <input id="Donante" style="width: 550px;" class="span12"/>
    </div>
</div>

JavaScript

var dataInstituciones = [{"Ejercicio":2013,"Entidad":3,"UnidadEjecutora":1,"Nombre":"MINISTERIO DE AMBIENTE"},{"Ejercicio":2013,"Entidad":1,"UnidadEjecutora":1,"Nombre":"MINISTERIO DE FINANZAS PUBLICAS"},{"Ejercicio":2013,"Entidad":2,"UnidadEjecutora":1,"Nombre":"MUNICIPALIDAD DE GUATEMALA"}];       

$("#Donante").kendoAutoComplete({
    dataSource: dataInstituciones,
    filter: "contains",
    placeholder: "Seleccione Institucion...",            
    dataTextField: "Nombre",
    //template: '${ data.Nombre }',
    width: 300,
    
        change: function (e){
            alert(JSON.stringify(e));
        }
    
});