Questions on Kendo UI for jQuery Forum

1 answer

477 views

Custom Command and Ajax Binding

@(Html.Kendo().Grid<TrainingVideo>()

.Name("grid")

.Columns(columns =>

{

columns.Bound(x => x.Name);

columns.Bound(x => x.Description);

columns.Bound(x => x.LastUpdateDate);

columns.Command(commands => commands.Custom("EditVideoCommand")

.Text("Edit")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("EditSelectedVideo", "Home"));

columns.Command(commands => commands.Custom("DeleteVideoCommand")

.Text("Delete")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("DeleteSelectedVideo", "Home"));

columns.Command(commands => commands.Custom("ReplaceVideoCommand")

.Text("Replace")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("ReplaceSelectedVideo", "Home"));

}).DataSource(dataSource => dataSource

.Ajax()

.Read(read => read.Action("VideoListRead", "Home"))

).Pageable().Sortable()

I have a Ajax bound grid and it is working fine when I do not have custom commands as part of my columns. If I use custom commands, I see an empty page
and no grid is displayed. May be because of an error. Could you please let me know how to use custom commands on Ajax bound grid.

Grid

answered on 06 Aug 2013

1 answer

199 views

DatePicker and MVVM initialization via data- attributes (data-min and data-max)

According to threads in this forum from about a year ago setting the min and max attributes on the Date/Time pickers was not possible using the data-min and data-max attributes. I have tried a few things and none of them worked. Telerik representatives stated this was planned for a future release. Is this currently possible and I have been trying it incorrectly? If not, is there actually a planned release that this functionality will be included in?

http://www.kendoui.com/forums/kendo-ui-web/date-time-pickers/can-you-set-min-max-using-data-attribute-initialization.aspx

Date/Time Pickers

answered on 06 Aug 2013

1 answer

39 views

please help me (pagesizesroll in listview)

Hello everyone.
I'm working one listview in kendo ui web.
i want create one pagesizesroll but i don't know do it.
who knows, please help me
thank everyone

ListView

answered on 06 Aug 2013

1 answer

133 views

fully qualified data-role not resolving in a template or in the presence of the dataviz library

Assume I've got a template using a data-role directive:

<link href="kui/styles/kendo.common.min.css" rel="stylesheet" />
<link href="kui/styles/kendo.default.min.css" rel="stylesheet" />
<link href="kui/styles/kendo.flat.min.css" rel="stylesheet" />
<script src="kui/js/jquery.min.js"></script>
<script src="kui/js/kendo.web.min.js"></script>
...
<script type="text/x-kendoui-template" id="kitten-list-template">
<div
data-role="listview"
data-template="kitten-list-item-template"
data-bind="source: imageDataSource">
</div>
</script>

This works just fine. However, if I add the dataviz library, the listview role no longer creates a ListView control:

<link href="kui/styles/kendo.common.min.css" rel="stylesheet" />
<link href="kui/styles/kendo.default.min.css" rel="stylesheet" />
<link href="kui/styles/kendo.flat.min.css" rel="stylesheet" />
<script src="kui/js/jquery.min.js"></script>
<script src="kui/js/kendo.web.min.js"></script>
<script src="kui/js/kendo.dataviz.min.js"></script>
...
<script type="text/x-kendoui-template" id="kitten-list-template">
<div
data-role="listview"
data-template="kitten-list-item-template"
data-bind="source: imageDataSource">
</div>
</script>

Further, if I attempt to resolve this issue by fully qualifying the data-role, it also doesn't work (regardless of whether the dataviz library is pulled in or not):

<link href="kui/styles/kendo.common.min.css" rel="stylesheet" />
<link href="kui/styles/kendo.default.min.css" rel="stylesheet" />
<link href="kui/styles/kendo.flat.min.css" rel="stylesheet" />
<script src="kui/js/jquery.min.js"></script>
<script src="kui/js/kendo.web.min.js"></script>
...
<script type="text/x-kendoui-template" id="kitten-list-template">

<div
data-role="kendo.ui.ListView"
data-template="kitten-list-item-template"
data-bind="source: imageDataSource">
</div>
</script>

Am I doing something wrong? Thanks!

MVVM

answered on 06 Aug 2013

2 answers

51 views

Value Axis Autoscaling does not work in 2013.2

Hello Everyone,

I just upgraded from 2013.1 to 2013.2 and after the update my Chart's valueAxis don't scale to the values automatically. When I set min and max manually it works as expected and all values are within the visible area. In the previous release the value axis automatically scaled so that all values where visible. Did I miss a change and need to configure autoscaling somehow. I was not able to find anything in the docs.

I hope you can help me,

Best regards,

Pascal

Charts

answered on 06 Aug 2013

2 answers

1.6K+ views

Changing tooltip content dynamically

I'm sure this is an easy answer but I've looked high and low and cannot find the answer. How do I dynmically change the content of a tooltip? I'm using the following code:

<div style="text-align:center;width:50%;margin:5px auto" class="inputbox numberSelected" id="ttAnchor"></div>

@(Html.Kendo().Tooltip()

.Callout(false)

.For("#ttAnchor")

.Position(TooltipPosition.Right)

.Width(200)

.Events(events => events.Show(

@<text>

function(e){

e.content = "test";

}

</text>

))

)

e.content does not seem to work. I'm sure I'm just missing a key word somewhere. I do want the content to change everytime the tooltip is shown.

ToolTip

answered on 05 Aug 2013

1 answer

77 views

Render data source with templates

I am using this method to render the data.
$("#foo").html(kendo.render(template, view))

Are they any other code I can use to render the data ?

Data Source

answered on 05 Aug 2013

3 answers

1.0K+ views

Multiselect inline and on a single line?

How to enforce the multiselect component to stay on a single line (when the user selects more elements than they fit in the width)?

Regarding the expected "inline" behavior, this: http://www.kendoui.com/forums/kendo-ui-web/multi-select/inline-multiselect-.aspx
seems to do the trick, but it's still not optimal because of the hardcoded size. Are there any plans to fix this?

regards.

MultiSelect

answered on 05 Aug 2013

1 answer

270 views

Kendo UI grid Ajax Binding

I have a Kendo UI grid to which I want to pass a Model that has data in it. Whenever I do sorting or pagination, I do not want to refresh , so I am trying to do ajax

@using Kendo.Mvc.UI.Fluent

@model IEnumerable<Models.TrainingVideo>

@{

ViewBag.Title = "Video Management";

}

<div style="margin-top: 30px;">

@Html.Kendo().Grid(Model).Name("WatchVideoGrid").Columns(columns =>

{

columns.Bound(x => x.Name);

columns.Bound(x => x.Description);

columns.Bound(x => x.LastUpdateDate);

columns.Command(commands => commands.Custom("EditVideoCommand")

.Text("Edit")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("EditSelectedVideo", "Home"));

columns.Command(commands => commands.Custom("DeleteVideoCommand")

.Text("Delete")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("DeleteSelectedVideo", "Home"));

columns.Command(commands => commands.Custom("ReplaceVideoCommand")

.Text("Replace")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("ReplaceSelectedVideo", "Home"));

}).Pageable().Sortable().Scrollable().Filterable())

public PartialViewResult _VideoManagement()

{

Videos videos = new Videos();

return PartialView(videos.VideoList);

}

where VideoList is List<TrainingVideo> and it works this way without ajax binding, however I am trying to do Ajax

and Here is my ajax version

@Html.Kendo().Grid(Model).Name("WatchVideoGrid").Columns(columns =>

{

columns.Bound(x => x.Name);

columns.Bound(x => x.Description);

columns.Bound(x => x.LastUpdateDate);

columns.Command(commands => commands.Custom("EditVideoCommand")

.Text("Edit")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("EditSelectedVideo", "Home"));

columns.Command(commands => commands.Custom("DeleteVideoCommand")

.Text("Delete")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("DeleteSelectedVideo", "Home"));

columns.Command(commands => commands.Custom("ReplaceVideoCommand")

.Text("Replace")

.DataRouteValues(route => route.Add(o => o.VideoUID).RouteKey("videoId"))

.Action("ReplaceSelectedVideo", "Home"));

}).Pageable().Sortable().Scrollable().Filterable().DataSource(builder => builder.Ajax().Read(read=>read.Action("VideoListRead","Home")))

and controller has

public ActionResult VideoListRead([DataSourceRequest] DataSourceRequest request)

{

Videos videos = new Videos();

return Json(videos.VideoList.ToDataSourceResult(request));

}

I followed the demo closely but could not make it work. Do you see any discrepancies?

Grid

answered on 05 Aug 2013

1 answer

36 views

BUG FOUND: PopOver immediately dismisses on Mobile Safari when triggered by a Tabstrip item

http://jsbin.com/ofawul/3#/

This one's been bugging me but I finally isolated the scenario where is consistently occurs. Please refer to the jsbin link. The last item 'More' has a popover attached to it. This works ok on desktop browsers, but while I ran this in mobile safari, the popover appears then fades away immediately. I tried several workarounds (e.preventDefault() on the close of the popover, etc.) but with no success.

PopOver (Mobile)

answered on 05 Aug 2013