Questions on Kendo UI for jQuery Forum

1 answer

456 views

Hello,

I have experienced the problem that I am not able to get fired a double click event using the following code:

$("#md-contentGrid tbody > tr[data-uid]").bind('dblclick', function (e) { alert(); });

However, firing a doubleclick event on the whole table body is working. As soon as I add the tr tag in the selection string the event is not properly bound.

$("#md-contentGrid tbody").bind('dblclick', function (e) { alert(); });

As you can see in the attached screenshot jQuery should match the html structure.

Can you tell what I am doing wrong?
Thanks in advance!

Grid

answered on 08 Nov 2013

5 answers

763 views

get list of selected items from the ListView

Hello all,

I've been playing around with the Kendo UI controls for a while now and for the most part, it's going great :) (otherwise I wouldn't be on the forums)

When working with the listview-control (configured in multi-select-mode) I can't get the list of selected items.

Code:

01.@using (Html.BeginForm("MyMethod", "MyController",Model))

02.{

03. @(Html.Kendo().ListView<List<MyObject>>()

04. .Name("ListOfObjects")

05.

.DataSource(datasource => datasource.Read(read => read.Action("GetMyListOfObjects", "MyController")))

06. .Selectable(select => select.Mode(ListViewSelectionMode.Multiple))

07. .ClientTemplateId("selectedItems")

08. .TagName("div")

09. .Events(e => e.Change("onSelectObject"))

10. )

11.<input type="submit" class="submit" value="Search" />

12.}

Controller:

1.public ActionResult GetMyListOfObjects([DataSourceRequest]DataSourceRequest request)

2.{

3. return Json(MyService.GetMyListOfObjects().ToDataSourceResult(request));

4.}

To check if I actually selected something, I added an event (the change event "onSelectObject):

function onSelectObject(e) {

var selected = $.map(this.select(), function (item) {

return $(item).text();

});

alert("Selected: " + selected.length + " item(s), [" + selected.join(", ") + "]");

return selected;

}

This works. Meaning that when I select items in my listview, the event is fired and I see the alert-message with the correct length and list of selected items.

Now my question is, when I click the "search" button in the form above, how do I get the list of selected items in my controller?

1.public ActionResult MyMethod(List<MyObject> selectedObjects)

2.{

3. //...selectedObjects is always null

4. return View();

5.}

ListView

answered on 08 Nov 2013

3 answers

327 views

hierarchical grid multiple parameters

for a hierarchical grid, how do I pass multiple parameters to action? I would like to also pass filter = somefilter

currently using this format

.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Read(
read => read.Action("IndexBinding_acts", "RptInputMetrics", new { csg = "#=next#" }))

)

Grid

answered on 08 Nov 2013

2 answers

129 views

Reorder items of MVVM Hierarchical DS treeview

Hello,

I am creating tree using MVVM. I get data from server in flat json object and make necessary tree json structure on client side. Don't know if that cause the problem, but reordering of tree items does not work, I get following errors:

Uncaught TypeError: Cannot read property 'nextSibling' of undefined kendo.all.min.js:25
Uncaught TypeError: Cannot read property 'uid' of undefined

... and others. I tried to debug but was not able to find the problem. Any help on fixing errors or advices how to better define data source for the mvvm tree would be much appreciated.

You can find all code here:

http://jsfiddle.net/5fqph/10/

TreeView

answered on 08 Nov 2013

2 answers

62 views

Aboslute Position doesn't work on device with kendo.mobile.all.css

I'm trying to have a list along the left side of the screen and content along the right. I tried using the SplitView but I want a header that spans the enter width of the document. I have everything working on the Icenium simulator, but when I test it on the device the list (absolute positioned content) doesn't show up.

Since it's on the device, I can't debut the HTML/CSS myself. Any ideas?

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<meta name="format-detection" content="telephone=no" />

<meta name="viewport" content=

"user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi"

/>

<link rel="stylesheet" href="css/kendo.mobile.all.css" />

<script src="js/jquery.min.js"></script>

<script src="js/kendo.mobile.js"></script>

<title>Hello World</title>

</head>

<body>

<div id="viewEventList" data-role="view">

<div data-role="header" style="background-color: #FFFFFF;">

<div data-role="navbar" style="padding-top: 10px;">

Test

</div>

<div>

<div data-role="scroller" style="position: absolute; top: 0px; left: 0px; bottom: 0px; width: 245px;">

<div>

<div style="border: 1px solid #000000; border-bottom: 3px; margin: 15px; background-color: #FFFFFF;">

<div style="border-bottom: solid 1px #000000; padding: 5px;">

Item

</div>

<script>

var app = new kendo.mobile.Application();

</script>

</body>

</html>

General Discussions

answered on 08 Nov 2013

2 answers

1.0K+ views

How to pass data to a modal?

I have the following template which opens a modal with the id "terminAbsagen".

In the modal i have a button with id "absagen" which needs the id of the entry i clicked, so i can take further actions for that item, e.g. delete the entry via Ajax:

<script id="termineTemplate" type="text/x-kendo-template">
<a
class="details-link"
data-role="listview-link"
href="\#termindetails?id=#:id#">
<h2>#:titel# #:date# um #:time# Uhr, #:ort#</h2>
</a>


<div class="options">
<a data-role="button" data-item-id="#:id#" href="\#terminAbsagen" data-rel="modalview">absagen</a>
</div>

<div data-role="modalview" id="terminAbsagen" style="width: 95%; height: 80%;">
<div data-role="header">
<div data-role="navbar">
<span>Abmelden</span>

</div>
</div>
<ul data-role="listview">
<li> Möchten Sie sich wirklich abmelden?</li>
</ul>
<div data-role="footer">
<div data-role="navbar">
<a data-click="doSomething(idOfItem)" id="absagen" type="button" data-role="button" class="btn-primary">Ja</a>
</div>
</div>

</div>

</script>

ModalView

answered on 07 Nov 2013

3 answers

1.7K+ views

atatching multiple "filter" tooltips to the body

I am working on a backbone based single page application and having trouble with the tooltips. I figured using the "filter" option would be the best method so I currently have something like

$('body').kendoTooltip({

filter : ".tooltip"

});

$('body').kendoTooltip({

filter : ".bookmark",

content : "bookmark"

});

I'm not sure but it seems as though all the tooltips break after a a new view is loaded even though the body is not changed, only some parts inside it.

Also I notice that when I look out $('body').data() there only seems to be whatever the last tooltip I bound so in the above instance I see options.filter : ".bookmark" but not ".tooltip".

Maybe I'm missing something obvious but all help is appreciated

Thanks

ToolTip

answered on 07 Nov 2013

3 answers

179 views

Binding with computed property property

Hello,
I created two examples. The first works, but needs one extra template. Is it possible to build without additional templates?

working: http://jsfiddle.net/NLN6Z/1/
notworking: http://jsfiddle.net/g9s33/1/

Thank

PS
I was unable to create links without giving me erased already written text and cant login to account in chrome.

Templates

answered on 07 Nov 2013

2 answers

135 views

Recurring event issue when editing one occurrence

I create a current event, let's say it's 3 days long.
I edit the middle occurrence.
The calendar now displays ONLY the middle event that I just edited. The other event is still listed in the datasource, but it no longer shows up on the calendar. Why?

Scheduler

answered on 07 Nov 2013

1 answer

210 views

Virtual scrolling causes Chrome to crash

I've run into an odd issue with the latest version of Kendo UI for MVC (2013.2.918.340) where grids with virtual scrolling will intermittently crash Chrome if the data is re-requested.

Example jsfiddle below based on one of the Kendo demos:

http://jsfiddle.net/M6rKC/2/

Opening this page immediately locks up (and then crashes a few minutes later) Chrome 30.0.1599.101 for me.

The second call to grid._dataSource() is what kills it. This is not precisely what I'm doing in my real application -- instead I have a "Search" button that calls grid.dataSource.read(). You can see in my jsfiddle code that I have this as well, but for some reason this will only crash if the first set of data retrieved from the server (when the grid auto binds) is empty, but the second set (after clicking on Search) is not. Since the demo data URL is not empty I couldn't reproduce this exactly, but the second call to _dataSource() in the jsfiddle causes what appears to be the exact same bug.

I looked at the timeline in Chrome's dev tools and noticed the memory usage spikes from 10MB to 680MB when the XHR completes:

http://i.imgur.com/OU8h6uT.jpg

Shortly after that the memory usage drops again and Chrome becomes unresponsive.

Any ideas what might be causing this? I should mention that none of this happens if virtual scrolling is disabled -- the search button works fine in that case. Is this a known issue or am I doing something wrong?

Thanks!

Grid

answered on 07 Nov 2013