Hi, i need to achieve map chart in Kendo angular. Please find attached for sample.

While hovering on each countries should display tool tip with data.

Each countries colored with specific colors based on data.

We are making a Grid which is: Sortable, Selectable, Filterable, and Column selector, etc.

What is the property in API for Kendo Angular Grid which does this?

We are trying to store this filtered/sorted grid data into a variable, different  from the Original Grid data.

How can this be done?

Currently looking through resource;

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


    <kendo-grid 
      [data]="documentPropertyGridData" 
      [resizable]="true" 
      [reorderable]="true" 
      [sortable]="true"
      >

      

      <kendo-grid-checkbox-column title="Select" [width]="10" [columnMenu]="false" [showSelectAll]="true">
      </kendo-grid-checkbox-column>
      <kendo-grid-column field="apn" title="APN" [width]="40">
        <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex">
          <div>{{dataItem?.apn}}</div>
        </ng-template>
      </kendo-grid-column>
      <kendo-grid-column field="propertyDescription" title="Property Description" [width]="70">
        <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex">
          <div>{{dataItem?.propertyDescription}}</div>
        </ng-template>
      </kendo-grid-column>
      <kendo-grid-column field="situsAddress" title="Situs Address" [width]="40">
        <ng-template kendoGridCellTemplate let-dataItem let-rowIndex="rowIndex">
          <div>{{dataItem?.situsAddress}}</div>
        </ng-template>
      </kendo-grid-column>
    </kendo-grid>


https://docs.telerik.com/kendo-ui/api/javascript/ui/grid

I have an input to search nodes in an angular treeview and I want the tree to autoscroll to the located node.I saw workarounds for jquery but not for angular one.

Hey there!

In our current project we have added a column with action buttons such as edit, delete, etc. This is always the last column of the grid and in some cases, based on the other columns width, it could be non visible. Users have to scroll horizontally to display the column and use its actions.

We have investigated the locked columns feature of the grid but it seems to be locking them only on the left side.

Is there any way to achieve that?

Thanks!

Hi Team,

 

I am facing the issue with DatePicker when we select the Date it will not effect till any other event is not done so in that case in our application user change the Date & click the save button but the date will not change in the post request so after the save user will again see the previous date only.

I have tried with on change event try to move the focus but focus is changed but till date is not changed. Please suggest 

Can someone provide me some sample code:

1) to reset grid filters programmatically?

2) to show the 'clear filter' icon when filter criteria is 'Is Null' or 'Is Empty'?  (the 'clear filter' icon currently is only visible when there is text entered in the filter input criteria).

Thanks!

 

I want to be able to comma separate the rows returned value in the kendo pager component so they are more easy to read. As far as I can see it isn't possible to supply a format to the <kendo-pager-info> component. Is it possible to do this?  If so how?

 

Thanks

 

 

     We are dealing with grid resize column,

Is there a way to set maximum width? and also is there a way to resize just 1 column only affecting neighboring column (horizontal scroll disabled)

 

Also I would like to customize reordering animation.

Hello , I have issue about one grid with filters sets. Filters works perfect, but not shows clear filter button which is on example you have.

<kendo-grid [data]="gridData" [height]="950" [pageSize]="gridState.take" [skip]="gridState.skip"
                        [sort]="gridState.sort" [pageable]="true" [sortable]="true"
                        (dataStateChange)="dataStateChange($event)" (edit)="editHandler($event)"
                        (remove)="removeHandler($event)" (add)="addHandler($event)" [filterable]="true">
                        <ng-template kendoGridToolbarTemplate>
                            <button kendoGridAddCommand>+ Add Exception</button>
                        </ng-template>
                        <kendo-grid-column field="PROJECT_ID" title="Project Id" width="200" [filterable]="false">
                        </kendo-grid-column>
                        <kendo-grid-column field="TRANCHE_NBR" title="Tranche Nbr" width="150" [filterable]="false">
                        </kendo-grid-column>
                        <kendo-grid-column field="OBLIGATION_NBR" title="Obligaton Nbr" width="200" filter="numeric">
                        </kendo-grid-column>
                        <kendo-grid-column field="FIXING_GAP" title="FX GAP" width="100" [filterable]="false">
                        </kendo-grid-column>
                        <kendo-grid-column field="SUMMIT_CALENDAR" title="Summit Calendar" width="250"
                            [filterable]="false">
                        </kendo-grid-column>
                        <kendo-grid-command-column title="command" width="220">
                            <ng-template kendoGridCellTemplate>
                                <button kendoGridEditCommand [primary]="true">Edit</button>
                                <button kendoGridRemoveCommand>Delete</button>
                            </ng-template>
                        </kendo-grid-command-column>
                    </kendo-grid>

 

public filter: CompositeFilterDescriptor;
  public gridState: State = {
    sort: [],
    skip: 0,
    take: 20,
    // Initial filter descriptor
    filter: {
      logic: 'and',
      filters: []
    }
  }
  userInfo: any;
  public gridData: GridDataResult;

 

public ngOnInit(): void {
    this.storeData = [];
    this.items = [];
    this.userInfo = this.securityService.getFromLocal('user');
    this.userId = this.userInfo.Email.split('@')[0];
    if (this.userInfo != null && this.userInfo.isValidUser) {
      this.loadGrid();
    }
    this.showpage = true;
  }

  loadGrid() {
    this.loan_service.GetAllLoans().subscribe(x => {
      this.gridData = process(x, this.gridState);
    });
  }
  public dataStateChange(state: DataStateChangeEvent): void {
    debugger;
    this.gridState = state;
    this.loan_service.GetAllLoans().subscribe(x => {
      this.gridData = process(x, this.gridState);
    });
  }

 

 

Please advice 

Thank you 

 

also

Is there another way to hide or remove them?

2: When you select the category filter and have all the categories, when you check the category (ex: check beverages then click filter it filters beverages), is there a way when I click beverages checkbox that it filters beverages at that point instead of selecting beverages then click filter? Also when you deselect the the check box I want it to act as if you clicked clear filter?

Thanks!