I have a mobile view that is populated via templates and a click handler of a listview datasource.  The datasource setup (and click handler) look like this:

http://jsbin.com/ihirin/1/edit

My problem is that when running on a mobile device, the first time that the detail UI is loaded, things look OK.  But on subsequent loads, two errors occur: 

1. the install button is not styled correctly (instead, it looks like the install button in the jsbin example above)
2. the scrollview for the screenshots doesn't appear to init correctly, all images are visible.

To me, this feels like a "did not initialize or [re]apply styles to the content when the view was shown for the second time. 

I suspect the answer is to re-apply the styling to the content containers, but since I've only been coding JS and Kendo UI for 3 days, I don't yet know how to do this. 

Pics of what I mean are available here:
https://plus.google.com/photos/109011173406009278052/albums/5847214628087409777?authkey=CP30nZmapuDRuwE

I'd love to know how to fix this problem.

Hi Kendo Mastah,

How can I achieve that? Here is my code that doesn't work :(
It aims to trigger the right arrow key event by pressing the enter key while an item is active.

$(document).keyup(function (e) {

if (e.which == 13) {
	var press = $.Event("keypress");
   	press.ctrlKey = false;
        press.which = 39;
        $("#SourceColumnsMenu_mn_active").trigger(press);
}

});

Thanks!

Hi!

I'm sorry for my bad english.

I have a problem with grid's components, when the grid is in edit mode don't show kendo's components but a asp.Net MVC components.

ViewModel:
    public class ProjetoViewModel
    {
        public int IdProjeto { get; set; }
        [DisplayName("CodigoProjeto")]
        public string CodigoProjeto { get; set; }
        [DisplayName("Nome")]
        [DataType(DataType.Text)]
        public string Nome { get; set; }
        [DisplayName("AnoInicial")]
        [DataType("Integer")]
        [Range(0, int.MaxValue)]
        public int AnoInicial { get; set; }
    }

Grid:
@(Html.Kendo().Grid<DemurrageWeb_ViewModel.Sistema.ProjetoViewModel>()
        .Name("GridProjeto")
        .Columns(columns =>
        {
            columns.Command(command =>
            {
                command.Destroy().HtmlAttributes(new { @title = @DemurrageWeb_Resource.Util.Button.Excluir });
                command.Edit().HtmlAttributes(new { @title = @DemurrageWeb_Resource.Util.Button.Alterar });
            }).Width(111).HtmlAttributes(new { @class = "Icon" });
            columns.Bound(p => p.IdProjeto).Hidden(true);
            columns.Bound(p => p.Nome).Width("50%");
            columns.Bound(p => p.CodigoProjeto).Width("30%");
            columns.Bound(p => p.AnoInicial).Width("20%");
        })
        .ToolBar(toolbar =>
        {
            toolbar.Create().Text("").HtmlAttributes(new { @class = "Icon icAdd", @title = @DemurrageWeb_Resource.Util.Button.Inserir });
        })
        .Editable(editable => editable.Mode(GridEditMode.PopUp))
        .Pageable(pg =>
        {
            pg.Refresh(true);
            pg.PageSizes(new[] { 10, 20, 30 });
            pg.Input(true); pg.Numeric(false);
        })
        .Sortable()
        .Scrollable(s => s.Enabled(true).Height("100%"))
        .DataSource(dataSource => dataSource
            .Ajax()
            .Events(events => events.Error("error_handler"))
            .Model(model => model.Id(p => p.IdProjeto))
            .Batch(true)
            .Read("Projeto_Read", "SProjeto")
            .Create("Projeto_Create", "SProjeto")
            .Update("Projeto_Update", "SProjeto")
            .Destroy("Projeto_Destroy", "SProjeto")
            .ServerOperation(false)
        )
    )

I'm with 2012 Q3 version of kendo UI.

Hi I have a checkbox column in a grid , and i need to update the records based on the check box selected.
Remaining columns in the grid are read only

My question here is when I check and followed by uncheck for a particular row , that row is still in edit state , since i am not doing the reverse of "Set". How do i take out that row from saving?

                   $('.check_row').live('click', function (e) {

                        var topDeviceRoleCode = $("#ddlHeaderDeviceRoleCode").data("kendoDropDownList").value();
                        //alert(topDeviceRoleCode);

                        var grid = $("#DeviceDetailsGrid").data("kendoGrid");

                        var models = [];

                        //find the selected models
                        grid.tbody
                                        .find(":checked")
                                        .closest("tr")
                                        .each(function () {
                                            models.push(grid.dataItem(this));
                                        });

                        //update the models value
                        for (var i = 0, length = models.length; i < length; i++) {
                            models[i].set("DeviceRole", topDeviceRoleCode);
                        }

                    });

Unfortunately I seem not able to get this to work in a jsbin/jsfiddle example, but I have video demonstrating strange behaviour when I open a detailscreen from a listview with endless scroll and and then go back from the detailscreen to the listview. All items seem to be gone, but disappear when i slide my finger over the screen.

Here is a video demonstrating the problem: https://www.dropbox.com/s/8jtuvprfn9ooaex/demo.mp4

Hello,

 I'm trying to build small application with kendo mobile. I have list and want to put icon for every item but if this list is in template icons don't show

 <div data-role="view" data-title="" id="side-root">
   <ul data-role="listview" data-style="inset" data-source="splitViewCategories" data-template="categoriesTemplate">
   </ul>
 </div>
 <script id="categoriesTemplate" type="text/x-kendo-template">
   <a data-icon="about" href=">Category</a>
 </script>
If I use ready list like this

<ul data-role="listview" data-style="inset">
 <li data-icon="about"><a>about</a></li>
 <li data-icon="action"><a>action</a></li>
 <li data-icon="add"><a>add</a></li>                    
</ul>
I can see icons

Thanks,
Mariyana

I have 2 panes in my splitter.  No matter what I do, the right hand pane is always overlaying the position of the left hand pane, i.e. style=left:0px.  How can I fix it so that the right hand pane appears to the right of the left hand one?  Aslo, the size of the pane is not correct and does not reflect the sizes I set in the cshtml.

When I resize the broswer window, it displays as it should- it is just on the initial render that it doesn't work.  Code is below:

@{
    
    Html.Kendo().Splitter()
        .Name("report-splitter")      
        .Panes(panes =>
                   {
                       //Report List
                       panes.Add().Size("250px").Resizable(false).Scrollable(false)
                           .LoadContentFrom(Url.Action("ReportList", "Report", new { Group = reportingContextType }));
                       //Report Details
                       panes.Add().Size("650px").Resizable(false).Scrollable(false)
                            .Content(@<text>
                                          <div id="report-toolbar" class="report-toolbar"></div>
                                          <div id="report-parameters"></div>                                        
                                          <div id="report-body" >
                                              <div style="text-align: center">
                                                  <p>Select a report from the list</p>
                                                  <br/>
                                                  <img src="~/Images/report.png" />
                                              </div>
                                          </div>
                                      </text>);
                   })
        .HtmlAttributes(new { style = "min-height: 600px;" })//forcing the splitter to be bigger than default 300px
        .Render();
}
<script>
    $(document).ready(function (e) {
        $("#report-splitter").kendoSplitter({
            panes: [
                { resizable:false, collapsible: false, size: "250px" },
                { resizable: false, collapsible: false, size: "650px" }
            ]
        });
    });
</script>

Apologies if this has been answered somewhere (couldn't find anything though)...

I have an MVC4 project and I'm using the MVC controls to add a menu to the page from a partial view.

On the _Layout.cshtml file I have:
And then in the Navigation.cshtml file I have:
(Sorry for squishing it together.  The debugger threw exceptions when I had items on different lines, too).

However, I get a very non-descript error message whining about a missing semicolon, when this would work fine on the _Layout.cshtml page.  I really don't want to put it there unless I have no other choice.  There error is:

HttpException:

   Error executing child request for handler 'System.Web.Mvc.HttpHandlerUtil+ServerExecuteHttpHandlerAsyncWrapper'.

The inner exception reveals:

   Navigation.cshtml(15): error CS1002: ; expected"

But none of that would happen on the _Layout.cshtml page.
Thoughts?

When i try to change text of built-in commands (for example: create), then kendoGrid command doesn't work properly (no action). I just changed the grid "editing" example from

 $("#grid").kendoGrid({
                        dataSource: dataSource,
                        navigatable: true,
                        pageable: true,
                        height: 400,
                        toolbar: ["create", "save", "cancel"],

to

 $("#grid").kendoGrid({
                        dataSource: dataSource,
                        navigatable: true,
                        pageable: true,
                        height: 400,
                        toolbar: [{ command: "create", text: "Custom text" }, "save", "cancel"],


It's seems that event does not bind automatically or is something else?

Thank's.

AG

I have 2 tabs, each displaying a Kendo Grid.  If I postback from a grid (e.g. to sort a column) the page refreshes and the tab reverts to the default (1st) tab each time.

Is there a away to have the tab strip remember the tab it was on before the post back and display it?

Regards,
Andrew