or
1 answer
178 views
Hi,
I think I found a little (big) bug in the grids ClientTemplate. I use JavaScript-Code in a ClientTemplate. The problem is, that the + sign doesn't work.
Here is what I tried:
.ClientTemplate("<ul>#for(var i = 0; i < myObj.length; i++){#<li>#=myObj[i].Name#</li>#}#</ul>");
I simplified the template a little bit. The fact is, that the i++ in my for-loop doesn't work. It gets to be an endless loop. If I set a debugger in there, I can only see for(var i = 0; i < myObj.length; i ) --> The + signs are missing! And it doesn't matter where I use the +. It isn't displayed when I debugg the code.
I hope you understand what I mean!
My current workaround is to use -(-1) .............. #for(var i = 0; i < myObj.length; i = i-(-1)){#
Brian Roth
Top achievements
Rank 1
Rank 1
answered
on
25 Sep 2012
0 answers
119 views
Hi,
I've noticed from using Kendo MVC wrappers that the initialisation scripts are injected directly into the DOM after the control being rendered.
How can these be rendered in a specific location (eg: at the end of the body)?
Also, is there any way to pre-process these at build time so that we can take advantage of minification?
Thanks,
Chris
I've noticed from using Kendo MVC wrappers that the initialisation scripts are injected directly into the DOM after the control being rendered.
How can these be rendered in a specific location (eg: at the end of the body)?
Also, is there any way to pre-process these at build time so that we can take advantage of minification?
Thanks,
Chris
Chris
Top achievements
Rank 1
Rank 1
asked
on
25 Sep 2012
0 answers
163 views
Hello I have a grid that isnt paging correctly. When I click on page x it just sits there.
Here is my code.
layout.cshtml
----------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title - My ASP.NET MVC Application</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
@Styles.Render("~/Content/Site.css")
@Styles.Render("~/Content/kendo/2012.2.710/kendo.common.min.css")
@Styles.Render("~/Content/kendo/2012.2.710/kendo.default.min.css")
@Scripts.Render("~/Scripts/jquery-1.7.1.min.js")
@Scripts.Render("~/Scripts/kendo/2012.2.710/kendo.web.min.js")
@Scripts.Render("~/Scripts/kendo/kendo.aspnetmvc.min.js")
</head>
<body>
<h2>Benchmarks</h2>
<header>
<div id="logindisplay">
Hello, @User.Identity.Name!
</div>
<nav>
<ul id="menu">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
</ul>
</nav>
</header>
<div id="body">
<section class="content-wrapper main-content clear-fix">
@RenderBody()
</section>
</div>
</body>
</html>
----------------------
index.cshtml
---------------------
@model IEnumerable<Benchmarks.Models.Benchmark>
<script src="~/Scripts/kendo/2012.2.710/kendo.pager.min.js"></script>
@(Html.Kendo().Grid(Model) //The grid will be bound to the Model which is the Products table
.Name("productGrid") //The name of the grid is mandatory. It specifies the "id" attribute of the widget.
.Columns(columns =>
{
columns.Bound(p => p.HydrantNumber);
columns.Bound(p => p.Street1);
columns.Bound(p => p.Street2);
columns.Bound(p => p.Location);
columns.Bound(p => p.Quadrant);
columns.Bound(p => p.Description);
columns.Bound(p => p.Elevation);
columns.Bound(p => p.OrderNumber);
columns.Bound(p => p.RevisionMonth);
columns.Bound(p => p.RevisionYear);
columns.Bound(p => p.Remark);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable(pageable => pageable.PageSizes(true).PageSizes(new int[] {15,20,25}))
.Sortable()
.Scrollable()
.DataSource(dataSource => dataSource
.Ajax()
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(p => p.Id))
.Create(update => update.Action("EditingInline_Create", "Grid"))
.Read(read => read.Action("EditingInline_Read", "Grid"))
.Update(update => update.Action("EditingInline_Update", "Grid"))
.Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
)
Im using visual studio 2012,.net 4.0 and entity framework 4.3.1
Here is my code.
layout.cshtml
----------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title - My ASP.NET MVC Application</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
@Styles.Render("~/Content/Site.css")
@Styles.Render("~/Content/kendo/2012.2.710/kendo.common.min.css")
@Styles.Render("~/Content/kendo/2012.2.710/kendo.default.min.css")
@Scripts.Render("~/Scripts/jquery-1.7.1.min.js")
@Scripts.Render("~/Scripts/kendo/2012.2.710/kendo.web.min.js")
@Scripts.Render("~/Scripts/kendo/kendo.aspnetmvc.min.js")
</head>
<body>
<h2>Benchmarks</h2>
<header>
<div id="logindisplay">
Hello, @User.Identity.Name!
</div>
<nav>
<ul id="menu">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
</ul>
</nav>
</header>
<div id="body">
<section class="content-wrapper main-content clear-fix">
@RenderBody()
</section>
</div>
</body>
</html>
----------------------
index.cshtml
---------------------
@model IEnumerable<Benchmarks.Models.Benchmark>
<script src="~/Scripts/kendo/2012.2.710/kendo.pager.min.js"></script>
@(Html.Kendo().Grid(Model) //The grid will be bound to the Model which is the Products table
.Name("productGrid") //The name of the grid is mandatory. It specifies the "id" attribute of the widget.
.Columns(columns =>
{
columns.Bound(p => p.HydrantNumber);
columns.Bound(p => p.Street1);
columns.Bound(p => p.Street2);
columns.Bound(p => p.Location);
columns.Bound(p => p.Quadrant);
columns.Bound(p => p.Description);
columns.Bound(p => p.Elevation);
columns.Bound(p => p.OrderNumber);
columns.Bound(p => p.RevisionMonth);
columns.Bound(p => p.RevisionYear);
columns.Bound(p => p.Remark);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(200);
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable(pageable => pageable.PageSizes(true).PageSizes(new int[] {15,20,25}))
.Sortable()
.Scrollable()
.DataSource(dataSource => dataSource
.Ajax()
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(p => p.Id))
.Create(update => update.Action("EditingInline_Create", "Grid"))
.Read(read => read.Action("EditingInline_Read", "Grid"))
.Update(update => update.Action("EditingInline_Update", "Grid"))
.Destroy(update => update.Action("EditingInline_Destroy", "Grid"))
)
0 answers
137 views
Hi!
I can't load information in json format in my KendoGrid...
URL : http://dotnet.habitatpro-com.local/test.json
CODE:
<html>
<head>
<title></title>
<script type="text/javascript" src="Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="Scripts/kendo.all.js"></script>
</head>
<body>
<div id="example" class="k-content">
<div id="grid"></div>
<script type="text/javascript">
$(document).ready(function () {
var crudServiceBaseUrl = "http://dotnet.habitatpro-com.local/test.json",
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl,
dataType: "jsonp"
},
parameterMap: function (options, operation) {
if (operation !== "read" && options.models) {
return { models: kendo.stringify(options.models) };
}
}
},
batch: true,
pageSize: 30,
schema: {
model: {
id: "ProductID",
fields: {
ProductID: { editable: false, nullable: true },
ProductName: { validation: { required: true} },
UnitPrice: { type: "number", validation: { required: true, min: 1} },
Discontinued: { type: "boolean" },
UnitsInStock: { type: "number", validation: { min: 0, required: true} }
}
}
}
});
$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
height: 400,
toolbar: ["create"],
columns: [
{ field: "ProductName", title: "Product Name" },
{ field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "150px" },
{ field: "UnitsInStock", title: "Units In Stock", width: "150px" },
{ field: "Discontinued", width: "100px" },
{ command: ["edit", "destroy"], title: " ", width: "210px"}],
editable: "popup"
});
});
</script>
</div>
</body>
</html>
Do you have any suggestions ?
Thanks
I can't load information in json format in my KendoGrid...
URL : http://dotnet.habitatpro-com.local/test.json
CODE:
<html>
<head>
<title></title>
<script type="text/javascript" src="Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="Scripts/kendo.all.js"></script>
</head>
<body>
<div id="example" class="k-content">
<div id="grid"></div>
<script type="text/javascript">
$(document).ready(function () {
var crudServiceBaseUrl = "http://dotnet.habitatpro-com.local/test.json",
dataSource = new kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl,
dataType: "jsonp"
},
parameterMap: function (options, operation) {
if (operation !== "read" && options.models) {
return { models: kendo.stringify(options.models) };
}
}
},
batch: true,
pageSize: 30,
schema: {
model: {
id: "ProductID",
fields: {
ProductID: { editable: false, nullable: true },
ProductName: { validation: { required: true} },
UnitPrice: { type: "number", validation: { required: true, min: 1} },
Discontinued: { type: "boolean" },
UnitsInStock: { type: "number", validation: { min: 0, required: true} }
}
}
}
});
$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
height: 400,
toolbar: ["create"],
columns: [
{ field: "ProductName", title: "Product Name" },
{ field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "150px" },
{ field: "UnitsInStock", title: "Units In Stock", width: "150px" },
{ field: "Discontinued", width: "100px" },
{ command: ["edit", "destroy"], title: " ", width: "210px"}],
editable: "popup"
});
});
</script>
</div>
</body>
</html>
Do you have any suggestions ?
Thanks
2 answers
207 views
I am working with the good example of Editing custom editor under the MVC examples.
It shows how to build a dropdownlist for use when editing a cell in a grid.
I have to create a new post in the grid and I add the following to the file; Editing_Custom.cshtml:
.Create(create => create.Action("EditingCustom_Create", "Grid")) .ToolBar(toolBar => { toolBar.Save(); toolBar.Create(); })And I already get an error here before I come to do the coding in the .cs-file.
When debugging with firebug, I get an error from javascript that says: ReferenceError: EnrollTypes is not defined.
EnrollTypes is the class that is used for making the dropdownlist.
Could someone please give me a hint on what I have to do when creating a post in a grid with relational data?
I saw in some forum that Foregin key will sove this problem, but in my case there is no key column which can be named as foreign key. I just want to have a dropdown in grid column and it should also appear when I click on Add New Item button.
Regards,
Nandan
Petur Subev
Telerik team
answered
on
25 Sep 2012
0 answers
130 views
I have the following:
@(Html.Kendo().ListView<CourseServiceModel.CourseSearchResult>(Model)
.Name("CourseListView")
.TagName("div")
.ClientTemplateId("template")
.DataSource(dataSource =>
{
dataSource.Read(read => read.Action("GetSearchedCourses", "SearchCourse").Data("getSortBy"));
dataSource.PageSize(10);
})
.Pageable(x => x.PageSizes(true).Refresh(true).Info(true).PageSizes(new int[]{10,25,50}))
)
On the first time the page loads, the datasource is read as expected. On subsequent post the datasource does not get read, no ajax calls.
Works fine in FF and Chrome only an issue in IE (8,9).
Sounds like a caching issue but not sure where to start....
The page navigation is <page to set search criteria> -> RedirectToRoute("Results") -> <Results (contains ListView)>
This was posted in the UI forum by mistake.
<RESOLVED>
the issue was IE caching ajax responses. I tried to add in the headers to not cache etc.that did not work, so had to use a "cache buster" time stamp in the post back data in the getSortBy json object. Maybe this will help someone else.
function getSortBy() {
return {
sortByCritera: $("#SortBy").data("kendoDropDownList").dataItem(),
timeStamp: Date()
};
}
@(Html.Kendo().ListView<CourseServiceModel.CourseSearchResult>(Model)
.Name("CourseListView")
.TagName("div")
.ClientTemplateId("template")
.DataSource(dataSource =>
{
dataSource.Read(read => read.Action("GetSearchedCourses", "SearchCourse").Data("getSortBy"));
dataSource.PageSize(10);
})
.Pageable(x => x.PageSizes(true).Refresh(true).Info(true).PageSizes(new int[]{10,25,50}))
)
On the first time the page loads, the datasource is read as expected. On subsequent post the datasource does not get read, no ajax calls.
Works fine in FF and Chrome only an issue in IE (8,9).
Sounds like a caching issue but not sure where to start....
The page navigation is <page to set search criteria> -> RedirectToRoute("Results") -> <Results (contains ListView)>
This was posted in the UI forum by mistake.
<RESOLVED>
the issue was IE caching ajax responses. I tried to add in the headers to not cache etc.that did not work, so had to use a "cache buster" time stamp in the post back data in the getSortBy json object. Maybe this will help someone else.
function getSortBy() {
return {
sortByCritera: $("#SortBy").data("kendoDropDownList").dataItem(),
timeStamp: Date()
};
}
2 answers
557 views
Telerik had an attribute for the rad_grids called AllowFilteringByColumn="true" which allowed us to filter the records by criteria entered in the textboxes or datepickers at the top of the grid.
Does Kendo do this and is there an example?
All I found in documentation is adding Filterable to the columns which takes true or false. Nothing else and it doesn't do anything.
The other was setting the grid to Filterable which takes no arguments and does nothing so I have no idea...
Thanks for your help...
Paul
Does Kendo do this and is there an example?
All I found in documentation is adding Filterable to the columns which takes true or false. Nothing else and it doesn't do anything.
The other was setting the grid to Filterable which takes no arguments and does nothing so I have no idea...
Thanks for your help...
Paul
0 answers
178 views
Hi,
I have a working Kendo MVC Hierarchy Grid. In that, When the user clicks on link button to show up the child grid, then i need to show up an Actionlink with currently selected ID and following the child grid. I am able to create an Action Link before the child grid. But not ActionLink with Id which currently selected. Creating a new record in the child table through the parent Id should be possible when using Hierarchy grid. Is there any possibility to do this. Any help can be appreciated.
I have a working Kendo MVC Hierarchy Grid. In that, When the user clicks on link button to show up the child grid, then i need to show up an Actionlink with currently selected ID and following the child grid. I am able to create an Action Link before the child grid. But not ActionLink with Id which currently selected. Creating a new record in the child table through the parent Id should be possible when using Hierarchy grid. Is there any possibility to do this. Any help can be appreciated.
Dheyvendaran
Top achievements
Rank 1
Rank 1
asked
on
24 Sep 2012
5 answers
336 views
I've reported this as a bug via a support ticket, but just wanted to warn anyone else who might be, or might be thinking of using the current extensions to Visual Studio 2012, either to create a new MVC4 project with KendoUI, or to use the "Telerik, KendoUI for ASP.NET MVC, Configure project" menu to configure a standard MVC4 project to use KendoUI:
My advice is don't until these problems have been fixed!
My advice is don't until these problems have been fixed!
- The new project wizard does not produce an MVC4 project when you ask it to, it produces an MVC3 one instead.
- The configure project wizard does not currently do its job properly for MVC4 projects. (I have wasted hours on trying to find out why my project wouldn't work before realising that this was the reason, not something I had done in my code!). It seems to follow steps recommended for manual configuration of an MVC3 project and not those for an MVC4 one (e.g. if doesn't amend the bundles, seems to include jquery twice).
Until the bugs in these extensions/wizards are correct, if my own experience is anything to go by, you are likely to find your project is plagued with error messages that will send you off on wild goose chases (because actually they aren't closely related to the problem at all!) like:
"This request has been blocked because sensitive information could be disclosed to third party web sites when this is used in a GET request. To allow GET requests, set JsonRequestBehavior to AllowGet"
(this can be a genuine error in some situations, but here it wasn't, it was caused by the kendoGrid method not being recognised in javascript) Moral [something which I'm not used to, having programmed server side for as long as possible]: keep the Javascript console open and watch out for any red warnings/error messages!
- when I scrolled my grid horizontally, the headings didn't move ...
Overall, I'm only about 30% happy with the way KendoUI has been trumpeted with great fanfare, whilst only half working with MVC4. In many cases the documentation has been wrong (I've had to point out corrections several times) and it is still very incomplete, and these extensions don't seem to have been tested much before release.
Rant over, but this is disappointing from Telerik, who seem to have such great products otherwise.
"This request has been blocked because sensitive information could be disclosed to third party web sites when this is used in a GET request. To allow GET requests, set JsonRequestBehavior to AllowGet"
(this can be a genuine error in some situations, but here it wasn't, it was caused by the kendoGrid method not being recognised in javascript) Moral [something which I'm not used to, having programmed server side for as long as possible]: keep the Javascript console open and watch out for any red warnings/error messages!
- when I scrolled my grid horizontally, the headings didn't move ...
Overall, I'm only about 30% happy with the way KendoUI has been trumpeted with great fanfare, whilst only half working with MVC4. In many cases the documentation has been wrong (I've had to point out corrections several times) and it is still very incomplete, and these extensions don't seem to have been tested much before release.
Rant over, but this is disappointing from Telerik, who seem to have such great products otherwise.
Andrey
Telerik team
answered
on
24 Sep 2012
1 answer
249 views
I have attempted to make my code as close to the example provided in the demos:
http://demos.kendoui.com/web/dropdownlist/cascadingdropdownlist.html
In the demo, when an item is selected from the parent I notice a server call is made to fill child DropDownList.
In my code, when an item is selected from the parent nothing happens. No call to the server is made. What is even stranger is that if I decide to click on the child DropDownList it then decides to make a call to the server. However, when that happens it does not send up the parent's ID as a parameter.
What am I doing wrong? Thoughts on how to debug this?
http://demos.kendoui.com/web/dropdownlist/cascadingdropdownlist.html
In the demo, when an item is selected from the parent I notice a server call is made to fill child DropDownList.
In my code, when an item is selected from the parent nothing happens. No call to the server is made. What is even stranger is that if I decide to click on the child DropDownList it then decides to make a call to the server. However, when that happens it does not send up the parent's ID as a parameter.
What am I doing wrong? Thoughts on how to debug this?
<div style="float: left; margin-right: 10px"> <input id="calendars" /></div><div style="float: left; margin-right: 10px"> <input id="periods" /></div><div class="clearfix"></div>$(document).ready(function () { $("#calendars").kendoDropDownList({ optionLabel: "Select calendar...", dataTextField: "CalendarText", dataValueField: "CalendarCode", dataSource: { type: "json", serverFiltering: true, transport: { read: "http://www.someurl.com/AppName/SomeArea/SomeController/GetCalendars" } } }); var periods = $("#periods").kendoDropDownList({ autoBind: false, cascadeFrom: "calendars", optionLabel: "Select period...", dataTextField: "PeriodCode", dataValueField: "PeriodCode", dataSource: { type: "json", serverFiltering: true, transport: { read: "http://www.someurl.com/AppName/SomeArea/SomeController/GetPeriods" } } }).data("kendoDropDownList");});
C
Top achievements
Rank 1
Rank 1
answered
on
21 Sep 2012
