I have grid in angular and two buttons ones bind 5 column the other bind 2 but when i click them grid always shows 5 column.... How to fix this without using js? Is there any refresh() or rebind() function or directive?

<button (click)="changeDataSource(1)">Data1</button>  <button (click)="changeDataSource(2)">Data2</button>

<kendo-grid [data]="gridData | async" k-grid-options="sa">
</kendo-grid>

  public gridData: Observable<any[]>;


  constructor(private productService: ProductService) { }

  ngOnInit(): void {
    this.gridData = this.productService.getProducts();

  }

  changeDataSource(id: number) {
    console.log(id);
    if (id == 1) { this.gridData =this.productService.getProducts();}
    if (id == 2) { this.gridData =this.productService.getProductsAlternative() }

    
  }

getProducts(): Observable<Products[]>{ //Returns ProductID,ProductName,CategoryName,UnitPrice,UnitsInStock
    return this.http.get<Products[]>(this.url)
  }

  getProductsAlternative(): Observable<ProductAlternative[]>{ //Returns ProductName,CategoryName
    return this.http.get<ProductAlternative[]>(this.url1)
  }

In the following snippet, for a single column, I am allowing only 1 filter criteria by setting [extra] to false.  My goal is to restring the filter to only allow 1 criteria.  Is it possible apply this for all columns in the grid without performing this action for each column?

<kendo-grid-column field="myDate" title="Title">
    <ng-template kendoGridFilterMenuTemplate
        let-filter let-column="column" let-filterService="filterService"> 

        <kendo-grid-date-filter-menu
          [column]="column" [filter]="filter" [filterService]="filterService"
          [extra]="false"
          operator="eq"
        >
        </kendo-grid-date-filter-menu>

    </ng-template>
</kendo-grid-column>

How do I style Ordered and Unordered List bullets or numbers? I can't change a bullet or number colour using Toolbar buttons.

Hi,

Is there any possible way to implement more(...)  option in week view when there are more than 2 events in same time slot(similar to month view).

Please find the attached image for reference.

Regards,

Shabana

Hi

In my use case, I'd like to have two drawers in one drawer-container, one left, one right, with different "mode". If the left one has push mode, and the right has overlay, then the right drawer doesn't work well.

This may be a feature request more than a bug report. Is there currently any solution for this use case? Has this kind of feature been considered for the roadmap?

Thanks

Xuesong

Hi,

I am grabbing my data with the grid built-in directive and all filters work fine except for the date filter.

My grid template looks something like this:

<kendo-grid
[kendoGridBinding]="data | async"
[height]="800"
[pageSize]="15"
[sortable]="true"
[pageable]="true"
[filterable]="true"
[scrollable]="true"
[resizable]="true"
>
<kendo-grid-column [hidden]="true" field="ID" title="ID" [width]="10"></kendo-grid-column>

<kendo-grid-column field="SCHEDULED_DATE" title="Scheduled Date" [width]="120" filter="date" format="{0:d}"
[headerStyle]="{'line-height': '1.5em', 'font-size':'13px', 'text-overflow': 'clip', 'overflow': 'visible',
'white-space': 'normal', 'line-height': 'normal', 'text-align': 'center'}">
</kendo-grid-column>

My returned data is in json and the query to get looks like this:

select id, to_char(sched_dt,'MM/DD/YYYY') as scheduled_date from tasks_table;

How can I make it to work?

Thanks,

Carla

Hi, 

On my Angular 12 app, I am trying to use same node template approach for my treeView as suggested on documentation here:

https://www.telerik.com/kendo-angular-ui/components/treeview/node-template/

When I run my app, tree view looks like on image, whole layout is broken.

There is no specific css applied to the treeView or on its container that may affect view. 

If I remove k-icon, layout is fine, but then icon is not shown (just empty square). - see image 2.

Only change i made comparing to this example is to pass full object and to use object property to determine icon type.

So this is how my iconClass function looks:

  public iconClass(item: any): any {
      return {
        'k-i-file-pdf': is(item.type, '29'),
        'k-i-folder': item.items !== undefined,
        'k-i-html': is(item.type, '21'),
        'k-i-image': is(item.type, '17'),
        'k-icon': true,
      };
  }

Result is on attached image.. completely nonsense.

I am using kendo material theme.

any suggestion would be appreciated.

Thank you.

Hi Everyone!

 We have a requirement. For instance if more than one scheduled event(s) bound to a specific day falling between any timing (ex: 8:00 am to 9.00 am - 3 events for date Dec 1) in week view, It's just showing all the events in box with text not visible clearly. Event Title is visible completely only if particular timing has single event (only one scheduled event). Instead of this is there any option to show top one event completely visible in the box and loading all events for that specific timing by listing those in day view after pressing  (...)  more option button. So we are expected week view event listing has to be similar to month view available in kendo scheduler.

I wanted to span a column for a single row (the last row) and have it be sticky. Basically if I have a table with 5 columns and 5 rows, I want to have the 5th row span the full length of the 5 columns. I've looked at kendo-grid-span-column but I don't see a way to specify a row of data. I've also looked into using kendoGridFooterTemplate but it doesn't seem like there is support for spanning that quite yet.