Ivaylo Kenov Telerik Software Academy Technical Assistant

 Kendo UI Summary and Installation  Kendo HTML Helpers  Kendo Widgets  Kendo Grid  Kendo DataViz  Live Application Build 2

 Framework for building modern interactive web applications  Collection of script files and resources (styles, images, etc.)  Leverages  JavaScript  HTML5  CSS3  jQuery 4

 Rich UI Widgets  HTML5 controls based on jQuery Core  3 categories of UI Widgets  Web  DataViz  Mobile  Client-side DataSource  Abstraction for working with all types of data on the client side 5

 MVVM Framework  Provides declarative binding and two-way data synchronization in your web application  Animation and Drag & Drop  Templating  Validation Framework  Server wrappers  ASP.NET MVC  Java and PHP 6

 Download Kendo UI Complete for MVC  Copy and reference Kendo.Mvc.dll  Located in:...\wrappers\aspnetmvc\Binaries\Mvc3  Copy the provided version of jQuery  Copy JavaScript files into ~\Scripts\Kendo  js\kendo.all.min.js and js\kendo.aspnetmvc.min.js  Copy CSS files and images into ~\Content  All from …\styles to ourProject\Styles\Kendo 7

 Create bundles for jQuery and Kendo  Create bundles for CSS  Clear the ignore list for the bundles 8 bundles.Add(new ScriptBundle("~/bundles/jquery").Include( ScriptBundle("~/bundles/jquery").Include( "~/Scripts/Kendo/jquery.min.js")); "~/Scripts/Kendo/jquery.min.js"));bundles.Add(new ScriptBundle("~/bundles/kendo").Include( ScriptBundle("~/bundles/kendo").Include( "~/Scripts/Kendo/kendo.web.min.js“, "~/Scripts/Kendo/kendo.web.min.js“, "~/Scripts/Kendo/kendo.aspnetmvc.min.js")); "~/Scripts/Kendo/kendo.aspnetmvc.min.js")); bundles.Add(new StyleBundle("~/Content/kendo").Include( StyleBundle("~/Content/kendo").Include( "~/Content/kendo.common.*", "~/Content/kendo.common.*", "~/Content/kendo.default.*")); "~/Content/kendo.default.*"));

 Register bundles (if not already)  Render the bundles in your Layout page 9 protected void Application_Start() { … BundleConfig.RegisterBundles(BundleTable.Bundles); BundleConfig.RegisterBundles(BundleTable.Bundles);

 Add Kendo namespace in web.config for the Views folder 10 <system.web.webPages.razor> </system.web.webPages.razor>

 Pure HTML and JavaScript  ASP.NET MVC wrappers  Kendo code MUST be after jQuery reference! 11

Documentation here! here

 HTML Helpers  Lightweight C# objects  Auto-generate markup within a View  Return HTML and JavaScript to the browser  Provide Fluent API  Can be used in both Web Forms and Razor  Easily customized through JavaScript and jQuery 14

 Some Web Widgets  AutoComplete  Calendar  DropDownList  Upload  TreeView  Grid  Some DataViz Widgets  Chart  LinearGauge  RadialGauge 15

 Usage of helpers ViewBag.Products) ViewBag.Products).Name("grid").Name("grid").Columns(columns =>.Columns(columns => { columns.Bound(product => product.ProductID); columns.Bound(product => product.ProductID); columns.Bound(product => product.ProductName); columns.Bound(product => product.ProductName); columns.Bound(product => product.UnitsInStock); columns.Bound(product => product.UnitsInStock); }) }).Pageable().Pageable().Sortable().Sortable())

Live Demo

форум програмиране, форум уеб дизайн курсове и уроци по програмиране, уеб дизайн – безплатно програмиране за деца – безплатни курсове и уроци безплатен SEO курс - оптимизация за търсачки уроци по уеб дизайн, HTML, CSS, JavaScript, Photoshop уроци по програмиране и уеб дизайн за ученици ASP.NET MVC курс – HTML, SQL, C#,.NET, ASP.NET MVC безплатен курс "Разработка на софтуер в cloud среда" BG Coder - онлайн състезателна система - online judge курсове и уроци по програмиране, книги – безплатно от Наков безплатен курс "Качествен програмен код" алго академия – състезателно програмиране, състезания ASP.NET курс - уеб програмиране, бази данни, C#,.NET, ASP.NET курсове и уроци по програмиране – Телерик академия курс мобилни приложения с iPhone, Android, WP7, PhoneGap free C# book, безплатна книга C#, книга Java, книга C# Николай Костов - блог за програмиране

1. Create the WebForms “Library System” exam with ASP.NET MVC and Kendo UI Server Side Wrappers using as much widgets as you can:  TreeView for the Home page  Grid for the Administration  AutoComplete for the Search input  DropDownList for category selection  Others

 “C# Telerik Academy  csharpfundamentals.telerik.com csharpfundamentals.telerik.com  Telerik Software Academy  academy.telerik.com academy.telerik.com  Telerik Facebook  facebook.com/TelerikAcademy facebook.com/TelerikAcademy  Telerik Software Academy Forums  forums.academy.telerik.com forums.academy.telerik.com