Questions on Kendo UI for Angular Forum

1 answer

211 views

Workaround for using virtual scrolling, grouping and remote data in a grid.

I know the documentation specifically says the kendoGridGroupBinding only works with in memory data, but is there a way around this possibly? My data is grouped by date and the idea is to allow the user to scroll back in time to any date within the last year or so. Using paging would impact the UX a great deal in this situation. I'm mostly looking for ideas, or insights from anyone who has attempted something similar.

Thanks in advance.

General Discussions

answered on 30 Jul 2018

3 answers

990 views

How to mimic bootstrap dropdown with kendo dropdown?

Something like this. Can I combine a kendo button and dropdown, or can I do this with a combination of bootstrap and a kendo dropdownlist?

<div class="dropdown">

<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">Dropdown Example

<span class="caret"></span></button>

<ul class="dropdown-menu">

<li><a href="#">HTML</a></li>

<li><a href="#">CSS</a></li>

<li><a href="#">JavaScript</a></li>

</ul>

</div>

General Discussions

answered on 30 Jul 2018

5 answers

1.5K+ views

how to use Custom Data-binding directive with grouping

I have implemented a grid with remote binding directive subscribing to a service to get data from server, and it is working great with the grid having sort, filter properties defined.

Now, I need to work on another grid which has a group defined, and I keep getting the error of 'Cannot convert undefined or null' at the line where translateDataSourceResultGroups is called.

@Injectable()

export class CodeSelectionsServiceClient extends BehaviorSubject<GridDataResult> {

public isLoading = true;

private BASE_URL = "api/BaseConfig/Get?type=codeselections_get&id=";

constructor(private http: HttpClient) { super(null); }

public query(state: any, config_id: any): void {

//alert('timestart:' + new Date());

var url = this.BASE_URL + config_id + "&override_combo=dep_0004&override_level=dep";

this.fetch(state, url)

.subscribe(data => {

super.next(data);

this.isLoading = false;

} );

}

public fetch(state: any, url: string): Observable<GridDataResult> {

const queryStr = `${toODataString(state)}`;

const hasGroups = state.group && state.group.length;

return this.http

.get(`${url}&${queryStr}`) // Send the state to the server

.pipe(

map(<CodeSelectionsGridDataResult>({ value, datacount }) => {

console.log(value);

return (<GridDataResult>{

data: hasGroups ? translateDataSourceResultGroups(value) : value,

total: parseInt(datacount, 10)

})

}));

}

//class defined on server

public class CodeSelectionsGridDataResult

{

public int datacount { get; set; }

public List<CodeSelection> value { get; set; }

}

If I don't send in the state.group info, then the fetch method does not call translateDataSourceResultGroups and the grid is binding OK with the list<CodeSelection> returned.

This is how my grid state is defined when I pass in the group info:

public state: DataStateChangeEvent = {

skip: 0,

take: 50, //controls grid paging settings

filter: {

logic: 'and',

filters: [{ field: 'isSelected', operator: 'eq', value: true }]

},

//group: [],

group: [{ field: 'CodeId' }],

sort: []

}

Could you tell me what I may have missed here?

I'm attaching the error displayed in debug mode on Chrome. The data returned (for testing) is a list of only one record as highlighted on the screenshot.

Thanks!

General Discussions

answered on 27 Jul 2018

1 answer

1.4K+ views

pdf export and unicode

I have a quick question regarding the pdf export. So far it's working fine and my reports are, for the most part, outputting as expected.

The one caveat is that I've needed to use mm³ for some of our displayed values and instead the pdf is receiving mm‡. I've tried both "\u00b3" and "\xb3" and find myself getting the same interpolation of character values.

Is this a known issue with the pdf export and, if not, do you have any suggestions on what I might need to do in order to safeguard translation from print to report?

General Discussions

answered on 26 Jul 2018

1 answer

157 views

Angular2- Total in Footer on GroupBy using Lazy loading.

I am using Angular2+ with kendo grid. I want to implement a footer and display the total in the footer. When user group by column, the footer with total should display in the footer of the group by. I referred below-given link for this;

https://www.telerik.com/kendo-angular-ui/components/grid/grouping/grouping/

But, this is not exactly suitable to work with lazy loading, as I have used [scrollable]="'virtual'" for lazy loading.
My user can do the group by himself on any column. So, please give me demo with the dynamic group by, if possible.

General Discussions

answered on 25 Jul 2018

7 answers

149 views

[Solved] Combo filter

Combo filter operator is “start with” but I need it as a contains
e.g.: if I write hockey in the below example the combo will not select any value
https://plnkr.co/edit/?p=preview

I know there’s a filter option and a filterChange event but I want the combo behavior to be as it is now ( to see all the items and position to the selected data )

General Discussions

answered on 25 Jul 2018

1 answer

750 views

To disable popup in the multiselect component

I am not able to remove the drop down from the multi select component. Is there any other way I can achieve its functionality.

General Discussions

answered on 24 Jul 2018

1 answer

2.0K+ views

[Solved] Styling titlebar of kendo-dialog dynamically

Hi, I have the following question about styling the titlebar of the kendo-dialog (stackoverflow link):

https://stackoverflow.com/questions/51306813/how-to-css-style-kendoui-dialog-titlebar-in-2-different-ways-when-opening-from-t

Thank you very much for your time.

General Discussions

answered on 24 Jul 2018

1 answer

273 views

Testing grid grouping selnium

Hi there

We're using selenium to generate our end to end tests. We are struggling to automate the drag and drop support for column grouping. Do you have any guidelines on how to test this functionality?

Thanks

General Discussions