Telerik Forums
Kendo UI for Angular Forum
0 answers
85 views

How can I change the sort field name in the dataStateChange event of the grid, to another fields name, and sort by that fields name?

for example, in my component the event handler:


public dataStateChange(state: AppDataStateChangeEvent): void {
  if(state.sort[0].field === 'propertyStringValue'){
    state.sort[0].field = 'propertyNumberValue';
  }
  this.view = process(this.data, this.gridState);
}


I need this because we have two seperate properties on our data objects, one is "propertyStringValue" to display a formated version, and an actual number associated with it called "propertyNumberValue". And we want to sort by "propertyNumberValue" when the sort of the "propertyStringValue" is clicked.

When I do the above, it works only on first click, but in the following clicks the state of the dir property on the sort event object does not change, and stays at the value of "asc"

Tomas
Top achievements
Rank 1
 asked on 28 Mar 2023
0 answers
144 views

Hi,

I'm having a problem with kendo editor two-way binding that isn't functioning. I tried valueChange event as well, but the problem persists. I'm using Angular -6.02 and kendo editor-0.8.0

Sreereng
Top achievements
Rank 1
 asked on 27 Mar 2023
0 answers
175 views

Hi all,

is there a way to mark items of a DropDownTree component as non-selectable without disableing it completely?
If not, is this feature on your roadmap?

This could make a lot of sense on parent items in a tree.

Best regards,

Christian

Christian
Top achievements
Rank 1
 asked on 27 Mar 2023
0 answers
127 views

Hello our company is considering using Telerik Angular UI and we have questions regarding creating and installing a custom theme.

Here are the steps we took so far: 

1) progress theme builder for angular material created a project named test-custom-theme. 

2) changed primary color and secondary to our company colors and background to a dark gray just to see that the theme is working. These are extremely simple changes our artists will do much more once we prove out the concept. 

3) exported test-custom-theme from theme builder into a zip. 

4) created a new angular project called telerik-test-app using the angular cli, installed the telerik license and activated.

5) started to follow the readme with the custom theme zip this is where things started to not work.

After generating the theme builder zip I preformed the following steps.

1) The readme says extract the custom theme folder to your application and use it as a standard npm package.

2) Changed dir to telerik-custom-theme and ran npm install

3) added the dependencies to my project's root package.json "telerik-custom-theme": "file:./telerik-custom-theme"

4) navigated to the root of my project and ran npm install. Received the following errors:

PS D:\src\Development\angular\telerik-test-app> npm install
npm ERR! code EISDIR
npm ERR! syscall symlink
npm ERR! path D:\src\Development\angular\telerik-test-app\telerik-custom-theme
npm ERR! dest D:\src\Development\angular\telerik-test-app\node_modules\telerik-custom-theme
npm ERR! errno -4068
npm ERR! EISDIR: illegal operation on a directory, symlink 'D:\src\Development\angular\telerik-test-app\telerik-custom-theme' -> 'D:\src\Development\angular\telerik-test-app\node_modules\telerik-custom-theme'

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\nfisher\AppData\Local\npm-cache\_logs\2023-03-25T15_37_51_187Z-debug.log

These instructions seem simple but for some reason we are missing something can anyone help? 

 

Nathan
Top achievements
Rank 1
 asked on 25 Mar 2023
1 answer
110 views

I currently have a grid with an in-cell drop down for a customer. I saw that there is set navigation control, but can you customized it.  

What I was looking for is when a user goes to edit a customer, then click the down arrow, which will commit the current customer --> go to the next record --> open up the drop down for the customer

thanks in advance

Martin Bechev
Telerik team
 answered on 24 Mar 2023
0 answers
107 views

Hello, i am using a kendoMap component in an angular project and i need to use custom shape per marker type.

with the current version this is not possible, how can I do it?

Nabil
Top achievements
Rank 1
 asked on 23 Mar 2023
0 answers
116 views

Hi all.

I am currently trying to implement multi-selection within the grid.
When I check one of the checkboxes, it automatically selects all the items(checkboxes) in the grid (which it shouldn't).
I have closely followed the documentation but can't seem to figure it out.

Here is some of the code snippets:

<kendo-grid
  class="data-grid-kendo"
  [data]="gridData | async"
  kendoGridSelectBy="id"
  [(selectedKeys)]="mySelection"
  (selectedKeysChange)="keyChange($event)"
  [pageable]="true"
  [pageSize]="state.take"
  [skip]="state.skip"
  [sortable]="true"
  [selectable]="true"
  [groupable]="false"
  [reorderable]="true"
  [resizable]="false"
  (dataStateChange)="onStateChange($event)"
>
  <kendo-grid-checkbox-column
    class="grid-cell-style-select"
    [headerClass]="'grid-column-header'"
    [width]="45"
    [resizable]="false"
    [columnMenu]="false"
    [showSelectAll]="true"
  >
  </kendo-grid-checkbox-column>

 

 

Any help would be greatly appreciated .

Hanno
Top achievements
Rank 1
 asked on 23 Mar 2023
1 answer
471 views

if I have content like this...

<div>
  {{content}}
</div>
<div kendoWindowContainer></div>

if the content on the page is large enough, then when I create the window with the angular service, it makes the page scroll down to the bottom where the windowContainer div is located.  Even though the service is explicitly setting the window position to be at the top of the page.

 

So effectively, when the user clicks the button to trigger showing the window, suddenly the page scrolls to the bottom and they can no longer see the section of the content they were looking at NOR the window since it has scrolled up as well.

How do I prevent the page from scrolling to where the container is located when I'm opening a window with the angular service?

Georgi
Telerik team
 answered on 22 Mar 2023
1 answer
110 views

Hello,

I ran into an issue using the multicolumncombobox. I want to fill this dropdown with data rertrieved from my Rest API Java backend. Although the data shows up, I get an error in my console looking like this:

core.mjs:8453 ERROR Error: Provided data must consist only of objects. See https://www.telerik.com/kendo-angular-ui/components/dropdowns/multicolumncombobox/data-binding/
    at MultiColumnComboBoxComponent.verifySettings (progress-kendo-angular-dropdowns.mjs:9690:19)
    at MultiColumnComboBoxComponent.ngAfterContentChecked (progress-kendo-angular-dropdowns.mjs:4400:14)

...

Here's my template code:


<kendo-multicolumncombobox
      #list
      [data]="list"
      [listHeight]="300"
      textField="name"
      valueField="customerid"
    >
    
    <kendo-combobox-column field="name" title="name" [width]="200">
    </kendo-combobox-column>
    <kendo-combobox-column field="customerid" title="ID" [width]="200">
    </kendo-combobox-column>

My component:

list: Customer[]=[];
...
constructor(private api:CustomerService){
      this.api.getAllCustomer(this.params).subscribe((resp) => {
        this.list = resp;
        tap(()=>this.loading = false)
      });
    }

CustomerService:

 public getAllCustomer(params: any): Observable<Customer[]> {
   params.pldId='23';
    return this.api.getAllCustomer(params);
  }

The backend an retrieving the data from the backend works fine. However, the multicolumncombobox doen't really like my Array.

If I replace the list with the data from the example, it does work without an error (thats the prodictsliste from https://www.telerik.com/kendo-angular-ui/components/dropdowns/multicolumncombobox/). MAybe noteworthy, that my backend produces response of "application/son".

Any help is greatly appreciated!

Cheers,

Joerg

 

 

 

 

Jörg
Top achievements
Rank 1
Iron
 answered on 22 Mar 2023
1 answer
241 views

Hi, 

I am trying to use toggleable button in my angular app to allow user to display some data automatically (or not).

My first question is, if user sets that he wants it, I save this in my database, and next time when user returns, I want to set the state of the button to be toggled. However, I can't find any property or anything to do this.

Is it possible at all and how if it is? :)

Second thing that I noticed is that, when I toggle button, it gets its style correctly, but when I click further, it reverts to its visual as if it wasn't toggled. This is my button setup..and I use the button as part of kendo ui angular app bar.

<button kendoButton [toggleable]="true" (selectedChange)="showAutoInfo($event)" fillMode="clear" rounded="full"
size="small">
<kendo-icon name="info"></kendo-icon>
</button>

 

Thank you.

Regards,

Vedad


Yanmario
Telerik team
 answered on 21 Mar 2023
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?