Hello, I work with kendo grid (via AngluarJS, "kendo.directives").
It work great for Chrome, and IE 11&10&9.
I try to test it with IE8...
The data in grid wasn't appear and next error was appear in console: (full error attached 1.jpg)
***************************************************************************
Error: Invalid template:'<tr data-uid="#=data.blah1#" role='row'><td  role='gridcell'><span ng-bind='dataItem.blah2'>#: data.blah3#</span></td><td  role='gridcell'><span ng-bind='dataItem.blah4'>#: data.blah4#</span></td></tr>';}return o;'
***************************************************************************
I also try to test your own example of Kendo & AngularJS: 'http://demos.telerik.com/kendo-ui/grid/angular'
and the grid is not appear once I test it with IE8 (screenshot attached 2.jpg) Error in console:
***************************************************************************
TypeError: Array.prototype.slice: 'this' is not a JavaScript object
***************************************************************************

Do I miss something or AngularJS with kendo is not supported for IE8?
There is a way to make it work with IE8?

Thanks in advance.

Hi Guys,

I'm hoping for some collective genius as i've hit a stumbling block trying to implement a feature request on a Scheduling application I've written.

The desired effect i'm after is that on a moveEnd event, the user should be prompted with the option to either, Move or Copy the event, with an option to cancel the drag operation also.

So far i have the following (sections of code for illustration purpose only)



So i'm preventing the default operation, populating a global placeholder variable with the event data so it's accessible from the following buttons.


My scheduler data source is quite complex, but in essence contains, create:, update:, read: and destroy: elements, a parameterMap: function to parse the data before the ajax post and a parse: function to format the response.

But i'm at a bit of a loss on where to go next, ideally it would be as easy as calling a method to either create or edit the event but i get the feeling it's not going to be that simple.

Thanks in advance for any suggestions!

Hi,
I wrote a simple appl with a navbar and a title.
Then I add the back button as a lot of examples show and it works perfect.
I create a kind of log-in view where basically a user logs in and I'd like to show at the top right corner in the Nav Bar a button called Log out.
Initially I add directly the button like this:

    <header data-role="header">
        <div data-role="navbar">
            <a class="nav-button" data-align="left" data-role="backbutton">Back</a>
            <span data-role="view-title"></span>
            <a id="logout" class="nav-button " data-align="right" data-role="button" onclick="Test.common.logOut()">Logout</a>
        </div>

    </header>

It works of course, but what I should do is to hide it and show it only when the user is logged.
With some jQury stuff I can hide it but not show it again. I missing something.
Can someone please help me?

thanks a lot

I have a listview and save the user selections to localstorage. When the app closes and is reloaded I pull the selected items from localstorage. 

How can I reselect the items when the listview is displayed? I tried to trigger the click event but I don't know what item actually triggers the click.

Hello,

The datasource read method is called twice when the contents are displayed on UI. Please refer to the attached file for code details.

Thanks for  your time and help.

Hi, I have a grid checkbox column that i want to stay read-only in edit mode; but i want to programatically change the value (mode.set) - and have it reflect on the grid.
How can i achieve this?

I have some columns that are frozen by default, if I try something like $("#grid").data("kendoGrid") I only get the data of all the columns that are not frozen as it seems. How do I get access to the frozen columns?

Is it possible to set height for the scroller to be a percentage instead of hard coded pixels or ems?  There are so many screen sizes that using a percentage for height makes it easy to adapt for different sizes without having to manually get the window height, and then do a conversion on the height I want and apply it.



<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <link href="styles/kendo.common.min.css" rel="stylesheet" />
        <link href="styles/kendo.default.min.css" rel="stylesheet" />
        <link href="styles/kendo.mobile.all.min.css" rel="stylesheet" />
        <link href="styles/Custom/GeneralStyles.css" rel="stylesheet" />
        <script src="js/jquery.min.js"></script>
        <script src="js/kendo.all.min.js"></script>

        <title>KonnexMe</title>
    </head>
    <body>
          <!--Main View-->
        <div data-role="view" data-layout="layout" id="viewHome">
            
            <div class="flex">
                <div>
                    <div data-role="scroller" 
                         style="height: 320px; width: 98%; margin-left: .3em; box-shadow: 5px 5px 10px #888888; overflow-x:hidden !important;">
                        <ul id="notesHome" 
                            data-role="listview" 
                            data-type="group" 
                            data-fixed-headers="true">
                            <li>
                                Notes
                                <ul>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>
                <div>
                    <div data-role="scroller" 
                         style="height: 320px; width: 98%; box-shadow: 5px 5px 10px #888888;">
                        <div>
                            <ul id="tasksHome"
                                data-role="listview"
                                data-type="group"
                                data-fixed-headers="true">
                                <li>
                                    Tasks
                                    <ul>
                                        <li>Tasks</li>
                                        <li>Two</li>
                                        <li>Three</li>
                                        <li>Four</li>
                                        <li>One</li>
                                        <li>Two</li>
                                        <li>Three</li>
                                        <li>Four</li>
                                        <li>One</li>
                                        <li>Two</li>
                                        <li>Three</li>
                                        <li>Four</li>
                                        <li>One</li>
                                        <li>Two</li>
                                        <li>Three</li>
                                        <li>Four</li>
                                        <li>One</li>
                                        <li>Two</li>
                                        <li>Three</li>
                                        <li>Four</li>
                                        <li>One</li>
                                        <li>Two</li>
                                        <li>Three</li>
                                        <li>Four</li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div class="flex">
                <div id="activitesHome">
                    <div data-role="scroller"
                         style="height: 320px; width: 98%; margin-left: .3em; margin-top: .5em; box-shadow: 5px 5px 10px #888888; overflow-x:hidden !important;">
                        <div data-role="scheduler"></div>
                    </div>
                </div>
                <div>
                    <div data-role="scroller"
                         style="height: 320px; width: 98%; margin-top: .5em; box-shadow: 5px 5px 10px #888888;">
                        <ul id="alertsHome"
                            data-role="listview"
                            data-type="group"
                            data-fixed-headers="true">
                            <li>
                                Alerts
                                <ul>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                    <li>One</li>
                                    <li>Two</li>
                                    <li>Three</li>
                                    <li>Four</li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>

        </div>
        

        

        <!--Main View Drawer-->
        <div id="drawerHome"
             data-role="drawer"
             data-views="['viewHome']">
            <ul data-role="listview" data-style="inset">
                <li><a>Accounts</a></li>
                <li><a>Calendar</a></li>
                <li><a>Company</a></li>
                <li><a>Correspondence</a></li>
                <li><a>Documents</a></li>
                <li><a>People</a></li>
                <li><a>Reports</a></li>

                <li><img src="" style="height: 10em; margin-left: 1.6em;"></li>

                <li><a>Change UI Theme</a></li>
                <li><a data-transition="none">About</a></li>
                <li><a href="/views/Logout.html" data-transition="none" data-target="paneMain">Logout</a></li>
            </ul>
        </div>
        
        
        

        <!--Global Layout-->
        <div data-role="layout" data-id="layout">
            <header data-role="header">
                <div data-role="navbar">
                    <a data-role="button" data-rel="drawer" href="#drawerHome" data-icon="drawer-button" data-align="left"></a>
                    <span data-role="view-title">Sample</span>
                </div>
            </header>

            <footer data-role="footer">
                <div data-role="tabstrip">
                    <a data-icon="contacts">Profile</a>
                    <a data-icon="settings">Settings</a>
                </div>
            </footer>
        </div>
            
        
        <style>
            .flex {
                display: flex;
                flex-direction: row;
            }

            .flex > div {
                flex: 1 1;
            }
        </style>

        <script>
            var app = new kendo.mobile.Application(document.body);
        </script>
    </body>
</html>

We are having an issue with our grid that when a column is dragged into the group section it is no longer horizontal scrollable.

If the grouping is deleted then we can horizontal scroll again.

Has anybody ran into this issue before?

Hi, I noticed a bug in Chrome for editor.  If you click browser back button on a page with editor then click browser forward button, the editor shows the HTML.  I was able to reproduce at demo site as well.

http://demos.telerik.com/kendo-ui/editor/index