Questions on Kendo UI for jQuery Forum

1 answer

605 views

Multiple filter in grid Toolbar template

Hi,

I have been following the example http://demos.kendoui.com/web/grid/toolbar-template.html with a variation and I'm stuck.

I have a grid with multiple dropdownlist and textbox for filtering a kendo grid result. I'm having a problem implementing this but specifically when i try to compare the field value and the value in one of my control (eg dropdownlist value) . I'm trying to compare it to a field in a model list - see Award.AwardTypeID. this might be the cause why it's not working

i have a html input button for the javascript

$('#btnSearch').on("click", function (e) {

refreshGrid();

return false;

});

function refreshGrid() {

$filter = new Array();

$filter.push({ field: "StudentID", operator: "contains", value: $('#txtStudentID').val() });

if ($('#AwardType').val()) {

$filter.push({ field: "Award.AwardTypeID", operator: "eq", value: $('#AwardType').val() });

}

var grid = $("#Grid").data("kendoGrid");

grid.dataSource.filter($filter);

grid.dataSource.read();

}

Controller

public ActionResult ApplicationSearch_Read([DataSourceRequest]DataSourceRequest request)

{

var applications = context.Applications.Include("ApplicationDetails").OrderByDescending(p => p.SubmittedDate).ToList();

var data = applications.Select(x => new

{

ApplicationID = x.ApplicationID,

SubmittedDate = x.SubmittedDate,

FirstName = x.FirstName,

LastName = x.LastName,

StudentID = x.StudentID,

IsApplicationSubmitted = x.IsApplicationSubmitted,

Award = x.ApplicationDetails.Select(y => new {

AwardID = y.AwardDetail.AwardID,

AwardName = y.AwardDetail.Award.AwardName,

AwardTypeID = y.AwardDetail.Award.AwardTypeID

})

});

return Json(data.ToDataSourceResult(request));

}

Does anybody know how to properly do this?

Thanks,
Aaron

Grid

answered on 06 May 2013

5 answers

477 views

MVC - Server Paging and Aggregates

Hi, pretty simple question that I can't find any example of.

Is it possible to get aggregates for a DataGrid that also has an Ajax DataSource with Server Paging?

Grid

answered on 06 May 2013

1 answer

134 views

MVC Chart - multiple series different starts and endings

Hi,

I want to build a MVC chart with three diffirent line series with their own color and dashtype.
The values of the x-axis are dates with the baseunit weeks and the y-axis consists of double values.

Is it possible to start a second line series at the date where the first serie ends and have a third line at the same time? See the attached chart image.

Should I group data? Should each line have the same amount of items? Is this possible?

Could you give me any leads on this problem?
Thanks in advance

Charts

answered on 06 May 2013

1 answer

269 views

Add custom class to chart elements via template or?

Is there a way I can use the template configuration of chart elements like series, legend, etc, to add a custom class that I can style with my own css?

I can do regular css pathing , like

<style scoped>
div .chart svg g text:hover
{
cursor: pointer;
}
</style>

But I would love a simpler and more elegant solution of just adding and referencing my own specific classes.

Thanks

Charts

answered on 06 May 2013

6 answers

78 views

Recreating the Grid will not Group

All... I have to change the Grid Layout on an user selection. So the grid will have different column layout and different datasource set for each User selection..
So I did the obvious chose of a Kendo Newbe ... I destroyed the previously created Kendo grid, cleared the grid inner html and recreated the kendo grid using the new column values
Everything works fine.. but after the second selection (first selection is when the kendogrid is first created) ... the grouping wont work ..

any lime light on this issue is appriciated...
Here is the code snippit..

<div id="grid" style="height: 380px"></div>

Grid

answered on 06 May 2013

1 answer

514 views

How to make "open link in new window" option checked by default?

Hi,

How do you make the "open link in new window option" checked by default, or always checked?

This option is in the "insert hyperlink" dialog for the editor.

Thanks

Editor

answered on 06 May 2013

1 answer

294 views

Sum a column excluding certain rows

Is it possible to sum a column without including all rows in that column.

IE
a 2
b 3
c 2
d 8
sum = 12

but only sum up a+c+d

Grid

answered on 06 May 2013

2 answers

110 views

Binding practice

I'm not sure what is the best way for my scenario, so I'll explain that first.

I have two datasources. Persons and Groups, each Person-Item has an indicator, to which group it belongs to. The persons are binded to a kendo-grid and the groups to a <ul>. My problem is, that I want to display a count-number besides the group, which indicates how many persons are in that group - this information is calculated from the persons-datasource and not part of the group itself.

Sorry for that generic question - but I'm really struggling with this...

01.var contactGroupsDataSource = new kendo.data.DataSource({

02. transport: {

03. read: {

04. url: "api/contactgroups"

05. }

06. }

07.});

08.

09.$('#contactGroupsList').kendoListView({

10. dataSource: contactGroupsDataSource,

11. template: "<li class='contactGroupListItem' data-number='${Number}'>${Number} ${Name} (<span data-bind="text: cgcount[1]"></span>) </li>"

12.});

13.

14.viewModel = kendo.observable({

15. contactsDataSource: new kendo.data.DataSource({

16. transport: {

17. read: {

18. url: "api/contacts"

19. }

20. },

21. schema: {

22. model: {

23. id: "Id",

24. fields: {

25. id: { type: "string" },

26. FirstName: { type: "string" },

27. LastName: { type: "string" },

28. ContactGroupNumber: { type: "integer" }

29. }

30. }

31. },

32. change: function (e) {

33. var data = this.data();

34.

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

36. var cg = data[i]["ContactGroupNumber"];

37. viewModel.cgcount.splice([cg - 1], 1, viewModel.cgcount[cg - 1] + 1);

38. }

39.

40. for (var i = 0; i < 7; i++) {

41. console.log(i + 1 + ': ' + viewModel.cgcount[i]);

42. }

43. }

44. }),

45. cgcount: new kendo.data.ObservableArray([0, 0, 0, 0, 0, 0, 0])

46. });

47.

48. kendo.bind($("#contactsGroupContainer"), viewModel);

49.

50. contactsListView = $('#contactsList').kendoGrid({

51. dataSource: viewModel.contactsDataSource,

52. sortable: true,

53. rowTemplate: kendo.template($("#rowTemplate").html())

54. });

MVVM

answered on 05 May 2013

1 answer

66 views

MVVM biding for KendoSlider

I have a kendoObservable (numeric value) that is bound both to a span (text: ) and a kendo slider (value:)

I have a button that increments the value. But only the text version is updating. What did I do wrong?

An example is worth a thousand words:

http://jsbin.com/afogaq/2/

One wrinkle here is that i need to dynamically add the slider. So there is a button at the top that you have to hit first, to add the slider to the DOM. Then just press the [increment] button to see what is going on.

(do I have to rebind the VM, after adding the slider?).

MVVM

answered on 05 May 2013

1 answer

442 views

MultiSelect not posting objects correctly

I have an object:

public class User

{

public int Id { get; set; }

public string Name { get; set; }

}

And in the editor template, where model.Members are a collection of Users

@(Html.Kendo().MultiSelectFor(model => model.Members)

.DataValueField("Id")

.DataTextField("Name")

.Placeholder("Type user's name...")

.DataSource(source =>

{

source.Read(read =>

{

read.Action("MemberRead", "Group");

});

}))

When posting the form containing this multiselect I get the following post data

Id:0

Name:Test

Description:Test

Members.Id:1

Members.Name:Jan

Members:[object Object]

Now as far as I can tell the post data is correct, except for"Members:[object Object]" which Kendo throws an error for. When the model is received by the controller, the Members field is null.

What settings are incorrect?

(Note that MemberRead is populating the MultiSelect correctly)

(Also note that this form is part of a popup editor of a grid, in which everything else is working correctly)

MultiSelect

answered on 05 May 2013