Sitefinity MVC and Kendo UI
Hi Everyone.
New release of sitefinity supports MVC. It's amazing!
How I can include kendo ui to View? As I know sitefinity contains buildin version of kendo and I think I should use this version for prevent conflicts.
Sadly they did not add it to the JavaScriptLibrary enum (finger pointing at Georgi) :p Which is wierd because jQueryFancyBox is a first-class citizen there, but not Kendo?
If you use JustDecompile they at least now removed the VERSION # on the embedded one (v2012.1.519)
Telerik.Sitefinity.Resources.Scripts.Kendo.kendo.all.min.js
<sitefinity:ResourceFile Name="Telerik.Sitefinity.Resources.Scripts.Kendo.kendo.all.min.js" Static="true" />It's works for Web Forms, but doesn't works for MVC.
I have not full solution. Maybe somebody can help me.
I just crete controller and register this controller as widget.
using System;using System.Collections.Generic;using System.Linq;using System.Reflection;using System.Web;using System.Web.Mvc;using Telerik.Sitefinity.Mvc;namespace SitefinityWebApp.Mvc.Controllers [ControllerToolboxItem(Name = "Helper", Title = "Helper", SectionName = "MVC")] public class HelperController : Controller public FileStreamResult ContentFile(string id) var assembly = Assembly.GetAssembly(typeof(Telerik.Sitefinity.Resources.Reference)); string resourceName = assembly.GetManifestResourceNames().ToList().FirstOrDefault(f => f.EndsWith(id)); var resourceStream = assembly.GetManifestResourceStream(resourceName); var mimeType = GetMIMEType(id); return new FileStreamResult(resourceStream, mimeType); private string GetMIMEType(string fileId) if (fileId.EndsWith(".js")) return "text/javascript"; else if (fileId.EndsWith(".css")) return "text/stylesheet"; else if (fileId.EndsWith(".jpg")) return "image/jpeg"; return "text"; Now I'm using WCF service for loading Kendo.
using System.Linq;using System.Reflection;using System.ServiceModel.Activation;using System.ServiceModel.Web;namespace SitefinityWebApp.Sitefinity.Services.paySMARD [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)] public class HelperService : IHelperService public System.IO.Stream ContentFile(string id) var assembly = Assembly.GetAssembly(typeof(Telerik.Sitefinity.Resources.Reference)); string resourceName = assembly.GetManifestResourceNames().ToList().FirstOrDefault(f => f.EndsWith(id)); var resourceStream = assembly.GetManifestResourceStream(resourceName); var mimeType = GetMIMEType(id); WebOperationContext.Current.OutgoingResponse.ContentType = mimeType; return resourceStream; private string GetMIMEType(string fileId) if (fileId.EndsWith(".js")) return "text/javascript"; else if (fileId.EndsWith(".css")) return "text/stylesheet"; else if (fileId.EndsWith(".jpg")) return "image/jpeg"; return "text"; <script type="text/javascript" src="Sitefinity/Services/Content/Helper.svc/ContentFile/kendo.all.min.js"></script>
Sitefinity contains Kendo UI Complete v2012.1.519.
Where I can find styles for this version?
I can download from site only v2012.2.710
Hello Andrey,
Thank you for getting back to us.
As you properly pointed out. for Sitefinity 5.1 we are using an internal build of Kendo UI Complete - v2012.1.519, which is a little lower than the official Q2 release for kendo UI, but we needed this custom build to accommodate our requirements for extended reports in the Email Campaigns module - a widely requested feature which we addressed in 5.1.
Regarding style sheets, we are using the Q1 official - Kendo UI Complete v2012.1.514 CSS in the product core, you can use the same version, there should be no problems. Actually you can load it from the Telerik.Sitefinity.Resources.dll as well, it's located in the Scripts->Kendo->styles folder structure.
Please do not hesitate to let us know if there's anything else we can help you with.
Kind regards,
Boyan Barnev
the Telerik team
Is there a better way to do this in v7+? Adding scripts and styles to MVC widgets still doesn't seem possible through the API and was hoping for an MVC Helper to do this. Below works for Web Form controls but needed an MVC equivalent:
<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %><sf:ResourceLinks ID="resourceLinks" runat="server"> <sf:ResourceFile JavaScriptLibrary="JQuery" /> <sf:ResourceFile Name="Telerik.Sitefinity.Resources.Scripts.Kendo.kendo.web.min.js" Static="true" /> <sf:ResourceFile Name="Telerik.Sitefinity.Resources.Scripts.Kendo.styles.kendo_common_min.css" Static="True" /> <sf:ResourceFile Name="Telerik.Sitefinity.Resources.Scripts.Kendo.styles.kendo_default_min.css" Static="True" /></sf:ResourceLinks>I found a way around this by assuming the page was a Web Form then added the scripts and stylesheets from there. I created this as an MVC helper and can now do this from any view:
@using SitefinityWebApp.Mvc.Helpers@ Html.AddScriptReference(Telerik.Sitefinity.Modules.Pages.ScriptRef.JQuery); Html.AddScriptReference(Telerik.Sitefinity.Modules.Pages.ScriptRef.KendoWeb); Html.AddCssResource("Telerik.Sitefinity.Resources.Scripts.Kendo.styles.kendo_common_min.css"); Html.AddCssResource("Telerik.Sitefinity.Resources.Scripts.Kendo.styles.kendo_default_min.css");
public static void AddScriptReference(this HtmlHelper html, ScriptRef reference) var page = HttpContext.Current.Handler as Page; if (page != null) PageManager.ConfigureScriptManager(page, reference); I posted more information on the implementation and hope it helps: http://goo.gl/sM3ZE4
Hi Basem,
Thank you for sharing your findings with the community.
You can also take a look at the following article for more details on this subject.
Regards,
Sabrie Nedzhip
Telerik