mobile dropdownlist tester

by bundyo

HTML

<link rel="stylesheet" href="http://babackofficedev.radolo.com/kendo/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://babackofficedev.radolo.com/Kendo/Styles/kendo.flat.min.css">
<script src="http://babackofficedev.radolo.com/Kendo/js/jquery.min.js"></script>
<script src="http://babackofficedev.radolo.com/Kendo/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://asaedev.radolo.com/kendo/styles/kendo.mobile.all.min.css">
<div id='container'>
    <span data-bind='text:ddl'></span>
    <input data-role='dropdownlist' data-value-primitive="true" data-bind='source:ds,value:ddl' data-option-label='select...' data-value-field="ID" data-text-field="Name" data-animation="{ open: { effects: 'slideIn:up' }}"/>
</div>

CSS

.km-flat .k-dropdown, 
.km-flat .k-dropdown * 
{
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    -moz-background-clip: padding-box;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
}

JavaScript

var $container = $('#container');

            var vm = new kendo.observable({
                ds: new kendo.data.DataSource({
                    data:[{ID:1,Name:"First"},{ID:2,Name:"Second"}]
                })
            });


            kendo.bind($container, vm);