Questions on Kendo UI for Angular Forum

1 answer

45 views

Hi

I'd like to fix an issue we have about the columns using dates, we have a dashboard and when user export the dash to Excel.

seems like there's no problem or something, however when we proceed to open the Excel file.

if we take a look to those columns displaying dates, then we select any of these cells, right click, "format cell"

Catogory is displayed as "General", instead of date and any of the possible types-formats

so when user is trying to apply filter in excel, values for date columns are not recognized as dates.

I have been trying to modify the date format like these

//attempt3

//pcagatecurrentdate requestHeaderView.pcagatecurrentdate ? new SimpleDateFormat("dd MMM yyyy HH:mm:ss zzz").format(requestHeaderView.pcagatecurrentdate) : null
//attempt4
//pcagatecurrentdate requestHeaderView.pcagatecurrentdate ? new SimpleDateFormat("MM-dd-yy HH:mm:ss zzz").format(requestHeaderView.pcagatecurrentdate) : null
//attempt5
//pcagatecurrentdate requestHeaderView.pcagatecurrentdate ? new SimpleDateFormat("MM-dd-yy 07:00:00").format(requestHeaderView.pcagatecurrentdate) : null
//attempt6
//pcagatecurrentdate requestHeaderView.pcagatecurrentdate ? new SimpleDateFormat("MM-dd-yy 19:00:00").format(requestHeaderView.pcagatecurrentdate) : null
//attempt7
//pcagatecurrentdate requestHeaderView.pcagatecurrentdate ? new SimpleDateFormat("MM-dd-yy'T'HH:mm:ss.SSSZ").format(requestHeaderView.pcagatecurrentdate) : null
//attempt8
//pcagatecurrentdate requestHeaderView.pcagatecurrentdate ? new SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSSZ").format(requestHeaderView.pcagatecurrentdate) : null
//attempt9
//pcagatecurrentdate requestHeaderView.pcagatecurrentdate ? new SimpleDateFormat("MM-dd-yyyy'T'HH:mm:ss.SSSZ").format(requestHeaderView.pcagatecurrentdate) : null

this is how it looks like in the front end,

<kendo-grid-column
    field="pcagatecurrentdate"
    [columnMenu]="true"
    title="{{ getTitle('pcagatecurrentdate') }}"
    tooltip=""
    [locked]="false"
    width="110"
>
    <ng-template
        kendoGridFilterMenuTemplate
        let-filter
        let-column="column"
        let-filterService="filterService"
    >
        <app-date-range-filter
            [field]="column.field"
            [filter]="filter"
            [filterService]="filterService"
        >
        </app-date-range-filter>
    </ng-template>
    <ng-template kendoGridCellTemplate let-dataItem>
                    <span
                        [ngClass]="{
                            okProjectStatus:
                                dataItem.projectConceptApprovedStatus ==
                                'ok',
                            warningProjectStatus:
                                dataItem.projectConceptApprovedStatus ==
                                'warning',
                            dangerProjectStatus:
                                dataItem.projectConceptApprovedStatus ==
                                'danger'
                        }"
                    >
                        {{
                        dataItem.pcagatecurrentdate != null
                            ? (dataItem.pcagatecurrentdate
                                | date : 'dd-MMM-yyyy')
                            : ''
                        }}
                    </span>
    </ng-template>
</kendo-grid-column>

but at the end all the dates still displayed as "General"

and this is the target I would like to reach

I appreciate any suggestions you may have

Thanks

Victor M.

Excel Export

Grid

answered on 15 Jan 2024

1 answer

152 views

How to use dropdown button for export to excel and pdf from grid?

Hello,

How can we use dropdown buttons to show export to excel and export to pdf options in grid's header? I'm not able to visualize how to use kendoGridExcelCommand and kendoGridPdfCommand in dropdown button.

updated answer on 17 Oct 2023

1 answer

299 views

How to get filtered Data into Excel with Java poi?

I have a kendo grid that contains data that comes from a DB call.
Currently the export excel button extracts all the data equal to the datasource.
It is mapped into java.
I would like that when compiling the filters of the kendo grid when I click on the button it extracts only the filtered data

 <kendo-grid
                            [data]="gridData"
                            [pageSize]="state.take"
                            [skip]="state.skip"
                            [sort]="state.sort"
                            [filter]="state.filter"
                            [sortable]="true"
                            [pageable]="true"
                            [filterable]="true"
                            [selectable]="true"
                            [style.minHeight.px]="minMaxHeight"
                            [style.maxHeight.px]="minMaxHeight"
                            (dataStateChange)="dataStateChange($event)">
                            <kendo-grid-column field="name" title="{{'name' | translate}}"></kendo-grid-column>
                            <kendo-grid-column field="month" title="{{'month' | translate}}"></kendo-grid-column>
</kendo-grid>

Excel Export

Filter

Grid

answered on 09 May 2023

0 answers

58 views

Export All or Export current page records to excel

Hello

I want to add a dropdown button with both options i.e. a) Export Current page, b) Export All pages

Is this possible , as I could see only the two excel buttons Export to Excel and Export to PDF to appear

Regards

Hay

Excel Export

Grid

asked on 28 Mar 2023

0 answers

48 views

kendo treelist excel arraylist, fild does not receive array?

I have the following situation, a component with treelist where the column receives an array by ngTemplate referencing the field.

 <kendo-treelist-column
    *ngIf="!isHidden('progress')"
    field="progress"
    title="Progress"
    [width]="320">
    <ng-template kendoTreeListCellTemplate let-dataItem let-group="cellContext">
      <app-okrprogress-bar
        [showButtonOk]="true"
        [value]="dataItem.progress.slice(-1)[0].value"
        [valuePercentagel]="dataItem.progress.slice(-1)[0].value"
        [showSlider]="!dataItem.contents ? true : false"
        [showValue]="dataItem.typeProgress == 'Values' ? true : false"
        [showChecbox]="dataItem.typeProgress == 'Boolean' ? true : false"
        [stepSlider]="dataItem.typeProgress"
        [viewValue]="dataItem?.values"
        (newPercentageActive)="
          changePercentage($event, group.viewItem.parent.data, dataItem)
        "></app-okrprogress-bar>
    </ng-template>
  </kendo-treelist-column>

Now I have to export this column in excel, but the field only waits for a simple variable or objects.

  <kendo-treelist-excel>
    <kendo-excelexport-column fild="keyName" title="Objective"></kendo-excelexport-column>
    <kendo-excelexport-column fild="progress.slice(-1)[0].value" title="Progress"></kendo-excelexport-column>
    <kendo-excelexport-column fild="status.status" title="Status"></kendo-excelexport-column>
  </kendo-treelist-excel>

I did some tests of different calling modes but none of the results were effective.

This is the interface:

interface ObjectiveResult {
  keyName: string;
  progress: Progress[];
  status?: Status;
}

interface Progress {
  value: number;
  date: Date;
}

interface Status {
  name: string;
  color: string;
}

Current results:

Excel Export

Grid

TreeList

asked on 12 Jan 2023

0 answers

41 views

Grid Can't Edit But Export Excel Enough Data

Hi,
I'm using kendo but have an issue as follows:

Case 1: The old source can be edited, but the excel is missing data
https://stackblitz.com/edit/angular-v6xzlw-cs7bsp?file=src%2Fapp%2Fapp.component.ts

Case 2: New source can't edit but export excel enough data
https://stackblitz.com/edit/angular-v6xzlw-fpo6xw?file=src%2Fapp%2Fapp.component.ts

Expect: Both can be edited and exported

Anyone who has encountered this case, please support me.

Thanks, all.

May be an image of text that says 'x Export Excel Name Name 1 Number AB 001255* AV= 66000000 Case2 Base Revenue 100001 Ratio Name3 100002 196507 90740000005 AB 10000000 Name Base Revenue 100003 0.27390444 Ratio Name 100004 180776.93040000004 BaseRevenue Base 191478.3618 Name6 0.15730977 100005 0.29011873 Name7 15730.977 191478 3618 100006 0.17790082 Name 100007 31639 31799999998 19999999 Name 100008 0.04793823 22.7336 Name 10 100009 31639.231799999998 0.00018596 245.4672 Name 11 100010 122.7336 0.000371 Name 12 4672 100011 135728. 67 Total 100012 0.2056495 135728.67 2593. 6086 0 0.00392971 2593.6086 6086'

May be an image of text that says '区 Exportto Excel Name Name Number AB 001255* Case1 AV= 66000000 Base Revenue 100001 Name Ratio 100002 196507 90740000005 AB 008001 10000000 Base Revenue Name4 100003 Ratio Name 180776 6.93040000004 100004 Base Revenue 191478.3618 3618 Name6 0.15730977 100005 0 0.29011873 117414.54119999999 15730. 977 Name7 100006 191478.3618 0.17790082 Name 100007 17414.54119999999 31799999998 Name 100008 0 0.04793823 22.7336 Name 10 100009 31639.231799999998 0.00018596 245.4672 Name 7336 100010 0.00037192 Name 12 100011 45.4672 135728. 67 Total 100012 0.2056495 135728. 2593. 6086 0.00392971 2593 6086'

asked on 28 Dec 2022

1 answer

59 views

Excel Export lacks data kendo grid column group

Hi,

I am facing a case like this:
Source: https://stackblitz.com/edit/angular-v6xzlw-vrqmxj
I am using kendo grid.
The data displayed on the grid is ok but when exporting excel, the data is missing.
I've been trying to find a way for a few days but still can't solve it.
Please support.

Thanks!

Excel Export

Grid

answered on 23 Dec 2022

1 answer

46 views

DataGrid - Export excel of a three layered master-detail

Hi,

I have the scenario where I have to implement a three-layered master-detail as shown in the snapshot.

Is there any possibility of exporting?

Thanks in advance.

answered on 07 Mar 2022

1 answer

46 views

Export chart into excel format, along with gird, export grid, chart into pdf both.

Hi Team,

i have required like Export chart into excel format, along with gird, export grid, chart into pdf both. is there any possbility using kendo-ui?

Charts

Excel Export

Grid

answered on 06 Jan 2022

0 answers

58 views

Is it possible to span a column for only 1 row?

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.