Hello,
I'm part of a team rewriting the UI of a heavy desktop ASP.Net application using kendo components.
One of the objectives is to have a multibrowser and multiplatform (desktop + mobile) application.
Currently I'm using kendo 2013.2.716 version.
I tried the application on Ipad with Safari as browser. 
I included as scripts kendo.all.min.js and as stylesheet kendo.mobile.all.min.css.

I got stuck on the first page as the original application uses menus that I converted to kendo menus. This worked satisfactorily on desktop but failed miserably on Ipad since the menu was rendered as pure
html.The menu has the familiar shape with a couple of levels.
See enclose image below.

How can I convert menus in the mobile environment ? 
I saw the list of mobile widgets and no menu exists.
What could be a workaround to reproduce the menu functionality without writing a new
application from scratch ?

I'll be grateful for any hint,
Thanks for your attention

 best regards

 Marco Furlan

I am pulling data from SharePoint List Data service which has over 3000 records. Kendo Grid however is displaying only a 1000.

Hello,

When I tried to access the Kendo UI Dojo website (try.kendoui.com), I was not able to  see the navigation bar.

Afterwards, I checked the browser console and I saw the following errors.

[23:32:05.250] SyntaxError: unterminated string literal @ http://try.kendoui.com/javascripts/lib/kendo.all.min.js:2
[23:32:06.540] ReferenceError: kendo is not defined @ http://try.kendoui.com/javascripts/binders.js:1
[23:32:06.907] ReferenceError: kendo is not defined @ http://try.kendoui.com/javascripts/view_models/index_viewModel.js:2
[23:32:06.908] ReferenceError: kendo is not defined @ http://try.kendoui.com/javascripts/view_models/lesson_viewModel.js:3
[23:32:07.102] TypeError: this.set is not a function @ http://try.kendoui.com/javascripts/view_models/index_viewModel.js:1
[23:32:07.395] "Invalid App Id: Must be a number or numeric string representing the application id."
[23:32:07.399] "FB.getLoginStatus() called before calling FB.init()."

Is there a problem with the Dojo app, itself?

@(Html.Kendo().Scheduler<TaskViewModel>()
.Name("scheduler")
.Date(DateTime.Today)
.StartTime(new DateTime(2013, 1, 1, 7, 00, 00))
.EndTime(new DateTime(2013, 1, 1, 18, 00, 00))
.Height(500)
.MinorTickCount(1)
.MajorTick(15)
.Selectable(true)



.Editable(e => e.TemplateId("editor"))

.Views(views =>
{
views.DayView();
views.WeekView(weekView => weekView.Selected(true));
views.MonthView();
views.AgendaView();


})

.Messages(message =>
{
message.Today("Hoy Día");
message.AllDay("Todo el Día");
message.Save("Reservar");
message.Cancel("Cerrar");
message.Views(views =>
{
views.Day("Diario");
views.Month("Mensual");
views.Week("Semanal");


});

message.ShowWorkDay("Mostrar Todo el Día");
message.ShowFullDay("Mostrar Horario");


message.Editor(Editor =>
{
Editor.EditorTitle("Cita");

});


})

.Timezone("Etc/UTC")

.DataSource(d => d
.Model(m =>
{
m.Id(e => e.TaskID);
})
.Read("Read", "Action")
.Create("Create", "Action")
.Destroy("Destroy", "Action")
.Update("Update", "Action")
)

)

------------------------------------------------
TASK Class

public partial class Task : ISchedulerEvent2
{
public string Title { get; set; }
public DateTime Start { get; set; }
public DateTime End { get; set; }
public string Description { get; set; }
public bool IsAllDay { get; set; }
public string Recurrence { get; set; }
public string RecurrenceRule { get; set; }
public string RecurrenceException { get; set; }

public string Telefono { get; set; }
public string Ficha_Num { get; set; }
public string Medico { get; set; }
}

-------
And the template

<script id="editor" type="text/x-kendo-template">

<table border="0">
<tr style="border-style:hidden">
<td style="border-style:hidden"><label>Paciente</label></td>
<td style="border-style:hidden"><input style="width:300px;" field = "value: Title" data-bind="value: Title" /> <button class="k-button" data-bind="value: buscar_ficha">Buscar</button></td>
</tr>
<tr style="border-style:hidden">
<td style="border-style:hidden">Teléfono</td>
<td style="border-style:hidden"><input data-bind="value: Telefono"/></td>
</tr>
<tr style="border-style:hidden">
<td style="border-style:hidden">Comienza</td>
<td style="border-style:hidden"><input data-type = "date" data-role="datetimepicker" data-bind="value: Start" /></td>

</tr>
<tr style="border-style:hidden">
<td style="border-style:hidden">Finaliza</td>
<td style="border-style:hidden"><input data-type = "date" data-role="datetimepicker" data-bind="value: End" /></td>
</tr>
<tr style="border-style:hidden">
<td style="border-style:hidden">Médico</td>
<td style="border-style:hidden"><input data-bind="value: Medico"/></td>
</tr>
<tr style="border-style:hidden">
<td style="border-style:hidden">Ficha</td>
<td style="border-style:hidden"><input data-bind="value: Ficha_Num"/></td>
</tr>
<tr style="border-style:hidden">
<td style="border-style:hidden">Memo</td>
<td style="border-style:hidden"><input style="width:300px;" data-bind="value: Description"/></td>
</tr>


</table>

</script>

The event appears on the scheduler, this means is reading from the controller, but when I click on the event to show the event window, the data is not reflected in the fields.

I will apreciate your help

Johnny

Using this example:
http://demos.kendoui.com/web/calendar/template.html

Is there any easy & quick way to make the calendar navigate on swipe event? It is easier for tablet users than having to click on the arrows (I think).

Thank you.

I'm doing like:
layout.showIn("#content", myView);

Is there a way to assign a transition effect when navigating between views?

For screens where I have a header and footer, the scrolling is very shaky. When I try to scroll down, the whole screen including the header and footer moves. Is this not a supported layout (where the screen is scrollable with a header and footer)

Hey guys

Would not be easier if we could define in which view NOT to show the drawer?

In my app, the only screen the drawer can't be opened is the login screen, so I have to specify ALL views of my app but one.

What do you think?

Hi,

If i run the code below, the error is
Error: The mobile application instance is not fully instantiated. Please consider activating loading in the application init event handler.
var app=new kendo.mobile.Application($(document.body), {
 skin: "flat",
 init: function() {
            console.log("Kendo UI Mobile application is ready");
        }
});
app.showLoading();
    setTimeout(function() {
        app.hideLoading();
    }, 10000);

And if i do it like this below, it will work.
var app=new kendo.mobile.Application($(document.body), {
 skin: "flat",
 init: function() {
            console.log("Kendo UI Mobile application is ready");
            app.showLoading();
    setTimeout(function() {
        app.hideLoading();
    }, 10000);
        }
});
So don't understand how to use app.showLoading for init and during views.
Can you advise what is the best practice to use the app.showLoading(),     app.hideLoading();

1. When my phonegap/html page first loads while the mobile page is loading and populating data into datasource to be bind to listview. So I would prefer the user to see the loading icon instead of a blank screen/page.
2. During transition from a 1st view to 2nd view before the data appears in the listview of the 2nd view.

Thanks.

Hello, 

I'm using the kendoui.2013.1.319

I'm trying to create a  pie chart inside a kendo window control.
I want the chart to dynamically create when I open the window, 
(in the real application it preforms as drill down chart that changes according to parent bar chart click),

but when I  try do so , the labels of the chart are not shown.

I attached a short demo.

can you please tell me if there is a problem with my implementation?


Thanks

Eran


 <div id="example" class="k-content">
    

<div id="window">
 <div class="chart-wrapper">
        <div id="chart"></div>
      </div>
    </div>

    <span id="undo" style="xdisplay:none" class="k-button">Click here to open the window.</span>


<script>


  var data = [
            {
                "source": "Hydro",
                "percentage": 22,
                "explode": true
            },
            {
                "source": "Solar",
                "percentage": 2
            },
            {
                "source": "Nuclear",
                "percentage": 49
            },
            {
                "source": "Wind",
                "percentage": 27
            }
        ];



          

        function createChart() {
            $("#chart").kendoChart({
                title: {
                    text: "Break-up of Spain Electricity Production for 2008"
                },
                legend: {
                    position: "bottom"
                },
                dataSource: {
                    data: data
                },
                series: [{
                    type: "pie",
                    field: "percentage",
                    categoryField: "source",
                    explodeField: "explode"
                }],
                seriesColors: ["#42a7ff", "#666666", "#999999", "#cccccc"],
                tooltip: {
                    visible: true,
                    template: "${ category } - ${ value }%"
                },
seriesDefaults: {
                    labels: {
                        visible: true,
                        background: "transparent",
                        template: "#= category #: #= value#%"
                    }
                }
            });
        }
        

        //$(document).ready(createChart);
        $(document).bind("kendo:skinChange", createChart);
 
                $(document).ready(function() {
                    var window = $("#window"),
                        undo = $("#undo")
                                .bind("click", function() {
                                    window.data("kendoWindow").open();
createChart();

                                    undo.hide();
                                });

                    var onClose = function() {
                        undo.show();
                    }

                    if (!window.data("kendoWindow")) {
                        window.kendoWindow({
                            width: "500px",
                            title: "About Alvar Aalto",
                            actions: [
                                "Pin",
                                "Minimize",
                                "Maximize",
                                "Close"
                            ],
                            close: onClose,
visible: false
                        });
                    }
                });
            </script>

            <style scoped>

                #example 
                {
                    min-height:500px;
                }

                #undo {
                    text-align: center;
                    position: absolute;
                    white-space: nowrap;
                    padding: 1em;
                    cursor: pointer;
                }
                .armchair {
                float: left;
                margin: 30px 30px 120px 30px;
                text-align: center;
                }
                .armchair img {
                    display: block;
                    margin-bottom: 10px;
                }
            </style>
        </div>