I am trying to create a simple donut chart using Kendo UI data wiz widgets. How can I use an angular scope variable within such a widget ?

 <div kendo-chart
                     k-legend="{ position: 'top' }"
                     k-series-defaults="{ type: 'donut', startAngle: 270, holeSize: 80 }"
                     k-chart-area="{ background: '', height:220 }"
                     k-series="[{
                            field: 'share',
                            categoryField: 'resolution',
                            visibleInLegendField: 'visibleInLegend',
                            padding: 10
                          }]"
                     k-data-source="[
                        {
                            share: {{myMetadata.runningPercentage}},
                            visibleInLegend: false,
                            color: '#65c178'
                        },
                        {
                            share: 100 - {{myMetadata.runningPercentage}},
                            visibleInLegend: false,
                            color: '#e2e2e2'
                        }
                     ]"
                     k-series-hover="onSeriesHover"
              >

Hi

I was wondering if there was a way to enable some sort of horizontal scrolling for DataVis charts. I have a column chart with a number of coumns, but occasionally there are too many columns to fit adequately (at a reasonable size) on a screen. Furthermore, our software will be used on some screens where screen space is limited, so a scrolling mechanism of some sort would be necessary.

I wasn't able to find anything in the documentation, but thought perhaps I could set a minimum width of sorts for the columns and put the graph in an "overflow: scroll" style div. Is this possible?

Regards, Andrew

Hello,

I'm using the kendo less files in my web application (MVC5 web-api SPA) and i would like to use the variables
from a Theme file (for example kendo.bootstrap.less), but i run into a problem with my own less files.

When i use an import directive @import "kendo.bootstrap.less" in my own Site.less file, Visual Studio 2013 Web Essentials
parses the entire kendo.bootstrap.less and adds everything to the resulting Site.css file.

Because it is impossible to only import variables from another less file, wouldn't it be an idea to keep those variables in a separate less file like kendo.bootstrap.vars.less ?

Thanks in advance.

I have a Kendo grid on a MVC .cshtml view page:   

@model IEnumerable<Models.GetItems>
    <script>
        $(document).ready(function () {
           $("#grid").kendoGrid({
                sortable: true
            });
        });
    </script>    <table class="table" id="grid">
        <thead>
            <tr>
                <th data-field="Quantity">
                    Qty
                </th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model)
            {
                <tr>
                    <td>
                        @Html.ActionLink(item.Quantity.ToString(), "kendo", "Groups", new { ID = item.ID }, null)
                    </td>
                </tr>
            }
        </tbody>
    </table>

It displays the way I want; as a number with a link to a drill down page, but the sorting doesn't work at all.

How can I tell the grid I want the data type to be a number so it can sort it like a number?

(item.Quantity is Int16 from the model, but had to make it a string for the ActionLink to work)

(I'm open to binding the grid differently if I have to (bind to json output from controller and/or use rowTemplate and/or bind to empty div and define columns in JS possibly with template), but not sure at this point if that will matter, seems like a data type issue regardless of binding method???)

I'm trying to use a custom transport. Using a grid, the transport methods are getting called. However, when I use DataSource.add(), the transport create method is not getting called. Is this a limitation? JSBin here: http://jsbin.com/xixamugasunu. Thanks.

Hello guys,

I have made only 2 changes to selection.html from listView demos.

1. Changed the theme to kendo.metro.min.css
2. Added background-color property to product class.

Now when I select an item it does not get highlighted. This problem does not occur for default theme. Am i doing  something wrong here or is this a known issue? Either way I'm looking for a solution or workaround. Any help will be really appreciated. 

Thanks in advance.

I have a menu question:

(1) Can the kendo-menu support the use of a combobox for a menu item? 
(2) If the answer is yes to (1), then I have a question as to how to do it.

I've created a jsfiddle here: http://jsfiddle.net/pjtallman/rg501upb/7/

If I define my kendo menu as follows:

HTML

<ul id="menu"></ul>

JS

$(document).ready(function() {
    var menuItems = [{text: "Apple", url: "http://www.google.com"},
                     {text: "Banana", url: "http:\/www.google.com"},
                     {text: "Orange", url: "http://www.google.com"}];
    
    var menuData = [{text: "Fruits", items: menuItems},
                    {text: "Site", url: "http://www.google.com"},
                    {text: "Location", url: "http://www.google.com"}];
    
    
    var menu = $("#menu").kendoMenu({ dataSource: menuData });
});

This would display a menu such as:

Fruits v | Site | Location

Users would expand the 'Fruits' menu to see a list of sub-menu items (e.g. Apple, Banana, and Orange).

Our requirements are to have the first item, 'Fruits', which will be rendered as a standard menu item drop down in the above code, to be rendered as a combobox (restricted to its list of data items) and to display the text from whatever list item is selected by the user. So, there would be no 'Fruits' text displayed, the menu item would display whatever item's text was selected from the combobox. 

The menu datasource is dynamic so I don't think I can specify this in the html. But I have searched the kendo forums and demos and stackoverflow and can't find any relevant examples. The requirement is for the menu to function as follows. If 'Apple' is selected, the menu would appear as:

Apple v | Site | Location

If the user clicks the dropdown icon and selects 'Banana', the menu would appear as:

Banana v | Items | Inventory  

Thanks,
Chad

Is it possible to style the badge?

Looking to make it larger and possibly move it down and in a bit.

thanks for any help.

v.

I'm trying Bootstrap, Jquery Mobile and Kendo UI for choose best framework for develop e-commerce web site. 

Which kendo UI web widget (not mobile widget set) is designed to obtain collapsible left panel like menu of our website (http://www.telerik.com/support). 

Hi,

I want to develop a web based application which runs in a browser of a tablet.
I read about Kendo UI SPA (Single Page Applications) and also kenod.mobile.application.

Which one I should take?
What is the difference between kenod.mobile.application and SPA?

Thanks for any information!