Sync with Kendo UI Professional

Author: User Jenkins

docs-aspnet/html-helpers/layout/window/loading-content.md

@@ -49,6 +49,25 @@ To configure the Window with load-on-demand content:
             .LoadContentFrom("AjaxContent", "Window") //Define the Action and Controller names.
         )
 
+You can also use another [`.LoadContentFrom()`](/api/Kendo.Mvc.UI.Fluent/WindowBuilder#loadcontentfrommicrosoftaspnetcoreroutingroutevaluedictionary) overload to pass additional details to the action method returning the Window's content:
+```Razor
+@(Html.Kendo().Window()
+        .Name("window") 
+        .Title("User Details") 
+        .LoadContentFrom("UserDetails", "Window", new { userId = 10}) //Define the Action, Controller names and additional route values.
+    )
+```
+```Controller
+public IActionResult UserDetails(int userId)
+{
+    MyUserViewModel model = myService.GetUserDetails(userId)
+    //fetch required details and pass them to the View 
+    
+    return View(model);
+}
+```
+
+To refresh or change the Window's content on the client, once the Window has been initialized, you can use the [Client-side API of the Window](https://docs.telerik.com/kendo-ui/api/javascript/ui/window) and the [refresh method](https://docs.telerik.com/kendo-ui/api/javascript/ui/window/methods/refresh).
 ## See Also
 
 * [Server-Side API](/api/window)

docs-aspnet/knowledge-base/grid-bind-a-dropdownlist-editor.md

@@ -19,7 +19,7 @@ component: grid
  </tr>
  <tr>
   <td>Product Version</td>
-  <td>217.2.621</td>
+  <td>2017.2.621</td>
  </tr>
 </table>
 
@@ -33,7 +33,7 @@ This is a logged issue. The Core helpers duplicate the property name when the `D
 
 ## Suggested Workarounds
 
-Telerik UI for ASP.NET Core does not provide a built-in solution for achieving this behavior. However, you can still work around the issue by using a `.DropDownListFor(m => m)` definition.
+Telerik UI for ASP.NET Core does not provide a built-in solution for achieving this behavior. However, you can still work around the issue by using a `.DropDownListFor(m => m)` definition when defining an Editor Template.
 
 ```
 @model Project.Models.StateProvinceRegionViewModel
@@ -47,6 +47,7 @@ Telerik UI for ASP.NET Core does not provide a built-in solution for achieving t
 )
 ```
 
+For further details on configuring Custom Editors for the Grid refer to the [Custom Editing](https://docs.telerik.com/aspnet-core/html-helpers/data-management/grid/editing/custom#custom-editing) section of the documentation and the [runnable example demonstrating the use of a DropDownList as a Custom Editor](https://demos.telerik.com/aspnet-core/grid/editing-custom)
 ## See Also
 
 * [API Reference of the Grid](https://docs.telerik.com/kendo-ui/api/javascript/ui/grid)

docs/api/javascript/data/model.md

@@ -16,6 +16,32 @@ res_type: api
 
 The value of the ID of the `Model`. This field is available only if the `id` is defined in the Model configuration. See the following example.
 
+#### Example
+
+    <script>
+      var crudServiceBaseUrl = "https://demos.telerik.com/kendo-ui/service",
+          dataSource = new kendo.data.DataSource({
+            transport: {
+              read:  {
+                url: crudServiceBaseUrl + "/Products",
+                dataType: "jsonp"
+              }
+            },
+            pageSize: 20,
+            schema: {
+              model: {
+                id: "ProductID",
+                fields: {
+                  ProductID: { editable: false, nullable: true },
+                  ProductName: { validation: { required: true } },
+                  UnitPrice: { type: "number" },
+                  Discontinued: { type: "boolean" },
+                }
+              }
+            }
+          });
+    </script>
+
 ### idField `String`
 
 The name of the `Model` ID field. This field is available only if the `id` is defined in the Model configuration.

docs/api/javascript/dataviz/ui/chart.md

@@ -838,6 +838,20 @@ that the total number of categories does not exceed [categoryAxis.maxDateGroups]
 
 This option is ignored if [categoryAxis.baseUnit](/api/javascript/dataviz/ui/chart#configuration-categoryAxis.baseUnit) is set to "fit".
 
+    <div id="chart"></div>
+    <script>
+    $("#chart").kendoChart({
+        categoryAxis: {
+            categories: [
+                new Date("2012/02/01 00:00:00"),
+                new Date("2012/02/02 00:00:00"),
+                new Date("2012/02/20 00:00:00")
+            ],
+            baseUnitStep: "3" // Displays a category for every 3 days.
+        }
+    });
+    </script>
+
 ### categoryAxis.categories `Array`
 
 The category names. The chart will create a category for every item of the array.
@@ -6149,7 +6163,7 @@ The supported values are:
 
 * "date" - specialized axis for displaying chronological data.
 
-#### Example - set the category axis type
+#### Example - set the category axis type to date
 
     <div id="chart"></div>
     <script>
@@ -6167,6 +6181,25 @@ The supported values are:
     });
     </script>
 
+#### Example - set the category axis type to category
+
+    <div id="chart"></div>
+    <script>
+    $("#chart").kendoChart({
+      categoryAxis: {
+        categories: [
+          "Seats",
+          "Cars",
+          "People"
+        ],
+        type: "category"
+      },
+      series: [
+        { data: [1, 2, 3] }
+      ]
+    });
+    </script>
+
 ### categoryAxis.visible `Boolean` *(default: true)*
 
 If set to `true` the chart will display the category axis. By default the category axis is visible.
@@ -39099,16 +39132,18 @@ The data point value.
 
 #### Example - subscribe to the "seriesHover" event after initialization
     <div id="chart"></div>
-    functino chart_seriesHover(e) {
-	/* The result can be observed in the DevTools(F12) console of the browser. */
-      console.log(e.value);
-    }
     <script>
     $("#chart").kendoChart({
       series: [
         { data: [1, 2] }
       ]
     });
+    
+    function chart_seriesHover(e) {
+    /* The result can be observed in the DevTools(F12) console of the browser. */
+      console.log(e.value);
+    }
+    
     var chart = $("#chart").data("kendoChart");
     chart.bind("seriesHover", chart_seriesHover);
     </script>

docs/api/javascript/dataviz/ui/sparkline.md

@@ -3621,30 +3621,33 @@ Template variables:
 
 #### Example
 
-    $("#chart").kendoChart({
-         title: {
-             text: "Internet Users"
-         },
-         series: [{
-             name: "United States",
-             data: [67.96, 68.93, 75, 74, 78]
-         }, {
-             name: "World",
-             data: [15.7, 16.7, 20, 23.5, 26.6]
-         }],
-         categoryAxis: {
-             categories: [2005, 2006, 2007, 2008, 2009]
-         },
-         tooltip: {
-             visible: true,
-             shared: true,
-             sharedTemplate:
-                "#= category # </br>" +
-                "# for (var i = 0; i < points.length; i++) { #" +
-                    "#= points[i].series.name #: #= points[i].value # </br>" +
-                "# } #"
-         }
+    <div id="sparkline"></div>
+
+    <script>
+    $("#sparkline").kendoSparkline({
+      	chartArea: {
+          width: 300,
+          height: 200
+        },
+        type: "bar",
+      	categoryAxis: {
+          categories: [2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014]
+        },
+      	seriesDefaults: {
+          data: [
+            16, 17, 18, 19, 20, 21, 21, 22, 23, 22
+        	],
+          name: "value"
+        },
+        tooltip: {
+            shared: true,
+    			  sharedTemplate: "#= category # </br>" +
+    				"# for (var i = 0; i < points.length; i++) { #" +
+    				    "#= points[i].series.name #: #= points[i].value # </br>" +
+    				"# } #"
+        }
     });
+    </script>
 
 ### transitions `Boolean`*(default: false)*
 

docs/api/javascript/ui/button.md

@@ -96,6 +96,17 @@ Specifies the color of the component. Valid options are `inherit`, `default`, `p
 
 If set to false the badge will not be displayed.
 
+#### Example
+
+    <button id="button">Button</button>
+    <script>
+      $("#button").kendoButton({
+        badge: {
+          text: 21,
+          visible: false
+        }
+      });
+    </script>
 
 ### enable `Boolean` *(default: true)*
 

docs/api/javascript/ui/dropdownlist.md

@@ -924,31 +924,56 @@ The value of the widget.
 
 ### valuePrimitive `Boolean`*(default: false)*
 
-Specifies the [value binding](/framework/mvvm/bindings/value) behavior for the widget when the initial model value is null. If set to true, the View-Model field will be updated with the selected item value field. If set to false, the View-Model field will be updated with the selected item.
+Specifies the [value binding](/framework/mvvm/bindings/value) behavior for the widget when the initial model value is null. If set to `true`, the View-Model field will be updated with the primitive value of the selected item's field (defined in the dataValueField option).if set to `false`, the View-Model field will be updated with the selected item - the entire non-primitive object.
 
-#### Example - specify that the View-Model field should be updated with the selected item value
 
-    <select id="dropdown" data-bind="value: selectedProductId, source: products" >
-    </select>
+#### Example - specify that the View-Model field should be updated with the selected item value
 
+    <div id="example">
+      <div>Change the value of the dropdowns and observe the logged value in the console.</div>
+      <br/>
+      
+      <select id="dropdownPrimitive" data-bind="value: selectedProductId, source: products" >
+      </select>
+      
+      <select id="dropdown" data-bind="value: selectedProduct, source: products" >
+      </select>
+    </div>
     <script>
-    $("#dropdown").kendoDropDownList({
+    $("#dropdownPrimitive").kendoDropDownList({
       valuePrimitive: true,
       dataTextField: "name",
       dataValueField: "id",
       optionLabel: "Select product..."
     });
+      
+    $("#dropdown").kendoDropDownList({
+      valuePrimitive: false,
+      dataTextField: "name",
+      dataValueField: "id",
+      optionLabel: "Select product..."
+    });
+      
     var viewModel = kendo.observable({
       selectedProductId: null,
+      selectedProduct: null,
       products: [
         { id: 1, name: "Coffee" },
         { id: 2, name: "Tea" },
         { id: 3, name: "Juice" }
       ]
     });
+      
+    viewModel.bind("change", function(ev) {
+      if (ev.field === "selectedProduct") {
+        console.log("value: " + JSON.stringify(this.get(ev.field)));
+      } else if (ev.field === "selectedProductId") {
+        console.log("value: " + this.get(ev.field));
+      }
+    });
 
-    kendo.bind($("#dropdown"), viewModel);
-    </script>
+    kendo.bind($("#example"), viewModel);
+   
 
 ### virtual `Boolean|Object`*(default: false)*
 

docs/api/javascript/ui/filemanager.md

@@ -1443,6 +1443,49 @@ The source which triggered the event.
 
 Fired when the widget is bound to data from its data source.
 
+#### Example
+
+    <div id="filemanager"></div>
+    <script>
+    var baseUrl = "https://demos.telerik.com/kendo-ui/service/filemanager/";
+
+            $("#filemanager").kendoFileManager({
+                dataSource: {
+                    schema: kendo.data.schemas.filemanager,
+                    transport: {
+                        read: {
+                            url: baseUrl + "Read",
+                            method: "POST"
+                        },
+                        create: {
+                            url: baseUrl + "Create",
+                            method: "POST"
+                        },
+                        update: {
+                            url: baseUrl + "Update",
+                            method: "POST"
+                        },
+                        destroy: {
+                            url: baseUrl + "Destroy",
+                            method: "POST"
+                        }
+                    }
+                },
+                uploadUrl: "/kendo-ui/service/FileManager/Upload",
+                toolbar: {
+                    items: [
+                        { name: "createFolder" },
+                        { name: "upload" }
+                    ]
+                },
+                dataBound: onDataBound
+            });
+
+        function onDataBound(e) {
+            console.log("event: DataBound");
+        }
+    </script>
+
 #### Event Data
 
 ##### e.sender `kendo.ui.FileManager`