Telerik Forums
Kendo UI for Angular Forum
1 answer
6 views
  <kendo-window title="Select Item" [width]="800" [height]="500" *ngIf="opened" (close)="windowClose()">
        <kendo-grid
          kendoGridSelectBy="id"
          [kendoGridBinding]="KendoWindowData$ | async"
          [filterable]="true"
          [sortable]="true"
          [height]="400"
          [selectable]="selectableSettings"
          (selectionChange)="onSelectionChange($event, grid)"
          [(selectedKeys)]="mySelection">
          <ng-template kendoGridToolbarTemplate>
            <kendo-grid-checkbox-column [showSelectAll]="true" [width]="40"></kendo-grid-checkbox-column>
          </ng-template>
          <kendo-grid-column [width]="40"> </kendo-grid-column>
          <kendo-grid-column field="innerCode" title="შიდა კოდი" [width]="250" [filterable]="true"></kendo-grid-column>
          <kendo-grid-column field="name" title="სახელი" [width]="250" [filterable]="true"></kendo-grid-column>
          <kendo-grid-column field="barcode" title="Barcode" [width]="250" [filterable]="true"></kendo-grid-column>
        </kendo-grid>
        <button (click)="confirmSelection(grid)" kendoButton>Confirm Selection</button>
      </kendo-window> on here how to disable checked checkbox if it possible ?
Hetali
Telerik team
 answered on 11 Apr 2024
0 answers
5 views
I want to disable the row based on condition where one particular column/cell will be exempted, when I tried to use rowClass it disables whole row.
after disabling the row it should show text as already added to user

Update: Solved
Ghanavishmathi
Top achievements
Rank 1
Iron
 updated question on 03 Apr 2024
1 answer
40 views
I want to change the svg-icon of expand row  and change the order of that column in kendo grid 
Ghanavishmathi
Top achievements
Rank 1
Iron
 answered on 01 Apr 2024
1 answer
11 views
Hi Kendo,

We have a requirement where we need to lock a couple of starting columns and one ending column in a Kendo Angular Grid.

We have implemented the lock feature for starting columns, but it doesn’t work as expected for the last (ending) column in the grid.

We are aware that this can be achieved by applying the ‘Sticky’ feature. But the problem with ‘Sticky’ feature is the horizontal scroll runs to the end of the grid. Ideally, the scrollbar should stop at the start of the last column. (Sticky column)

Is there any workaround to make the last(right) column locked? Or stop the scrollbar at the start of the last column in a ‘Sticky’ behavior?

Appreciate your support on this.
Zornitsa
Telerik team
 answered on 29 Mar 2024
1 answer
11 views

Hi there,

Recently we started working on accessibility issues on angular 15 app  Currently we are using the below version for kendo grid.

"@progress/kendo-angular-grid": "^4.7.0",

 

And we are facing some issues from kendo grid and wanted to check if these get sorted out if the kendo grid version is updated to higher versions. And if so, please suggest the version no.. 
Please find the attached issues.

---------------------------------------------------------------------------------------------

----------------------------------------------------------------------------------------------------------


--------------------------------------------------------------------------------------------

 




----------------------------------------------------------------------------------------
Please check the issues and let us know how I can sort out my issues.

Martin
Telerik team
 answered on 29 Mar 2024
0 answers
15 views
I'm encountering an unexpected behavior with the Kendo Grid's sorting functionality in my application.

Here's the scenario:

    I perform inline row editing for a record in the Kendo Grid with pagination.
    Sorting the data by clicking a column header works as expected.
    However, if I sort the data again after editing a row, the current index seems accurate, but the data object retrieved appears to be incorrect.
mohit
Top achievements
Rank 1
 updated question on 26 Mar 2024
1 answer
21 views

Hi there,

We are using Angular and TailwindCss in our product and we want to use the Kendo Grid like below. Do you have any examples to style the grid like this? If not supported for tailwind, plain css is fine., 

Zornitsa
Telerik team
 answered on 25 Mar 2024
1 answer
19 views

Hello,

I'm working on adding functionality to save the grid column size settings when they resized using the columnResize event.

The issue I'm having right now is that I can't access the unique identifier I need (column field) in the ColumnResizeArgs / ColumnBase interfaces.
https://www.telerik.com/kendo-angular-ui/components/grid/api/ColumnResizeArgs/

I see that other libraries like React and jQuery are providing the column field property in their resize events - so I'm curious where the alternative is for Angular (if any).  I see the property is there while debugging the args but I can't see it exposed in the Kendo interface anywhere.

I do see the 'title' property, but this will not work in our application due to translation and other issues.

Any ideas or help would be appreciated.

Thank you!

Zornitsa
Telerik team
 answered on 22 Mar 2024
0 answers
11 views

Hi, 

I'm using kendo grid in angular. I'm trying to hide/remove the total cell from the kendo grid using *ngIf, but only content inside the cell is hiding, empty cell is showing.



How to hide the total cell from the grid,

This is the code , I have used

<kendo-grid id="antibiotic-result-view" [data]="uniqAntibioticList" [resizable]="false">
    <kendo-grid-column field="Expansion" [width]="150">
        <ng-template kendoGridHeaderTemplate let-column let-columnIndex="columnIndex">
            <div class="antibiotic-heading">{{"Antibiotic" | translate}}
                <mat-checkbox type="checkbox" [ngModel]="allCompleted" disabled="true"></mat-checkbox>
            </div>
        </ng-template>
        <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex">
            <div *ngIf="dataItem.IsSuppressed">
                <span>{{ dataItem.Expansion }}</span>
                <mat-checkbox type="checkbox" [ngModel]="dataItem.IsSuppressed" disabled="true"></mat-checkbox>
            </div>
        </ng-template>
    </kendo-grid-column>
</kendo-grid>

I have been trying for past 2 days, could someone help me on this ?

Kathiravan
Top achievements
Rank 1
 asked on 22 Mar 2024
0 answers
26 views
When I use the "locked" property on one of my grid columns, the half of the table is half blank.
I noticed that if my grid doesn't have this property, the "width" of each column behaves like "min-width", but when using "locked" in some of the columns, the "width" stays exactly with the exact value of the column instead of still function as "min-width" which causes half of the table to be blank.

To remove the blank half of my "grid" I need to pass a "width" value to the grid, but I believe this is not ideal, as I want my table to have 100% "width", in the example of "locked" documentation the grid is very small (https://www.telerik.com/kendo-angular-ui/components/grid/columns/locked/) so that it works without this problem of half being blank.
Is there a way to use the "locked" property so that half of my grid is not white? And that my grid has 100% "width"?
This problem with "locked" makes it unfeasible to use it in our project.


I left it on stackblitz as an example (To see the problem, use a large screen):

1 - the first Grid does not use "locked" so my columns adapt according to the space

2 - in the second Grid with a locked column, there is a blank space on the right side, and the columns become smaller (now respecting the width, instead of using it as "min-width")

link: stackblitz 

josé
Top achievements
Rank 1
 updated question on 19 Mar 2024
Top users last month
Dominik
Top achievements
Rank 1
Giuliano
Top achievements
Rank 1
Dominic
Top achievements
Rank 1
Glendys
Top achievements
Rank 1
NoobMaster
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?