Questions on Kendo UI for jQuery Forum

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

138 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

54 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

85 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

272 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

39 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

2 answers

127 views

Get Scheduler TimeSlot on kendoDropTarget

Hi i have a grid and i need to plan a scheduler from this.
How can i get the timeslot where i dragged?

var grid = $("#requestGrid").data("kendoGrid");

var scheduler = $("#ganttScheduler").data("kendoScheduler");

var itemUID;

grid.table.kendoDraggable({

cursorOffset: {

top: 5,

left: 5

},

filter: "tbody > tr",

group: "Grid",

hint: function (e) {

itemUID = e.attr(kendo.attr("uid"));

return $('<div class="k-grid k-widget"><table><tbody><tr>' + e.html()+ '</tr></tbody></table></div>');

}

});

scheduler.element.kendoDropTarget({

group: "Grid",

drop: function (e) {

alert("Dragged row 'uid': " + itemUID);

//in case you need the model(data item) for this row

var model = grid.dataSource.getByUid(itemUID);

var aa = $(e.toElement).text();

itemUID = null;

}

});

Drag and Drop

answered on 05 Aug 2013

1 answer

167 views

In progress icon

This is probably pretty trival but I haven't found the answer yet. When I set a grid to popup mode is there an easy way to show an in-progress icon? Until the form is submitted?

Grid

answered on 05 Aug 2013