or
3 answers
509 views
Hello everyone,
I have some examples with Telerik MVC, one of them is a batch editing grid in MVC, works great but now i need to copy that example to Kendo MVC and the library is not the same (i have the latest version: kendoui.trial.2012.2.710)
Altough i can't find examples of Kendo MVC Libraries in the API section, why?
I can set the action of the save command or the create ?
I have the following code:
@(Html.Kendo().Grid<PersonalDto>()
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.PersonalID).Width(50);
columns.Bound(p => p.FirstName).Width(100);
columns.Bound(p => p.LastName).Width(100);
columns.Bound(p => p.DateBeginToWork).Width(120);
})
.DataSource(dataSource => dataSource
.Ajax() // Specify that the data source is of ajax type
.Model(model => model.Id(p => p.PersonalID))
.ServerOperation(false)
.Read(read => read.Action("FillGrid", "Personal").Data("fnGetSelectedProjectID") // Specify the action method and controller name
))
.Editable(editing => editing.Mode(GridEditMode.InCell))
.ToolBar(commands =>
{
commands.Create();
commands.Save();
})
.Pageable()
)
Thanks
Santiago.
I have some examples with Telerik MVC, one of them is a batch editing grid in MVC, works great but now i need to copy that example to Kendo MVC and the library is not the same (i have the latest version: kendoui.trial.2012.2.710)
Altough i can't find examples of Kendo MVC Libraries in the API section, why?
I can set the action of the save command or the create ?
I have the following code:
@(Html.Kendo().Grid<PersonalDto>()
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.PersonalID).Width(50);
columns.Bound(p => p.FirstName).Width(100);
columns.Bound(p => p.LastName).Width(100);
columns.Bound(p => p.DateBeginToWork).Width(120);
})
.DataSource(dataSource => dataSource
.Ajax() // Specify that the data source is of ajax type
.Model(model => model.Id(p => p.PersonalID))
.ServerOperation(false)
.Read(read => read.Action("FillGrid", "Personal").Data("fnGetSelectedProjectID") // Specify the action method and controller name
))
.Editable(editing => editing.Mode(GridEditMode.InCell))
.ToolBar(commands =>
{
commands.Create();
commands.Save();
})
.Pageable()
)
Thanks
Santiago.
Alexander Popov
Telerik team
answered
on
14 Oct 2015
1 answer
114 views
Hi,
A small problem I encountered when I switch to OData-v4 with scheduler.
I try to filter only the events that are visible in the scheduler control.
I Looks like to me that the parameterMap function is incorrect if the datasource is of type "odata-v4".
Found something like this kendo.data.transports.odata.parameterMap(options, type), but I'm still don't know how to add extra
filters. See code example for what I try to accomplish.
var schedulerDs = new kendo.data.SchedulerDataSource({ type: "odata-v4", serverFiltering: true, transport: { read: { url: function() { return "../odata/SchedulerEvents"; }, dataType: "json" }, parameterMap: function (options, operation) { if (operation === "read") { var result = { start: scope.schedularVar.view().startDate(), end: scope.schedularVar.view().endDate() } return kendo.stringify(result); } return kendo.stringify(options); } }
Vladimir Iliev
Telerik team
answered
on
14 Oct 2015
1 answer
91 views
Hello,
I have got the problem that a kendo toolbar with many icons does not populate an overflowmenu on iPhone6 (iOS 9) with Safari until I change the orientation at least once. I tried to trigger a refresh by calling .resize(true) but it didn't help. Also ._toggleOverflow() shows only an empty list.
If I shrink my page on a desktop-browser everything works as expected.
Can you give me any hint?
Best regards
Marc
Alexander Valchev
Telerik team
answered
on
14 Oct 2015
1 answer
156 views
My View
---------------------------------
@using FOS.WC3.WebUILayer.ViewModels;
@{
ViewBag.Title = "ViewLinkedProcessingClients";
Layout = "~/Views/Shared/DefaultLayout.cshtml";
}
<div id="linkedProcessingClientGrid"></div>
@{
var gridName = "FSN_GRLP02";
var viewName = "FSN_GRLP02";
var componentParam = "&@AID=212";
var gridModel = new GridModel
{
GridName = gridName,
ViewName = viewName,
ComponentParam = componentParam
};
@Html.Partial("~/Views/Shared/GridView.cshtml", gridModel);
}
My Partial View
---------------------------
@using FOS.WC3.Framework.Common
@model FOS.WC3.WebUILayer.ViewModels.GridModel
<script src="@Url.Content("~/Scripts/FOS/Common/Grid/FOSKendoGrid.js")"></script>
<body>
<div>
<div id="GridContainer_@(@Model.GridName + "_" +Model.ViewName)"></div>
</div>
</body>
<script>
var gridName = '@Model.GridName';
var viewName = '@Model.ViewName';
var configUrl = '@Url.Action("GetGridConfig", "Grid")' + "?gridName=" + gridName + "&viewName=" + viewName;
var customParam = '@Html.Raw(Model.ComponentParam)';
var initCallBack = '@Model.InitCallBack';
var gridReadUrl = '@Url.Action("GetGridData", "Grid")' + "?gridName=" + gridName + "&viewName=" + viewName + customParam;
var kendoGrid;
$(document).ready(function () {
var successCallback = function (data) {
if (typeof data.Result != 'undefined') {
if (typeof data.Result.columns != 'undefined') {
var model = {};
var gridId = "GridContainer_" + gridName + "_" + viewName;
var gridConfig = data.Result;
kendoGrid = FOSKendoGrid.Initialize(gridId, gridConfig, gridReadUrl, initCallBack);
}
}
};
var errorCallback = function (xhr) {
};
$.ajax({
url: configUrl,
dataType: "json",
success: successCallback,
error: errorCallback
});
});
</script>
My KendoGridJS
----------------------------------
var FOSKendoGrid = function () {
// var initialize = function (columnOptions, dataModel, readUrl) {
var initialize = function (gridId, gridConfig, gridReadUrl, initCallBack) {
var container = $('#' + gridId).html('<div></div>');
var grid = $('div', container);
var filterOption = {
extra: false,
operators: {
string: {
eq: "Is Equal To",
startswith: "Starts With",
contains: "Contains",
endswith: "Ends With"
}
}
};
//var vm = kendo.observable({
// nameTemplate: '<img src="Content/Images/3dots.png" />',
// buildGrid: buildGrid
//});
//function buildGrid() {
// if (vm.nameTemplate !== '') {
// gridConfig.columns[6].template = vm.nameTemplate;
// }
var gridOptions = {
dataSource: {
transport: {
read: {
url: gridReadUrl,
contentType: "application/json",
type: "GET"
}
},
schema: { data: "ComponentData", total: "Total", model: { id: "ID" } },
serverPaging: true,
serverSorting: gridConfig.sortable,
serverFiltering: false
},
//schema: dataModel,
columns:gridConfig.columns,
height: 300,
sortable: {
mode: "single",
allowUnsort: false
},
filterable: false,
pageable: {
pageSize: gridConfig.rowsperpage,
refresh: true,
messages: {
refresh: "Refresh the grid"
}
}
};
grid.kendoGrid(gridOptions);
if (initCallBack) {
initCallBack(grid);
}
return grid;
};
var refresh = function (gridId) {
var grid = $('#' + gridId + '>div');
if (grid.length < 1) {
return;
}
grid.data("kendoGrid").dataSource.read();
};
//var viewModel = function (gridId) {
// var grid = $('#' + gridId + '>div');
// kendo.observable({
// ordersSource: grid.data("kendoGrid").dataSource,
// selectedRow: null,
// change: function (eventArgs) {
// alert('sds');
// this.set("selectedRow", eventArgs.sender.dataItem(eventArgs.sender.select()));
// }
// });
// kendo.bind(grid, viewModel);
//}
return {
Initialize: initialize,
Refresh: refresh
};
}();
Here I have place the dynamic grid code. My issue is, I need event handler for this dynamic kendo grid. I need full controll for this dynamic kendo grid. For that my thinking is, I planned to pass javascript callback function to "Partial View". I dont want to create event in kendo.js.Since we are planning to make generic.So for this, we need to handle in partial view only.Please provide the solution for this.
​
Georgi Krustev
Telerik team
answered
on
14 Oct 2015
1 answer
107 views
Hello,
I have a question related to configuring a DOM by setting the Dropdown lists, Calendars, Grid, etc.. Once a DOM is configured, can I cache that DOM with all configurations so that next time I show/hide the DOM I don't need to do again those configurations (configure Dropdown list, Grid, etc.)
The reason is that I have a long form and causing some delays every time I need to show/hide while configuring the datasources and controls.
Thank you,
Bilal
Petyo
Telerik team
answered
on
14 Oct 2015
1 answer
95 views
I've setup a grid with inline editing, and have the following for transport code. (Using local data). Why would the create event fire when I click the update button instead of the update event?
It may also help me if someone could explain what happens when the edit button is clicked in regards to what events are fired, etc.
"columnData" is a local dataset, and in reality I don't think I need the create as I don't have any functionality to add rows. This is just a simple editable grid where a user is allowed to edit 3 out of 4 columns with the first column being read only.
transport: { read: function(e) { e.success(columnData); }, update: function(e) { e.success(); }, create: function(e) { var item = e.columnData; item.Id = columnData.length + 1; e.success(item); }
Boyan Dimitrov
Telerik team
answered
on
14 Oct 2015
1 answer
264 views
Using HTML_CodeSniffer, I'm getting lots of errors for the kendoNumericTextBox because there are text fields (input type=text) that do not have an associated label (using label for). The errors are (for each added textbox):
- This text input element does not have a name available to an accessibility API. Valid names are: label element, title attribute.
- This form field should be labelled in some way. Use the label element (either with a "for" attribute or wrapped around the form field), or "title", "aria-label" or "aria-labelledby" attributes as appropriate.
Note, NumericTextBox passes the 508, but fails at the next level, WCAG 2 A. We're targeting WCAG 2 AA, so this is clearly a fail for us.
I also tried against the demos and get the same error.
​How can I get Kendo to render in such a way as to pass WCAG?
​
Georgi Krustev
Telerik team
answered
on
14 Oct 2015
1 answer
70 views
Hi
Small error in the kendo ui documentation for the grid properties, see the attached image
http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-columns.filterable.cell.suggestionOperator
Cheers
Lynden Garrett
Dimiter Madjarov
Telerik team
answered
on
14 Oct 2015
1 answer
71 views
Hi..
I have a kendo Date picker it is functioning well​.
On click of icon in input box I am able to open date dialog and it is working.
But I want this dialog should also open in click of input box as well..
here is the example that i tried ​http://dojo.telerik.com/iRuDa
kindly help to resolve issue,
Thank you in advance
I have a kendo Date picker it is functioning well​.
On click of icon in input box I am able to open date dialog and it is working.
But I want this dialog should also open in click of input box as well..
here is the example that i tried ​http://dojo.telerik.com/iRuDa
kindly help to resolve issue,
Thank you in advance
Kiril Nikolov
Telerik team
answered
on
14 Oct 2015
2 answers
1.9K+ views
I am binding a function to the treeView's dataBound event. I'm using a hierarchical data source with a remote url (web api). I have found that the event fires once before any data is loaded, again when it is loaded, and again for each time I expand a node. I know lazy loading is enabled by default, but even so I can see in the network traffic that the entire hierarchical data items are loaded just once. I guess the tree re-binds at each node Expand. Then I disabled lazy loading, and now the event fires four times after loading the remote data! My tree has four top-level nodes, so perhaps once for each node?
I'd like a dataBound event that fires once and only once, after the data is all loaded.
version 2015.3.930
Thanks,
Randy
