Questions on Kendo UI for jQuery Forum

1 answer

143 views

2-line header and column templates that support sorting, filtering

Hi,

I need to do some customization on the header row and not sure if this is possible. Please take a look at the attached image. My rows are 2-lines type including my header row. Do you think this is possible on header row with custom row template?

I am sure I can do this on my item rows with custom row template, but not sure if this is possible on the header row as well.

Thanks.

Grid

answered on 20 Dec 2012

2 answers

254 views

Multiple File Upload Selection in IE

It appears that IE (8,9, not sure about 7) does not support selecting multiple files when uploading files. I believe this is a browser limitation as Firefox does this without issue. Is there anything I can do? This could be a showstopper unfortunately.

Upload

answered on 20 Dec 2012

1 answer

590 views

Grid checkbox only sets dirty when clicking certain part of column

All,

I have an issue with a Kendo grid control, where one of the columns is a checkbox. I have the checkbox working using the inline template.

template: "<input type='checkbox' class='k-checkbox' # if (ChkbxCol) { # checked='checked' # } #>"},

The issue is when the grid renders, I can check on or off any rows in the grid, but the dirty icon will not display. The checkbox column renders more towards the right hand of the column and the only way to truly trigger a row change to make the dirty icon display is if I click on the middle of the column, which moves the checkbox more center. Then when I check or uncheck it, I see the dirty bit icon.

Has anybody run into this issue before and if so, please provide some input as it would be greatly appreciated. I also tried to center align the checkbox, but could not. I may be doing something wrong, but if I can get it so that when I click the checkbox, that it sets the dirty icon instead of having to click the middle of the column which moves the checkbox more centered and then have to check it that way.

I also tried to use a Kendo row template, but somehow for the row template, when I try clicking the middle of the checkbox column, it doesn't do like the above and so the dirty bit never is set.

<script id="rowTemplate" type="text/x-kendo-tmpl">

<tr>

<td>#= kendo.toString(Received_Date,"MM/dd/yyyy") #</td>

<td align:"center">

#if(ChkbxCol){#

<input type="checkbox" checked="checked" />

#}else{#

<input type="checkbox" />

#}#

</td>

</tr>

</script>

Grid

answered on 20 Dec 2012

6 answers

2.3K+ views

Form elements

Hello,

I use a grid inside my website. Now i want to add a upload field to this grid to upload images. And also add radio buttons.

Is this possible? I can't find a list of supported element types.

Regards,
Jacob

Grid

answered on 19 Dec 2012

3 answers

319 views

Missing page links (paging)

Hi all,

I've an issue with pagination with an HTML grid.

First I've generated a grid (from server-side code) which is "converted" in a KendoGrid from clien-side code:

<table id="grid">
  <thead>
  <tr>
  <th data-field="field1"></th>
  <th data-field="Id">MyFiels</th>
</th>
</thead>
<tbody>
<tr><td> (and so on..)
</tbody>
  </table>

Now I convert the grid using the following code:

$("#grid").kendoGrid({
sortable: true,
selectable: "row",
height: 350,
pageable: {
refresh: false,
pageSize: 30
}
});

I've trie to set a kind of "RecordCount" property in order to build a number of page links according to PageSize and "TotalRecordCount"
I've tried to set Schema.

schema: {total: 1000 }

but I didn't succedeed,

Any idea?

Note: The grid is built from server-side code, then redered and converted to KendoGrid, all things work as expected but page links are not displayed

Grid

answered on 19 Dec 2012

1 answer

997 views

TabStrip - No border?

Is it possible to hide the border for a TabStrip? I don't see anything in the docs/configuration for doing so.

TabStrip

answered on 19 Dec 2012

0 answers

199 views

iOS Overflow/Scrolling Issue

I have found a display issue with DropDownList on iOS (Mobile Safari). If the list contains more items than fit into it vertically, the items flow over the drop down list boundaries and scrolling does not work (see attached image). Same page works fine on all desktop browsers.
Using the following scripts (via a generated kendo.custom.min.js):

<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.core.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.fx.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.data.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.calendar.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.popup.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.datepicker.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.timepicker.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.datetimepicker.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.list.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.dropdownlist.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.menu.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.numerictextbox.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.dataviz.core.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.dataviz.themes.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.userevents.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.dataviz.svg.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.dataviz.chart.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.draganddrop.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.mobile.scroller.min.js"></script>

Note: added kendo.mobile.scroller later on, but does not make a difference.

Code to create DropDownList (from a <select>):

$("#rangelist").kendoDropDownList();

Am I missing something?

UPDATE: Solved. Adding kendo.mobile.scroller.min.js and kendo.touch.min.js fixed the issue.

DropDownList

asked on 19 Dec 2012

3 answers

209 views

How to hide stock navigator in stock chart

Charts

answered on 19 Dec 2012

1 answer

214 views

Multiple Windows Using MVVM

I'm trying to create an application which has two windows. I am using the MVVM framework, so I'm trying to create my windows declaratively using the data-role="window" syntax. I'm not sure if I'm doing something wrong, but I am running into two issues:

Windows appear to ignore the data-visible="false" attribute
Windows declared after the first window fail to be initialized correctly - eg: Only one of my windows is created correctly.

I created a jsfiddle to demonstrate:
http://jsfiddle.net/rKeR5/

Also:
I should probably point out that I also tried working around this by manually creating the windows using the .kendoWindow() method, but it seems like this breaks the MVVM bindings to fields I have bound inside of the window (to my view model.)

Update:
It seems that the problem only exists if the windows are declared as siblings in the DOM.

Window

answered on 19 Dec 2012

3 answers

208 views

Photo gallery (splitview) width 100% that doesn't stretch photos when rotate the phone!

Hi,
see here: www.iperbooking.net/mobilekendo/iperbooking
In the header section of my site I'd like to show a scrollview with some photos. The default css code in the splitview's documentation is set to: width 320px and height 220px. I tried to change to width 100% and leave height 220px but when I rotate my phone obviously the photos will stretch.
Is it possible to change the height of the gallery on the rotation event?

ScrollView (Mobile)

answered on 19 Dec 2012