Telerik Forums
Kendo UI for Angular Forum
0 answers
87 views

Hello

starting with

<ng-content>
</ng-content>
<ng-template #TodayTranslation>
    <kendo-datepicker-messages today="HOY"></kendo-datepicker-messages>

</ng-template>

 

I am having trouble dynamically loading kendo-datepicker-messages onto a projected kendo-datepicker. My current approach is to 

get a references to the ng-content and ng-template that will hold the kendo-datepicker like 

@ContentChild(DatePickerComponent, { static:true })  kendoDatePickerDatePickerComponent;

@ViewChild('TodayTranslation', { static: true })
  todayTranslationRefTemplateRef<DatePickerCustomMessagesComponent>;

then in AfterContentInit I can create the embeded view and insert it.

 const emb = this.kendoDatePicker.container.createEmbeddedView(this.todayTranslationRef);
 

this.kendoDatePicker.container.insert(emb);

However, the result is a

<kendo-datepicker _ngcontent-qsx-c74="" id="FromCreatedDate-input-to-date"
    class="k-widget k-datepicker ng-untouched ng-pristine ng-valid">
    <!--bindings={
  "ng-reflect-today": "Today",
  "ng-reflect-toggle": "Toggle calendar",
  "ng-reflect-prev-button-title": "Navigate to previous view",
  "ng-reflect-next-button-title": "Navigate to next view"
}--><span class="k-picker-wrap">
        <kendo-dateinput ng-reflect-focusable-id="k-c32845aa-a2d8-4f7c-a99f-96f6" ng-reflect-disabled="false"
            ng-reflect-readonly="false" ng-reflect-title="" ng-reflect-tabindex="0" ng-reflect-role="spinbutton"
            ng-reflect-aria-read-only="false" ng-reflect-format="MM-dd-yyyy" ng-reflect-placeholder=""
            ng-reflect-max="Thu Dec 31 2099 00:00:00 GMT-0" ng-reflect-min="Mon Jan 01 1900 00:00:00 GMT-0"
            ng-reflect-incomplete-date-validation="false" ng-reflect-two-digit-year-max="68"
            ng-reflect-is-popup-open="false" ng-reflect-has-popup="true" class="k-widget k-dateinput">
            <!--bindings={
  "ng-reflect-decrement": "Decrease value",
  "ng-reflect-increment": "Increase value"
}--><span class="k-dateinput-wrap"><input autocapitalize="off" autocomplete="off" autocorrect="off" class="k-input"
                    spellcheck="false" placeholder="" ng-reflect-events="[object Object]"
                    ng-reflect-scope="[object Object]" role="spinbutton" aria-readonly="false"
                    id="k-c32845aa-a2d8-4f7c-a99f-96f6afc7d229" title="" tabindex="0" aria-expanded="false"
                    aria-haspopup="true">
                <!--bindings={
  "ng-reflect-ng-if": "false"
}-->
            </span>
        </kendo-dateinput><span class="k-select" role="button" ng-reflect-events="[object Object]"
            ng-reflect-scope="[object Object]" title="Toggle calendar" aria-label="Toggle calendar"><span
                class="k-icon k-i-calendar"></span></span>
    </span>
    <!---->
    <kendo-datepicker-messages _ngcontent-qsx-c79="" ng-reflect-today="HOY" class="ng-star-inserted">
    </kendo-datepicker-messages>
    <!---->

</kendo-datepicker>

Although there is no errors the 'Today' word in the calendar of the kendo-datepicker does not translate to 'HOY'

Is there a better way to dynamically load kendo-datepicker-messages into a projected kendo-datepicker?

victor
Top achievements
Rank 1
 updated question on 10 Nov 2021
1 answer
167 views

Hello. In chart series item tooltip. I had create Scatter chart. When I hover on point I can show tooltip only with xField, yField with format property or from tooltip template with let-value. But I have big array with other fields. which I would like to show. Also I would like to have index or let-index in tooltip template. 

Thank you.

Yanmario
Telerik team
 answered on 10 Nov 2021
1 answer
209 views

Hi,

Is it possible to add a row at a specified index in the grid?

https://www.telerik.com/kendo-angular-ui/components/grid/editing/editing-template-forms/#toc-adding-records

In the documentation, the add row only inserts a row at the top of the grid.

I would like to achieve something similar:

If I click on the custom add button the new row editor appears at a predefined index in the grid.

Thanks,

Balazs

 

Yanmario
Telerik team
 answered on 10 Nov 2021
1 answer
371 views

HI, I try to add Kendo Angular on my Angular13 project. 

last time I do that was in a erlier version of Kendo, but now everyting is different.

On my home page I just add some Kendo test component Button, ComboBox, DropDown.

First I add dependency manually


npm install --save @progress/kendo-angular-dropdowns @progress/kendo-angular-l10n @progress/kendo-angular-popup @progress/kendo-angular-treeview @progress/kendo-angular-inputs @progress/kendo-angular-intl @progress/kendo-drawing @progress/kendo-angular-common @progress/kendo-licensing

then I add the  default theme


# Default theme
npm install --save @progress/kendo-theme-default

 then I add my licence and activated it


npx kendo-ui-license activate

Now In my home module I add these import:


import { ButtonsModule } from '@progress/kendo-angular-buttons';
import { DropDownsModule } from '@progress/kendo-angular-dropdowns';

then Add the componement


<button kendoButton>Browse</button>
               
<div class="example-wrapper">
     <p>T-shirt size:</p>
     <kendo-dropdownlist [data]="listItems"> </kendo-dropdownlist>
     <p>Test</p>
     <kendo-combobox [data]="listItems" [allowCustom]="allowCustom"></kendo-combobox>
</div>       

No errors, but something is missing the component do not draw itself correctly. 

For example, the drop-down list appears on the upper left screen and all visual aspect are missing. (no border, no arrow, etc.)

We use actively Tailwind in this application. CSS conflict from Kendo Vs Tailwind?

Any idea?

Pierre
Top achievements
Rank 2
Iron
Iron
 answered on 09 Nov 2021
1 answer
162 views
Is it possible to drag and drop a DIV into Kendo Editor for Angular2 and not just an image ?
Martin Bechev
Telerik team
 answered on 08 Nov 2021
1 answer
156 views

Hi

 

Sample not running

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

<kendo-numerictextbox formControlName="UnitsInStock" #UnitsInStock required [format]="n0"> </kendo-numerictextbox> Property 'n0' does not exist on type 'GridEditFormComponent

//private closeForm(): void {
 closeForm(): voi

Regards

Martin Bechev
Telerik team
 answered on 08 Nov 2021
2 answers
753 views

Using a Kendo grid that is in edit mode, how do you reactively compute the value of column B based on what is typed in column A?

E.g.   column B = column A x 2

I enter 1 in column A; column B immediately changes to 2.

I enter 16 in column A; column B immediately changes to 32.

Silviya
Telerik team
 answered on 05 Nov 2021
1 answer
105 views
I have an application with multiple tabs on it. Since upgrading progress packages as well as Angular 12, the tabs display on a higher zindex as the application causing the tabs to bleed into dialog boxes that are shown. Is this a bug?
Ivo
Telerik team
 answered on 05 Nov 2021
1 answer
935 views

We have a client for whom we've created some quotes via tables, repeating headers, the Telerik page numbering, etc., and they've mentioned that they'd like to have the option to be able to print these directly. I notice that most approaches to grabbing and printing HTML recommended online tend to miss a lot of the objects that we have in these reports (one example would be that some of these have child html components or sub-reports) and sizing tends to be an option.

Being that the Kendo tools are already doing their own compiling of the screen is there a way that I could save the captured canvas as a variable and have it print the rendered canvas instead?

 

One other question as well - they've noted that they don't like a continuous white space for reports (without visual page breaks) and would like to see the pages broken out along with page numbers in the preview. I get the impression that I might be able to wrap certain sections in the #fff page coloring and use a darker background color although three things I don't know are 1) how I'd wrap the automatic page breaks, 2) How I'd get the page numbers to show up in such a preview, and 3) how to prevent the program from printing the darker background space and only having it print the #fff white space. It sounds like I may need to place the report space tag in a table with a *ngFor loop and let each part of the report be an iteration of the table just that, again, I'm not sure whether this is something that the Draw or PDF Export tools have any tools to support this type of effort.

 

Let me know your thoughts on these two items and whether either or both can be worked out with the current Kendo modules.

Dimiter Topalov
Telerik team
 updated answer on 05 Nov 2021
1 answer
154 views

Hi Team,

I'm currently working with kendo grid and panel bar components using Angular. My application has multiple panel bars with each panel bar containing a kendo grid with Filter Menu options. My issue is such that while I try to use the filter in the first grid and then move on to the second grid and try to filter the options the filter menu automatically closes without filtering the values.

The feature works just fine when I'm handling filters in a single grid. The issue is when I try to use the filters with more than one grid on that page. Please assist.

Thank You.

Martin Bechev
Telerik team
 answered on 04 Nov 2021
Narrow your results
Selected tags
Tags
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?