Questions on Kendo UI for jQuery Forum

8 answers

364 views

incorrect icons?

Hello. Per the API documentation here:
http://docs.telerik.com/kendo-ui/getting-started/mobile/icons

I added icons from the list available at the end of the page. I added the following to my css file:

.km-orders-e:after,
.km-orders-e:before
{
content: "\e306";
}
.km-items-e:after,
.km-items-e:before
{
content: "\e320";
}

The icons that display for these 2 items are in the attached image. What are the correct values for the items I want to display from the list of icons?

General Discussions

answered on 26 Feb 2014

1 answer

144 views

Radial Gauge Bezel Customization

Is there any way to customize the Radial Gauge Bezel? Specifically I would like to be able to change the stroke and color, like shown in the attached image.
I've achieved this by changing the stroke and fill color values in chrome developer console like this:

<path style="display: block; " d="M 21.748 348.065 A230 230 0 1,1 448.252 348.065 L 434.345 342.445 A215 215 0 1,0 35.655 342.445 z" stroke-linecap="square" stroke-linejoin="round" fill-opacity="1" stroke-opacity="1" fill="#d2d3d6" stroke="#9c9b9b"></path>

Is there a way to set this by default, so it renders all path sections like this (Note only top part of radial bezel is colored in this image, and not the yellow and red parts)? We're really in need of this functionality, and we've been looking for it for a _long_ time.

Thanks in advance :)

Regards,
Nicklas

LinearGauge

answered on 26 Feb 2014

5 answers

152 views

Blank ListView

Hello,
I have a blank ListView showing even after dataBound executes and this.dataSource.data() has data in it. The odd part is that when it is showing blank, if I tap in an area on the blank ListView where I think there is an item it then shows. It's as if the ListView is hidden and only shows after I tap within the area of the items.

Internal Build: 2013.3.1414

Your thoughts?

FYI, I switched back to Release Build 2013.3.1324 and it works normal. There is something wrong with 2013.3.1414

Thanks.

ListView (Mobile)

answered on 26 Feb 2014

1 answer

118 views

[Solved] Grid vertical scroll issue windows phone 8

I'm using kendo grid on normal web application - it is NOT kendo mobile. I'm using only Kendo DataViz and Kendo Web.
My grid do not have vertical scroll. It always shows all rows.

My probrem is that page scrolling is not working when touching and scrolling on grid.
All is working when I put my finger outside of grid.

Horizontal internal grid scroll is working without issue. So I can see all columns when I scroll grid horizontally.

But I cannot scroll page when I put finger on grid rows.

Scrolling page is working e.g. on IPhone.

Kind Regards
Marcin

Grid

answered on 26 Feb 2014

4 answers

2.6K+ views

DatePicker is not showing the date after selection

It is the first time I am attempting to use the DatePicker, so excuse me in advance if I am just missing something basic, but here is the scenario.

I am using a basic datePicker with a min and max value: (by the way, if I remove the min and max, i have the same problem)

var periodDays = modelFromServer.DaysInPeriod.length;
    $("#dayPicker").kendoDatePicker({
        min: new Date(modelFromServer.DaysInPeriod[0].Date),
        max: new Date(modelFromServer.DaysInPeriod[periodDays - 1].Date)
});

When I select a day in the calendar, I would expect that day to show up in text next to the picker, but I have not been able to get it to show up there. How do you set the displayed date? See attached image for the picker.

If I break and look at the value of   $("#dayPicker").data("kendoDatePicker").value() i get the proper date that I selected. It just won't fill in the text field next to the calendar icon.

Any idea what I am doing wrong?

DatePicker

answered on 26 Feb 2014

4 answers

210 views

How can i prevent tabstrip footer blinking when load a remote view?

hi,

Please advise....How can i prevent tabstrip footer blinking when i load a remote view? any trick?

This is my remote view:

<div data-role="view" id="order_list_mobile" data-layout="mobile-tabstrip" data-title="<?php echo $this->language->get('text_sale');?>" data-reload="true" data-show="afterShow">

<header data-role="header">

<div data-role="navbar">

<a data-role="backbutton" data-align="left">Back</a>

<span data-role="view-title"><?php echo $this->language->get('text_sale');?></span>

</div>

</header>

<ul data-role="listview" data-style="inset" data-type="group" class="inboxList">

<li>

<?php echo $this->language->get('text_sale');?>

<ul>

<?php if ($orders) { ?>

<?php $id = 0;?>

<?php foreach ($orders as $order) { ?>

<li>

<h3 class="time"><?php echo $order['customer']; ?></h3>

<h3><?php echo $order['date_added']; ?></h3>

<h3><?php echo $order['total']; ?></h3>

<p><?php echo $order['date_added']; ?></p>

<?php foreach ($order['action'] as $action) { ?>

<a data-role="button" href="<?php echo $action['href'];?>">

<?php echo $action['text']; ?>

</a>

<?php } ?>

</li>

<?php } ?>

</ul>

</li>

</ul>

</div>

<script>

function afterShow(e) {

var tabstrip = e.view.footer.find(".km-tabstrip").data("kendoMobileTabStrip");

tabstrip.switchTo(2);

}

</script>

And this is my footer that initialized just one time:

<div data-role="layout" data-id="mobile-tabstrip">

<header data-role="header">

<div data-role="navbar">

<a data-align="left" data-role="backbutton" class="nav-button"><?php echo $this->language->get('button_back');?></a>

<span data-role="view-title"></span>

<a data-align="right" data-role="button" class="nav-button" href="#index" data-icon="refresh"></a>

</div>

</header>

<div data-role="footer">

<div data-role="tabstrip" id="myTabStrip">

<a href="#tabstrip-home" data-icon="recents"><?php echo $this->language->get('tab_general');?></a>

<a href="#index.php?route=catalog/product&token=<?php echo $this->session->data['token'];?>" data-icon="cart"><?php echo $this->language->get('text_catalog');?></a>

<a href="#index.php?route=sale/order&token=<?php echo $this->session->data['token'];?>" data-icon="bookmarks"><?php echo $this->language->get('text_sale');?></a>

<a href="#tabstrip-settings" data-icon="settings"><?php echo $this->language->get('text_setting');?></a>

</div>

Please see the video with my problem:

http://www.youtube.com/watch?v=OI8pkYXC6rk

TabStrip (Mobile)

answered on 26 Feb 2014

4 answers

97 views

jQuery version for Q2 2013?

Not seeing the jQuery version for Q2 2013 listed anywhere. It's nice that you bundle jQuery with Kendo, but I like knowing the version I'm using. Is it still 1.9.1?

Thanks.

General Discussions

answered on 26 Feb 2014

1 answer

4.0K+ views

KendoDateTimePicker has bug with 24 hour format

Hello,
I have noticed this bug during our development.
I have a html input like this set to 10/10/2011 3:35PM
<input id="datepicker" value="10/10/2011 3:35PM" style="width:250px;" />

Now I change this to a kendoDateTimePicker with 24 hour time format.
$("#datepicker").kendoDateTimePicker({format: "MM/dd/yyyy HH:mm", parseFormats: ["MM/dd/yyyy", "HH:mm"], timeFormat: "HH:mm" });

however the time is showing as 3:35 instead 15:35 in 24 hour format.

I have created and example at jsbin

http://jsbin.com/tupof/8/edit

It is critical for our development to fix this issue and appreciate any help to resolve this issue as soon as possible.

Thanks

DatePicker

answered on 26 Feb 2014

4 answers

365 views

[Solved] How to "extend" dataBound event

Throughout he application, we have several Kendo Grids. Some have functionality attached to the dataBound event, some do not. How can I extend the dataBound event to always call some functionality without discarding the functionality added to specific grids.

Let's say I have two grids, 'grid-a' and 'grid-b'. 'grid-a' has functionality associated with its dataBound event (call it gridASpecialFunction). I also want to globally always call a function on dataBound of all grids (call it updateGridLookAndFeel). How can I make sure I always call updateGridLookAndFeel for all grids without having to add it to each grid's dataBound event individually. Also I don't want to discard any existing dataBound event functionality (gridASpecialFunction).

Note, updateGridLookAndFeel should be called after any local functionality.

Thanks,
--Ed

Grid

answered on 26 Feb 2014

9 answers

272 views

Update to 2013.3.1316 now gets "undefined" in input control

The following worked fine when using 2013.2.918.
I use TypeScript and The dropdown control creates fine and the drop down list of choices properly reflect the values in the data source.

I've broken it down to:
this.control = jQuery('<input id="' + this.id + '" ></input>');
var data: Array<Object> = new Array<Object>();
data.push({ data: 'red', label: 'Red' });
data.push({ data: 'green', label: 'Green' });
data.push({ data: 'blue', label: 'Blue' });

this.menu = new kendo.ui.DropDownList(this.control.get(0), {
dataTextField : "label",
dataValueField : "data",
dataSource : data,//this.dataSource,
change : jQuery.proxy(this.onChange, this)
});

Red, Green, Blue are in the list, but the button/input items just shows "undefined" when initially displayed and when any of the items in the drop down menu are selected.

When an item does change, the select() is correct that corresponds to the currently selected item in the drop down list. Further, setting (select(index) ) works as well; the given index is selected in the drop down list. Just the label in the button/input control always says "undefined".

The original code creates a DataSource and data is added to that control, but that does it as well. The code above is a simpler example of the issue.

As I said, all this worked under an earlier version of Kendo.

Screen shot attached.

DropDownList

answered on 26 Feb 2014