Questions on Kendo UI for jQuery Forum

1 answer

533 views

I added a grid to one of our pages and enabled Paging. There are strange dots appearing on the grid though, see screen shot.

How do I remove the dots?

Here's my Grid:

@(Html.Kendo().Grid(Model.Items as IEnumerable<Transaction>)

.Name("KendoCrGrid")

.Columns(columns =>

{

columns.Bound(e => e.TradeDate).Title("Trade Date").Format("{0:MM/dd/yyyy}");

columns.Bound(e => e.SettlementDate).Title("Settlement Date").Format("{0:MM/dd/yyyy}");

columns.Bound(e => e.Activity).Title("Activity");

columns.Bound(e => e.Description).Title("Security Name");

columns.Bound(e => e.Symbol).Title("Symbol");

})

.Sortable()

.Pageable()

.DataSource(d => d

.Ajax()

.PageSize(20)

.ServerOperation(false)

))

Grid

answered on 15 Jul 2013

1 answer

101 views

Kendo UI Mobile Views not loading properly

I am developing an app that has sever views inside a folder called views. from within my main index.html file if i link to any view within the view folder it does not load in my styles nor transitions all i get is a blank white screen with a word "back" which is for the button in the navbar of the view that loads. Below are the sample code i used.

Index.html file code below.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="cordova.js"></script>
<script src="kendo/js/jquery.min.js"></script>
<script src="kendo/js/kendo.mobile.min.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script src="scripts/hello-world.js"></script>

<link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
<link href="styles/main.css" rel="stylesheet" />
</head>
<body>
<section data-role="layout" data-id="defaultlayout">


</section>
<div data-role="view" id="tabstrip-home" data-title="Hello World!">
<h1>Welcome!</h1>
<a class="button" data-role="button" href="views/about.html">Home</a>
</div>

<div data-role="view" id="tabstrip-uiinteraction" data-title="UI Interaction">
Another view
</div>

<div data-role="view" id="tabstrip-geolocation" data-title="Geolocation">
another view 2
</div>

<div data-role="layout" data-id="mobile-tabstrip">
<header data-role="header">
<div data-role="navbar">
<span data-role="view-title"></span>
</div>
</header>

<div data-role="footer">
<div data-role="tabstrip">
<a href="#tabstrip-home" data-icon="home">Home</a>
<a href="#tabstrip-uiinteraction" data-icon="share">UI Interaction</a>
<a href="#tabstrip-geolocation" data-icon="globe">Geolocation</a>
</div>
</div>
</div>

<script>
var app = new kendo.mobile.Application(document.body, { transition: "slide", layout: "mobile-tabstrip" });
</script>
</body>
</html>

Here is the code for my about.html

<div data-role="view" id="secondview" data-layout="defaultlayout" data-title="Local View">
<div ><p>Hi, I'm a local view.</p></div>
</div>

General Discussions

answered on 15 Jul 2013

2 answers

321 views

Validating a group of checkboxes.

I have a group of checkboxes that I need to validate that at least 1 of them is selected. How do I go about doing this?

Code:

<div class="row-fluid">

<span class="span3">

<input type="checkbox" value="abc" />abc

</span>

<span class="span3">

<input type="checkbox" value="def" />def

</span>

<span class="span3">

<input type="checkbox" value="hij" />hij

</span>

</div>

<div class="row-fluid" id="button-bar">

<button>Submit</button>

</div>

var validator = $('.row-fluid').kendoValidator().data('kendoValidator');

$('#button-bar').on('click', 'button', function(e) {

if (!validator.validate()) {

alert("Failed");

return;

}

alert("Passed");

});

Thanks to anyone that can help me out on this.

Validation

answered on 15 Jul 2013

1 answer

474 views

kendo.all.min.js has error with Uncaught TypeError: Object 837475200000 has no method 'indexOf'

Hi,

I merge all Kendo UI JSP wrapper example (kendoui.jsp.2013.1.514.commercial) to my project and try to run grid examples. All are okay except column-reordering, remote-data, sorting, selection and column-resizing example. Only these 5 (out of 25) examples stuck at loading icon with the below error at kendo.all.min.js. I do not alter any of these examples and I observe the server returns json data correctly.

Firefox 20.0.1 error:
[09:34:51.671] TypeError: e.indexOf is not a function @ http://localhost:9080/Kraken/resources/js/kendo.all.min.js;jsessionid=067CC16FC8CAE8C453FE0B931AA7312E:9

Chrome 28.0.1500.71 m error:
Uncaught TypeError: Object 837475200000 has no method 'indexOf' kendo.all.min.js:9

Thanks.

General Discussions

answered on 15 Jul 2013

1 answer

175 views

Grid not loading data from JSON

My Kendo Grid is not displaying any of the data. I am trying to pull down JSON from a web method in an aspx page. I keep getting the never ending spinner. I am new to using these controls and am banging my head against my desk for a day now.

01.$('#grid').kendoGrid({

02. columns: [

03. {

04. field: "ClientName",

05. title: "ClientName"

06.

07. }],

08. dataSource: {

09. type: 'json',

10. serverPaging: true,

11. schema: {

12. data: 'd'

13. },

14. transport: {

15. read: function (options) {

16. $.ajax({

17. type: 'POST',

18. url: 'Service/GetGridInformation',

19. dataType: 'json',

20. data: '',

21. contentType: 'application/json; charset=utf-8',

22. serverPaging: true,

23. success: function (msg) {

24. options.success(msg.d);

25. }

26. });

27. }

28.

29. }

30. },

31. height: 200,

32. pageSize: 10

33.

34.

35.});

Grid

answered on 15 Jul 2013

1 answer

55 views

Does the Scheduler ever request more data?

It appears that the scheduler reads all events during initialization and does not request more data as you "page" through the calendar. Is this correct?

Scheduler

answered on 15 Jul 2013

1 answer

439 views

How to clear or reset to defult value when manual edit value not found in combobox value list

Hello -

Is there a way to clear manually entered value or reset to defult value in kendo combox when entered value not found in combbox value list. If yes would you give an example in razor please?

Thanks

ComboBox

answered on 15 Jul 2013

2 answers

74 views

Chart not reading from WCF returning JSON object

I've been trying to make this work, but it's been very frustrating.

I'm using these two Kendo demos to work with remote data: This one and the stockdata example seen here.

I've created two WCF services (framework 4.0) and each returns exactly the same JSON object (checked with fiddler2) that is returned in the services consumed above. The only difference between the Kendo demos and my examples is the service being called (mine is running in localhost).

Anything is helpful.

Thanks.

General Discussions

answered on 15 Jul 2013

1 answer

322 views

highlight list item and scroll to it

Hi

I currently use this code to highlight a list item (after updating) - however i would like to scroll (smoothly if possible) to the item as well as highlighting it.

Is there an elegant way to scroll the listview to a specific item, ive tried scrollIntoView of the html element but it messes up my fixed headers.

highlightRow: function (listView, field, value)

{

setTimeout(function () {

var items = listView.items();

for (var i = 0; i < items.length; i++) {

var ele = $(items[i]);

var uid = ele.data('uid');

if (pev.isGoodString(uid)) {

var item = listView.dataSource.getByUid(uid);

if (item != null && typeof item != 'undefined' &&

item[field] == value) {

ele.find('.list-item').highlight();

}

}, 500);

}

jQuery.fn.highlight = function () {

$(this).each(function () {

var el = $(this);

el.before("<div/>")

el.prev()

.width(el.width())

.height(el.height())

.css({

"position": "absolute",

"background-color": "#ffff99",

"opacity": ".7"

})

.fadeOut(3000);

});

}

ListView (Mobile)

answered on 15 Jul 2013

1 answer

111 views

Tabstrip with some static tabs and others loaded via AJAX?

I have a tabstrip with 5 tabs and want to have the content of the first two tabs be static but the final 3 be loaded via ajax when clicked on. Is this possible and if so how?

TabStrip

answered on 15 Jul 2013