Questions on Kendo UI for jQuery Forum

1 answer

141 views

Hello, i've some problem:
When widgets (select, text input) are near the bottom of the screen or need scrolling to reach them and after tapping the widget native controls like keyboard or select drum are invoked these controls move the entire page including NavBar up. But when controls are closed and the page moves back, NavBar doesn't do it completely. It's on the screen but is covered with status bar of the device (that show signal level, battery level, etc).

Platform: iOS 5.1, 5.1.1 - iPhone 4S and iPad2

How can I solve this?

NavBar

answered on 12 Jul 2012

0 answers

91 views

switch in mobal window

Hi all,

Did anyone face an issue like this ?, clicking on the switch in modal window, closes the modal window !

Switch (Mobile)

asked on 12 Jul 2012

1 answer

133 views

Cant submit support tickets on Kendo Complete license holder

Hi folks

I'm trying to submit a support ticket but can't because "Issue Area" has no options to select from the drop down.

I didn't really know where to report to support that I can't report to support so I'm posting here.

You may already be aware of this and fixing it right now.

Thanks.
Michael.

Tried:
Chrome 20.0.1132.47 m
Firefox 13.0.1

Select element has no child options. No JavaScript errors thrown.
Account: esofx

General Discussions

answered on 12 Jul 2012

0 answers

96 views

New for editor

What is the right tool for new developers of new HTML5 markup language?

General Discussions

asked on 12 Jul 2012

10 answers

1.1K+ views

Overriding datasource's JSON parse and stringify - wholesale

Is there any way to override the way the datasource is parsing and stringifying the JSON data, when using the transport? Currently, the Kendo utilities do not handle dates right (at least when using ubiquitous .NET/JSON server libraries). So on both the parameterMap and parse config lines, I have overrides there but they are hardcoded to specific fields since having to deal with javascript object/property level still.

What I want to do is take over the whole parse and stringify with a client library that handles dates better. I cannot seem to hook in the right place - before the raw data is already treated by the Kendo utils. Is this possible while using the rest of the transport functionality and if so, where do I intercept this?

Thanks!
Mike

Data Source

answered on 12 Jul 2012

1 answer

158 views

Binding dropdownlist to a subarray

Hello,
hoping that this will be simple, i am trying to show all the root collections exposed by a odata service. The code looks like this

$(document).ready(
function () {
$("#widgetList").kendoDropDownList({
dataSource:
{
type: "json",
transport:
{
read: "/DynamicOData/oData/?$format=json"
}
}
})
});

the values returned are by the service is

{

"d" : {

"EntitySets": [

"TopSellers", "WorstSellers"

]

}

}

DropDownList

answered on 12 Jul 2012

0 answers

113 views

Alert is not showing thr current row id in ... please help

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="http://localhost/tp-ms/static/js/jquery.min.js"></script>
    <script src="http://localhost/tp-ms/static/controls/kendoui/js/kendo.web.min.js"></script>
    <link href="http://localhost/tp-ms/static/controls/kendoui/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="http://localhost/tp-ms/static/controls/kendoui/styles/kendo.default.min.css" rel="stylesheet" />
    <link href="http://localhost/tp-ms/static/controls/kendoui/js/kendo.all.min.js" rel="stylesheet" />
     <link rel="stylesheet" href="http://localhost/tp-ms/static/css/grids-min.css" type="text/css">

</head>
<body>
<div id="grid">
</div>
<script>
var dataSample = [];
dataSample.push({
    OrderID: "1",
    ShipName: "line 1"
});
dataSample.push({
    OrderID: "2",
    ShipName: "line 2"
});
dataSample.push({
    OrderID: "3",
    ShipName: "line 3"
});

var dataSource = new kendo.data.DataSource({
    data: dataSample,
    schema: {
        model: {
            id: "OrderID"
        }
    },
    pageSize: 10
});

$("#grid").kendoGrid({
    dataSource: dataSource,
    selectable: true,
   change: function() {
        var row = this.select();
        var id = row.data("id");
       alert(id); // showing undefined but i want the current id...
    },
    columns: ["OrderID", "ShipName"],

});

</script>

</body>
</html>

Grid

asked on 12 Jul 2012

1 answer

210 views

Error while doing remote paging/Sorting

HI I am getting error object does not support this property in kendo.ui.all.js in line d.transport=new n.data.transports[a.type] when I try to get Json data from server.
If i use odata in type highlighted bold below error not come but data is not bind to grid.

This is happening when I use latest beta version of kendo.all.min.js Please see the attached image

Here is my code

$(self.options.element).kendoGrid({
dataSource: {
type: "json",
serverPaging: true,
serverSorting: true,
serverFiltering: true,
allowUnsort: true,
pageSize: 10,
transport: {
read: {
url: self.options.dataURL, //URL to get data
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
data: {}
},
parameterMap: function (options) {
options.portfolioIDs = self.options.portfolioID;
return JSON.stringify(options);
}
},
schema: {
data: "d.data",
total: "d.__Count"
}
},
height: 600,
resizable: true,
reorderable: true,
filterable: true,
sortable: true,
pageable: true,
columns: self._contractConfig.generatedCols //Object with column information

});

Grid

answered on 12 Jul 2012

0 answers

155 views

Adding a Column to a Grid doesn't work when binding data to property in ViewBag

Hi,

I'm trying to add to a Grid a column that doesn't exist in the model. That column only have an icon with some functionality. The problem is the icons doesn't appear when binding data from a property in the ViewBag:

@(Html.Kendo().Grid<Models.Location>()

.Name("availableStops")

.BindTo((IEnumerable<Models.Location>)ViewBag.AvailableLocations)

.Columns(columns =>

{

columns.Bound(p => p.Id).Title("ID");

columns.Bound(p => p.StopLocation).Title("Description");

columns.Template(@<text></text>).ClientTemplate("<span class='k-icon k-add' title='Add' style='cursor:pointer;' onclick='addStop(this)'></span>").Title("Add");

})

.DataSource(dataSource => dataSource.Server().Model(model => model.Id(p => p.IRN)))

)

and appear when I'm populating the grid using an ajax call:

@(Html.Kendo().Grid<SpyMobileLibraryRoute.Models.UISpyFmtLOC>()

.Name("availableStops")

.Columns(columns =>

{

columns.Bound(p => p.Id).Title("ID");

columns.Bound(p => p.StopLocation).Title("Description");

columns.Template(@<text></text>).ClientTemplate("<span class='k-icon k-add' title='Add' style='cursor:pointer;' onclick='addStop(this)'></span>").Title("Add");

})

.DataSource(dataSource => dataSource.Ajax().Read(read => read.Action("GetLocations", "Location")))

)

Thanks in advance.

Grid

asked on 12 Jul 2012

7 answers

334 views

Listview issues - endlessScroll and list loading from datasource

I have two issues with my listview which I would appreciate help with.

1) The listview takes a while to display (aprox 3 seconds). I navigate to the view that has the listview, the h1 of the view appears but it takes a while before the listview is displayed. This happens every time, not just the first time it is loaded.

2) I have added endlessScroll: true and scrollTreshold: 30 to my listview. This seems to display the data from the datasource in a continuous loop that never ends. Is this supposed to happen? I would only want to display the contents of the datasource once and not have this repeating.

I have the following code:

var DataSource = new kendo.data.DataSource({

pageSize: 5,

transport: {

read: "data.php",

dataType: "json",

},

error: function(e) {

alert(e.responseText);

},

sort: { field: "date", dir: "desc" },

schema: {

model: {

id: "id",

fields: {

item: { type: "string" },

date: { type: "date", "string" },

total:{ type: "string" },

status: { type: "string" },

isnew: { type: "string" },

dispatched: { type: "string" }

}

});

<div data-role="view" id="list" data-init="listinit">

<h2>List</h2>

<ul id="list"></ul>

</div>

<script id="list_template" type="text/x-kendo-template">

#

if(status == 1){

var statusText = 'Open';

var statusColour = 'green';

} else if(status == 2) {

var statusText = 'Closed';

var statusColour = 'blue';

} else {

var statusText = 'Problem';

var statusColour = 'red';

}

#

<div style="font-size:70%;padding-right:10%"><div style="float:left;margin-right:3px;">ID. #= id#</div><div style="float:right;" >#= date #</div><div style=

"clear:both;text-align:center;padding: 0 5px;width: 60px;float:left;background-color:#= statusColour #; color: white;font-weight:bold"

>#= statusText #</div><div style="float:right;margin-right:3px;">Total: #= total #</div><div style="clear:both;"></div></div></a></script>

<script>

function listinit(){

$("#list").kendoMobileListView({

dataSource: DataSource,

pullToRefresh: true,

appendOnRefresh: false,

style: "inset",

endlessScroll: true,

scrollTreshold: 30, //treshold in pixels

template: $("#list_template").text()

});

}

</script>

ListView (Mobile)

answered on 11 Jul 2012