Telerik Forums
Kendo UI for Angular Forum
1 answer
2.7K+ views

The MultiSelect component appears to have an invisible textbox section that is allowed for the user to type and search the list.  How can I disable this?  It is very confusing at times because my users want to click the dropdown to select an option but you get no response because your actually clicking inside the textbox portion.  So you have to move your mouse over a bit to leave the textbox then click to bring up your options.  I have tried setting the filterable option to false but no luck.

 

Alternate solution is how I can enable the dropdown options to appear even if I click inside this textbox?

Alexander Valchev
Telerik team
 answered on 08 Aug 2018
4 answers
896 views

Is it possible to format the horizontal axis labels in percentage format (see attached screenshot)?

in .html file:
<kendo-chart-series>
                    <kendo-chart-series-item [data]="chartManagementObj.growthrevpatienttypeData" type="bar"
                                 [labels]="seriesLabels"
                                 field="revenue" categoryField="patienttype">
                    </kendo-chart-series-item>
 
in .ts file:
public seriesLabels: SeriesLabels = {
        visible: true, padding: 3, format: 'p2',
        font: 'bold 12px Arial, sans-serif'
    }

 

Thanks!

 

Chau
Top achievements
Rank 1
 answered on 07 Aug 2018
4 answers
649 views

I have an editable grid based off this example. It works as expected, except that I need each row to have a detail row with a single text field in it, no columns. The EditTemplateDirective doesn't work outside of a kendo-grid-column. Is there another way to do this?

I would like to avoid creating a separate grid within my detail template if possible since this is a single form. 

Here is what I have for my detail template: 

<ng-template kendoGridDetailTemplate let-dataItem>
       {{dataItem.TSRs}}
     <ng-template kendoGridEditTemplate let-dataItem="dataItem" let-formGroup="formGroup">
         <input  kendoTextBox [value]="dataItem.TSRs" [formControl]="formGroup.get('TSRs')">
     </ng-template>
</ng-template>

 

Thanks!

Rebekah
Top achievements
Rank 1
 answered on 06 Aug 2018
3 answers
1.0K+ views
Kendo ui Grid inline edit field with editorTemplate how to get the template input updated on next row clicked angular2+
Svet
Telerik team
 answered on 03 Aug 2018
3 answers
430 views
I have attached my project in this. I don't know why but my sorting on multiple columns is not working. It takes sorting on only one column at once.

Along with this, I want to select a row by using Shift + Down shortcut. I tried but not able to select a row by using shift+Down. I have to
perform some further operations. but I am not able to do this. 

Kindly, help me with this.

Thanks
Svet
Telerik team
 answered on 02 Aug 2018
2 answers
97 views
Is there API documentation for KendoUI for Angular like that exists for Kendo UI for JQuery?  IE https://docs.telerik.com/kendo-ui/introduction -> API Reference
Dimiter Madjarov
Telerik team
 answered on 31 Jul 2018
7 answers
457 views

Hi,
In my scheduler I have a custom view and a custom group header template these are written outside the angular controller. But in order to do somethings with the obtained data I need to write these inside angularjs controller, whenever I try to do so an error shows up in console saying there is no such view  (if view is defined inside the controller) and scheduler is not shown when custom group header template (if group header is defined inside the controller).

Is there a way to bring both these inside angular controller?
Reference Example

Neli
Telerik team
 answered on 31 Jul 2018
1 answer
193 views

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. 

Dimiter Topalov
Telerik team
 answered on 30 Jul 2018
3 answers
965 views

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>
Alexander Valchev
Telerik team
 answered on 30 Jul 2018
5 answers
1.4K+ views

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!

 

Chau
Top achievements
Rank 1
 answered on 27 Jul 2018
Narrow your results
Selected tags
Tags
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?