Questions on Kendo UI for jQuery Forum

6 answers

211 views

I have created an app that utilizes kendo mobile using Icenium. I have a form on one view that is too long to fit on one page. I have run into an issue where when a text field is active (shows a white input box) and the user scrolls the white input box stays still while the rest of the form scrolls. Then when another field is selected the input box is not in the correct place (it should be directly above the field being edited). This makes for a very confusing form entry if the user accidentally or purposely scrolls while a field is selected. Is there a workaround for this?

On attached example html doc form is under the "settings" view on line beginning on line 100. Though I think the issue lies within the "kendo/js/kendo.mobile.min.js" file which I did not include since it is the default min file (unaltered).

Any help would be greatly appreciated.

General Discussions

answered on 02 Jan 2013

1 answer

144 views

displaying different categoryAxis values than the dataSource

I'm displaying a chart that shows values by the day of week. The JSON payload I get back includes 1-7 as the day of week. How can I either use the 1-7 as indexers into an array of the daysOfWeek, or can I use a static list of values?

var daysOfWeekArray = new Array();

daysOfWeekArray[0] = "Mon";

daysOfWeekArray[1] = "Tue";

daysOfWeekArray[2] = "Wed";

daysOfWeekArray[3] = "Thu";

daysOfWeekArray[4] = "Fri";

daysOfWeekArray[5] = "Sat";

daysOfWeekArray[6] = "Sun";

var daysOfWeekJSON = [

{ "DayOfWeek": "Mon" },

{ "DayOfWeek": "Tues" },

{ "DayOfWeek": "Wed" },

{ "DayOfWeek": "Thur" },

{ "DayOfWeek": "Fri" },

{ "DayOfWeek": "Sat" },

{ "DayOfWeek": "Sun" }];

var customersByDayOfWeek =

[

{ "DayOfWeek": 1, "TableType_Id": "Bar ", "Seated": 285 },

{ "DayOfWeek": 1, "TableType_Id": "Lounge ", "Seated": 39 },

{ "DayOfWeek": 1, "TableType_Id": "Dining ", "Seated": 36 },

{ "DayOfWeek": 2, "TableType_Id": "Bar ", "Seated": 195 },

{ "DayOfWeek": 2, "TableType_Id": "Lounge ", "Seated": 32 },

{ "DayOfWeek": 2, "TableType_Id": "Dining ", "Seated": 18 },

{ "DayOfWeek": 3, "TableType_Id": "Bar ", "Seated": 193 },

{ "DayOfWeek": 3, "TableType_Id": "Lounge ", "Seated": 28 },

{ "DayOfWeek": 3, "TableType_Id": "Dining ", "Seated": 21 },

{ "DayOfWeek": 4, "TableType_Id": "Bar ", "Seated": 199 },

{ "DayOfWeek": 4, "TableType_Id": "Lounge ", "Seated": 30 },

{ "DayOfWeek": 4, "TableType_Id": "Dining ", "Seated": 12 },

{ "DayOfWeek": 5, "TableType_Id": "Bar ", "Seated": 195 },

{ "DayOfWeek": 5, "TableType_Id": "Lounge ", "Seated": 29 },

{ "DayOfWeek": 5, "TableType_Id": "Dining ", "Seated": 19 },

{ "DayOfWeek": 6, "TableType_Id": "Bar ", "Seated": 195 },

{ "DayOfWeek": 6, "TableType_Id": "Lounge ", "Seated": 23 },

{ "DayOfWeek": 6, "TableType_Id": "Dining ", "Seated": 24 },

{ "DayOfWeek": 7, "TableType_Id": "Bar ", "Seated": 191 },

{ "DayOfWeek": 7, "TableType_Id": "Lounge ", "Seated": 30 },

{ "DayOfWeek": 7, "TableType_Id": "Dining ", "Seated": 21 }

]

$("#customersByDayOfWeek").kendoChart({

theme: $(document).data("kendoSkin") || "default",

dataSource: {

data: customersByDayOfWeek,

//transport: {

// read: {

// url: reportsAPI,

// dataType: "json"

// }

//},

group: {

field: "TableType_Id"

}

},

title: {

text: "Customers Per Month, By Table Type"

},

legend: {

position: "bottom"

},

seriesDefaults: {

type: "column",

labels: {

visible: true,

format: "{0:n0}"

}

},

series: [{

field: "Seated",

name: "",

colorField: "userColor"

}],

valueAxis: {

labels: {

format: "{0}"

}

},

categoryAxis: {

data: daysOfWeekJSON,

field: "DayOfWeek"

}

});

Charts

answered on 02 Jan 2013

2 answers

270 views

Serious Bug with Mobile Switch with custom labels

Hi,

We ran into a serious issue with the switch, when applying custom labels (a must for international support).

If the on/off labels are changed - after initialization ($("#my...").kendoMobileSwitch({...})

it all works well.

If we change the value in code (either by referencing the checked attribute of the tag or by doing $("#my....").data("kendoMobileSwitch").options.checked = .... the visual display gets crazy, it loses the custom values, and in iOS seems to also lose the blue color for on.

The solution we found was to initialize the tag each time we are trying to set it's value. It works well, but we get a DOM leak, we get junk tags created in the DOM from the previous executions.

Suggestions for a workaround or fixes would be greatly appreciated.

Switch (Mobile)

answered on 02 Jan 2013

3 answers

626 views

Kendo upload not working correctly.

HI ,

I am using kendoUpload() in menual upload method, not auto upload. 1st i select file, it is correctly added after am upload another file, i select only one file but show one file more time in file selection.( i attached copy of this.)

use, autoupload: false,

Upload

answered on 02 Jan 2013

9 answers

812 views

DataSource relative URLs?

Hi, I am trying to put a relative URL against a read property in a dataSource but when the page is rendered, the dataSource always seems to be prefixing the URL with a '/' making it look from the root. Any way to get around this please?

Data Source

answered on 02 Jan 2013

5 answers

201 views

[Solved] ListView data not rebound after navigation to another partial view

Hello,
First time data is bound okay via controller.

@(Html.Kendo().ListView<Models.InterfaceModel>(Model)
.Name("listView").Events(ev => ev.Change("onSelected"))
.TagName("div")
.ClientTemplateId("list-view-template")
.DataSource(dataSource => dataSource
.Model(model => model.Id("InterfaceId"))
.PageSize(6)
.Read(read => read.Action("ReadInterfaceListView", "Home"))
)
.Pageable()
.Selectable()
)

after I navigate to another partial view and return to the partial view with above kendo listview, data is not bound (though it IS sent from controller okay - I see it in debug Model is filled okay)

Any help would be appreciated.

Thanks

ListView

answered on 02 Jan 2013

1 answer

81 views

IE9 bug when collapsing a node

Using IE9, if you browse to http://demos.kendoui.com/web/treeview/animation.html and expand/collapse the “Decor” tree item, unwanted artifacts appear below the treeview

TreeView

answered on 02 Jan 2013

1 answer

119 views

The numeric pad key "." is blocked for "pl_PL" culture

The numeric pad key "." is mapped as "," for polish keyboards but when you enter a number in the numerictextbox the key is blocked by the widget. Is there a workaround for this problem?

NumericTextBox

answered on 02 Jan 2013

4 answers

560 views

[Solved] CORS odata grid

Hello,
I am trying to visualize data from our company's server through Kendo Grid. The data itself is avabile through secure WCF service over HTTPS with authentication. Since the server is in another domain and we need the authentication, i have to use CORS. Without authentication it works just fine using jasonp, but unforunattely that's not an option for us. So my code looks something like this:

var DS = new kendo.data.DataSource({

type: "odataCors",

transport: {

read: {

url: "https://.../TestData",

crossDomain: true,

withCredentials: true,

beforeSend: function (req) {

req.setRequestHeader("Authorization", "Basic" + auth);

}

});

I am using odataCors extension, which i found somewhere here on the forums. Requestwise it looks allright and it works like it should when i call DS.read() - ajax sends OPTIONS message with Origin, server responds with adequate headers, ajax sends GET message with auth cookie and server returns valid jsonp odata.

Trouble begins when i want to attach this datasource to the grid. It doesn't work, it seems like it is processing a response from the OPTIONS response and not from the second one, which actually returns data.

Is there a way to make it work? Any help would be appriciated very much!
Thank you.

Grid

answered on 02 Jan 2013

1 answer

370 views

Hiding columns in ListView

How can I hide columns in Listview?

<script id="list-view-template" type="text/x-kendo-template">
<div class="product-view">
<dl>
<dd style='visibility:hidden'>${InterfaceId}</dd>
<dd>${InterfaceName}</dd>
<dd>${ViewName}</dd>
</dl>
</div>
</script>

Worked

But when I try to hide via JS:
$("#listView").kendoListView({
dataBound: function (e) {
$(".product-view dd:first").hide();
});

didn't work.

Any help would be appreciated. Thanks
Shabby

ListView

answered on 02 Jan 2013