This is a migrated thread and some comments may be shown as answers.

Kendo Version Issue

6 Answers 110 Views
Map
This is a migrated thread and some comments may be shown as answers.
CDK
Top achievements
Rank 1
CDK asked on 11 Dec 2014, 08:49 PM
I'm trying to add a RadMap (2014.2.618.45) to an existing application that uses Kendo UI (2014.1.318). When both the RadMap and Kendo UI libraries are on the same page, there are javascript and CSS issues. An example is TypeError: l.kendoWidget is undefined. What version of the Kendo libraries are used in the RadMap? Any ideas on how to get these to work on the same page?

Thanks!

6 Answers, 1 is accepted

Sort by
0
Ianko
Telerik team
answered on 12 Dec 2014, 11:30 AM
Hello,

I tried to reproduce the encountered issue, but on my end using two maps, one from RadMap and one from Kendo map works fine and I am unable to encounter JavaScript errors.

Also, the only visual issue I can see is with the navigation buttons, which can be easily resolved with this CSS rule:
.RadMap .k-icon {
    font-size:12px;
    background-image: none;
}

You can find attached a simple ASP.NET page with which I tested the problem described. Note that you should add the Telerik.Web.UI assembly and the Kendo-related resources.

Regards,
Ianko
Telerik
0
CDK
Top achievements
Rank 1
answered on 12 Dec 2014, 08:25 PM
Thanks for the CSS rule fix, that worked. I don't have the same js dataviz library setup as your sample. Here is simple example that produces the javascript error. I see the error in the error console in FireBug on FireFox 34.05. The errors also appear in Chrome 39.0.2171.71 m developer tools. If I remove kendo.web.min.js there are no errors. As I stated in my previous post, I'm integrating the RadMap into an existing application that is using 2014.1.318/kendo.web.min.js and the kendoDatePicker.


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="Test" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
    
    <head runat="server">
        <title></title>
        <link href="/Content/kendo/2014.1.318/kendo.common.min.css" rel="stylesheet" type="text/css" />
        <link href="/Content/kendo/2014.1.318/kendo.default.min.css" rel="stylesheet" type="text/css" />
    </head>

    <body>
        <form id="form1" runat="server">
        
   <asp:ScriptManager ID="ScriptManager1" runat="server">
   <Scripts>
   <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
   <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
   </Scripts>
   </asp:ScriptManager>

            <div>
                <input  id="txtDatePicker" />
            </div>
        
            <div>
       <telerik:RadMap runat="server" ID="RadMap1">
       <LayersCollection>
       <telerik:MapLayer Type="Tile" 
                                          UrlTemplate="http://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png" 
                                          Subdomains="a,b,c"
                     Attribution="© <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>"></telerik:MapLayer>
       </LayersCollection>
       </telerik:RadMap> 
            </div>
        
            <script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
            <script src="/Scripts/kendo/2014.1.318/kendo.web.min.js" type="text/javascript"></script>
        
            <script type="text/javascript">

                $("#txtDatePicker").kendoDatePicker({
                    start: "year",
                    depth: "year",
                    format: "MM/dd/YYYY"
                });

            </script>

        </form>
    
    </body>
</html>


0
Ianko
Telerik team
answered on 17 Dec 2014, 11:27 AM
Hello,

The problem is with the additional jQuery reference. Perhaps there are some version collisions, i.e, using the jQuery 1.9.1 overrides the jQuery that serves the RadMap.

I suggest using the jQueryInclude.js file and remove the manual reference.

Example:
<asp:ScriptManager ID="ScriptManager1" runat="server">
    <Scripts>
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        <asp:ScriptReference Path="/Scripts/kendo/2014.1.318/kendo.web.min.js"/>
    </Scripts>
</asp:ScriptManager>
 
<div>
    <input id="txtDatePicker" />
</div>
 
<div>
    <telerik:RadMap runat="server" ID="RadMap1">
        <LayersCollection>
            <telerik:MapLayer Type="Tile"
                UrlTemplate="http://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png"
                Subdomains="a,b,c"
                Attribution="© <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>">
            </telerik:MapLayer>
        </LayersCollection>
    </telerik:RadMap>
</div>
 
<script type="text/javascript">
 
    $("#txtDatePicker").kendoDatePicker({
        start: "year",
        depth: "year",
        format: "MM/dd/YYYY"
    });
 
</script>


Regards,
Ianko
Telerik
0
CDK
Top achievements
Rank 1
answered on 19 Dec 2014, 03:48 PM
Removing the manual reference eliminated the error. Unfortunately, my script manager and the manual jQuery reference are in the master page.  I use a CDN for jQuery. I thought the jQuery reference that ships with the webform controls uses noConflict() to stop collisions from happening. What version of jQuery is shipped with Telerik ASP.NET 2014.2.618.45?
0
CDK
Top achievements
Rank 1
answered on 19 Dec 2014, 03:51 PM
Also, kendo 2014.1.318 requires  jQuery 1.9.1.
0
Ianko
Telerik team
answered on 22 Dec 2014, 02:11 PM
Hi,

You can refer to the Using jQuvery article on the matter for the required version.

As for the script manager, you can safely include the jQuery in the master page (jQueryInclude.js), whereas the Kendo library manually to include it in the head placeholder of the desired aspx page. 

Indeed, conflicts should not appear, although, including the jQuery multiple times is not a recommended technique.

Regards,
Ianko
Telerik
Tags
Map
Asked by
CDK
Top achievements
Rank 1
Answers by
Ianko
Telerik team
CDK
Top achievements
Rank 1
Share this question
or