Questions on Kendo UI for jQuery Forum

1 answer

258 views

Hi, I have a kendo dropdownlist in a div on my page and I am trying to create a hover effect where when the user hovers over that general area the list will fade in/out. The problem I have is that when a user clicks on the dropdown and then hovers over the list of items, the main dropdown box fades out. I understand this happens because the list is not within my defined 'hovering' area so the fade out gets triggered.

My question is how can I set it up so that even when a user hovers over the list portion the dropdown should still be showing.

<div class="video">
<div class="headers" style="position:absolute;display:none;">
<input id="tracks" data-bind="kendoDropDownList: tracks" />
</div>
<iframe id="VideoFrame" frameborder="0" width="100%" height="100%"></iframe>
</div>

$('.video', element).hover(function() {
$(this).find('.headers').fadeToggle('fast');
});

DropDownList

answered on 03 Apr 2013

2 answers

257 views

ClientTemplate column, apply filtering, sorting ?

Hello,

We have a (boolean) CheckBox column in Kendo UI Grid . (Razor ASP.NET MVC4)
My question is, is it possible to apply filtering and/or sorting to a ClientTemplate 'column',
Is there a sample available ?

Thanks
Thomas

Grid

answered on 03 Apr 2013

1 answer

95 views

Editor example

Do you have an example load text or document from ajax?

Editor

answered on 03 Apr 2013

3 answers

121 views

Lag between "change" and "refresh"

I am working on a phonegap app in Icenium, but this question is really about Kendo UI Mobile.

My app has something like this:

var myObservable = kendo.observable({

displayText: '',

revealText: function (myText) {

              // Do some stuff...

this.set('displayText', myText);

playASound();

}

});

kendo.bind($('#PlayGameContainer'), myObservable);

function playASound() {

// This will play a sound.

}



function addRowsToAListView() {

      // This will add some rows to a ListView.

}

"displayText" is bound to a div so that when it changes, the text in the div also changes.

Calling "revealText()" by itself works as expected (i.e. the div updates with displayText and then the sound is played). However, if there are calls made immediately after revealText() (e.g. we make a call to addRowsToAListView()), then there is some lag on the refresh (i.e. the sound will play and *then* the div will update with displayText a second later).

I need the sound to play immediately *after* the displayText has actually updated. I tried binding to the "change" event of the ObservableObject (http://docs.kendoui.com/api/framework/observableobject) and playing the sound in the handler, but it made no difference. Is there a way to bind the the "refresh" of the ObservableObject to ensure that the sound is played after the text of the div has updated with displayText? Or is there some other way to deal with this lag?

Thanks in advance.

General Discussions

answered on 02 Apr 2013

2 answers

137 views

How to Render Content from a Separate File

I'm working with the layout example and seem to be missing something very basic. If I run:

$(document).ready(function (){
var fooView = new kendo.View("<span>foo</span>");
var layout = new kendo.Layout("<header>Header</header><section id='content'></section><footer>Footer</footer>");
layout.render($("#app"));
layout.showIn("#content", fooView);
});

I get as expected:
Header
foo
Footer

What I can't figure out is the how to replace:
var fooView = new kendo.View("<span>foo</span>");

with an external file (i.e. foo.html that contains <span>foo</span>)

What is the syntax to load content from an external html file into the content section of a layout?

Thanks for your help.

SPA

answered on 02 Apr 2013

3 answers

487 views

How to set up initial page number in MVC Razor?

Hi

I need to set up initial page number for kendo grid on my MVC Razor form. In previous telerik.mvc grid component I could do somethink like that:

@Html.Telerik().Grid(Model).Name( ... ).

Columns( ... ).

Pageable(o =>

{

o.Enabled(true);

o.PageSize(30);

o.PageTo(5);

}).

EnableCustomBinding(true).

DataBinding(...).

Render();

}

But in Kendo, Pageablebuilder doesn't contains any more PageSize and PageTo functions.

"PageSize" I can set with DataSource binding, but what with "PageTo". Where can I set it in Kendo?

Grid

answered on 02 Apr 2013

2 answers

399 views

How to attach an "onload" to a certain div (data-role/data-title)?

I tried to search but the search seems to search the entire forum and I couldn't limit it to just "mobile", so I'm trying my luck with a thread instead.

I'm currently using the trial version, since I'm new into PhoneGap. Not sure yet if I will go ahead with KendoUI Mobile or if I'll give jQuery Mobile a shot too.

My problem right now is that I have a "div page" on which I want an onload event to fire, when that page is being pulled up.

Here's the div:

<div data-role="view" id="tabstrip-log" data-title="Activitylog" data-layout="mobile-tabstrip">
... some stuff here.
</div>

When I click the button in the tabstrip for #tabstrip-log, then the div above appears, and then I want to also call a function that downloads JSON data and puts it into the div in li's etc. I have that part down, with a manual button. I just want it so that the function is called automatically whenever #tabstrip-log loads.

I don't want the data loaded when the app is started, because then I can just attach it to <body onload="json()">, rather I only want that data pulled when that particular div is shown.

Any hints?

Thanks in advance.

General Discussions

answered on 02 Apr 2013

1 answer

221 views

show legend on chart top of right corner of graph?

currently my legend shows off the end of the graph, i need to save space and have it on top right corner

is this possible?

Charts

answered on 02 Apr 2013

2 answers

232 views

Filtering a grid for many values...

Is there a way to filter a grid column with several different values (ie more than two).
I had thought to possibly use the Filter Menu Customization (http://demos.kendoui.com/web/grid/filter-menu-customization.html) and use a MultiSelect with the datasource set to all of the values for that column. It works, but for only one selected value (http://jsbin.com/egobul/10/edit - the value column).
Is this possible, or am I better off moving the filter outside the grid (http://jsbin.com/ameyam/2/edit)

Thanks.

Robin

Grid

answered on 02 Apr 2013

1 answer

133 views

TreeView transport.create

It's posible to bind a HierarchicalDataSource to TreeView, and make Kendo automatically call the transport.create method when a node is appended?

I have made a example code trying to do this, but with no success: http://jsbin.com/alibem/10/edit

Thanks in advance :)

Data Source

answered on 02 Apr 2013