Questions on Kendo UI for jQuery Forum

1 answer

151 views

When using the editor with the MetroBlack theme, the dropdown list selector for the paragraph/heading section is all black text.

You can see this by using the demo version and changing the theme to MetroBlack - http://demos.kendoui.com/web/editor/index.html

Using the element inspector in Chrome, it appears it's a direct style update to change color to black. It appears this is occurring in the KendoUI Editor javascript somewhere, but I only have the trial edition and cannot exactly debug the minified files.

See attached screenshots:
Issue01 shows the issue as the background is black and the text is black, so the dropdown is useless.
Issue02 shows that the Chrome element inspector identifies the styling of color is being set to element.style (which means something is directly setting that style - IE, KendoUI in the JS)

Editor

answered on 20 Jan 2014

1 answer

34 views

Include web features in mobile - style renders differently

Kendo UI community,

for our company it will be of importance to include some web features into the mobile app and the problem we just barely encountered is that we were going to include a panelbar into our mobile app. It works just fine, but the design is a little bit off. By that I mean it is not totally filled with color. Take a look at my jsbin http://jsbin.com/eqiVorEx/2/edit

Is there a way to get the panelbar totally filled with color?

Sincerely,
Max Meier

General Discussions

answered on 20 Jan 2014

3 answers

311 views

Edit in agenda view?

How do I add/enable editing in agenda view

Scheduler

answered on 20 Jan 2014

1 answer

92 views

Is there a way to style the color picker so it has a flat look?

There aren't a lot of graphical examples of the k-* properties for styling and there's no documentation (that I can find) for control specific styling.
Thanks.

Jeff

ColorPicker

answered on 20 Jan 2014

1 answer

278 views

Is it possible to style the window frame (border) to be square instead of rounded

I'm trying to match the style of an existing application and the app has square pop-up windows with no border - and there's no border between the title and the body of the dialog. I'm wondering if I can use styling to achieve this same capability or if I have to use another method of displaying a window.

Thanks.

Jeff

Window

answered on 20 Jan 2014

4 answers

123 views

Server Binding Data for Kendo Grid Not Being Created

Hi,
I'm having some trouble with the Kendo Grid not being created at all in my webpage.
I followed this tutorial:
http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/grid/server-binding#client-side-events-and-server-binding
and tried all the methods provided.
I've verified that the connection DOES work, and that I can get data from the server.

Here's my Controller:

public ActionResult Output()

{

ViewBag.Message = "Location Name/Address Here";

ViewBag.Link = "Location";

var fcon = new FruitEntities().Fruits;

ViewBag.Fruits = fcon;

return View();

}

Here's my View:

@{

ViewBag.Title = "Title";

}

<h2>Some grid should be here......</h2>

@{Html.Kendo().Grid<HR360Dashboard.Models.Fruit>()

.Name("Grid")

.BindTo((IEnumerable<HR360Dashboard.Models.Fruit>)ViewBag.Fruits)

.Columns(columns =>

{

columns.Bound(p => p.Fruit_ID);

columns.Bound(p => p.Name);

columns.Bound(p => p.Color);

})

.Pageable();

}

I've checked using dev tool inspectors, and the grid doesn't show up at all.

Help Please! Thanks

Grid

answered on 20 Jan 2014

1 answer

142 views

Typescript; Duplicate overload signature for 'data'.

Adding the newest kendo.d.ts to my project along with the jquery.d.ts file gives me the following error ...

`'Duplicate overload signature for 'data''`

This occurs on line 9699 of the file, where the code reads ...

data(key: string): any;

Commenting it out works fine, but I do not like to have to mess with the vendor files like this. I am using the jQuery typescript definitions at Definitely Typed because the native jQuery one from the typescript website fails to even compile.

I am absolutely in love with Typescript, and I am adoring how Kendo integrates with it, but is there any chance this can get updated?

General Discussions

answered on 20 Jan 2014

1 answer

84 views

More love for ModalVIew

Hey guys

I'm using Kendo UI Mobile for quite a long time, and since the beginning I'm a bit disappointed with the ModalView. I think it should have more features that a regular View has. Examples and other ideas:

- Zoom
- Layout
- AfterClose event
- AfterOpen event (or beforeOpen? Can't remember right now if the open event is triggered after or before the opening animation)
- URL parameters
- Possibility of specifying different sizes for tablets
- Automatic height (is this achievable on current version?)

The app we're working now needs a image viewer, and we thought that the ModalView would be best for this, to not interfere with the navigation flow, but the lack of zoom hindered that idea.

So I ask, please, give more love to the ModalView!
Thanks!

ModalView

answered on 20 Jan 2014

1 answer

243 views

Make ModalView appear on the center of the screen

Hi I'm a newbie in Kendo UI Mobile, I wanted to know how to make a modalview appear on the center of the screen, just like the one in the demo (demos.kendoui.com/mobile/modalview/index.html). I've been trying to manipulate the CSS but still can't find the easy way to do it.

Another question is also what is the best way to center all the contents in the ModalView?

By the way here's my code, which as you can see the ModalView appears on the top left of the screen instead of in the middle:

01.<!DOCTYPE html>

02.<html>

03.<head>

04. <title>Social Leaderboard</title>

05. <link rel="stylesheet" type="text/css" href="https://da7xgjtj801h2.cloudfront.net/2013.3.1119/styles/kendo.common.min.css">

06. <link rel="stylesheet" type="text/css" href="https://da7xgjtj801h2.cloudfront.net/2013.3.1119/styles/kendo.default.min.css">

07. <link rel="stylesheet" type="text/css" href="https://da7xgjtj801h2.cloudfront.net/2013.3.1119/styles/kendo.mobile.all.min.css">

08.

09. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="application/javascript"></script>

10. <script src="https://da7xgjtj801h2.cloudfront.net/2013.3.1119/js/kendo.mobile.min.js" type="application/javascript"></script>

11.

12. <script>

13. this.application = new kendo.mobile.Application(document.body);

14.

15. $(document).ready(function Start(){

16. $("#view-modal").data("kendoMobileModalView").open();

17. });

18. </script>

19.</head>

20.<body>

21. <div data-role="view" data-title="Modal Test" id="view-modaltest">

22. <header data-role="header">

23. <div data-role="navbar">

24. <a data-role="button" data-align="left" id="btnBack">Back</a>

25. <span data-role="view-title">Leaderboard</span>

26. </div>

27. <ul data-role="buttongroup" data-index="0" data-select="OnSelectTimeFrame">

28. <li>All-Time</li>

29. <li>Monthly</li>

30. <li>Weekly</li>

31. </ul>

32. </header>

33. <footer data-role="footer">

34. <div data-role="tabstrip" class="tabstrip" data-select="OnSelectLeaderboard">

35. <a data-icon="globe">Global</a>

36. <a data-icon="contacts">Friends</a>

37. </div>

38. </footer>

39. </div>

40.

41. <div data-role="modalview" id="view-modal" style="width: 300px; height: 240px;">

42. <header data-role="header">

43. <div data-role="navbar">

44. <span>Challenge Friend</span>

45. </div>

46. </header>

47. <div>

48. <img src="https://fbcdn-profile-a.akamaihd.net/static-ak/rsrc.php/v2/yo/r/UlIqmHJn-SK.gif">

49. <span> X </span>

50. <img src="https://fbcdn-profile-a.akamaihd.net/static-ak/rsrc.php/v2/y9/r/IB7NOFmPw2a.gif">

51. </div>

52. <div>

53. <a data-role="button" id="btnOKChallenge">OK</a>

54. <a data-role="button" id="btnCancelChallenge">Cancel</a>

55. </div>

56. </div>

57.</body>

58.</html>

Thanks heaps!

Dede

ModalView

answered on 20 Jan 2014

1 answer

358 views

Getting input values from input within Editor

Hi - quick question,

I want to pre-populate the editor with inputs of different types (<input> tag such as textboxes, checkboxes, etc.) then have the user fill out these inputs and then when the user saves, i will go and grab the form input values and post them to the server.

this seems fairly straightforward, and the Editor renders all of the inputs on the form perfectly, but when i use jquery to peer into the $("#editor").data("kendoEditor").value(); object, none of the inputs values have been populated with the data entered. now, if i type into the editor window in another location (not in the input), then i can see those changes in the value option just fine. does the Editor accommodate this? or am i just missing something?

Thanks,

Editor

answered on 20 Jan 2014