Questions on UI for Blazor Forum

1 answer

142 views

TelerikDateInput AllowCaretMode Bug

Cannot type in date into TelerikDateInput if AllowCaretMode is true and the DateInput focus is in the whole input,

how to reproduce:

move focus to DateInput from previous input (whole dateInput is in focus)

Type in 01 into the DateInput, the caret will move to end, but no value filled.

This is the REPL page:

https://blazorrepl.telerik.com/GnYsHlcv54uXw7hd34

this is the form and how to reproduce:

DateInput

answered on 05 Sep 2023

1 answer

123 views

Will Kendo UI get support for styling using css variables like Bootstrap?

I know about the awesome ThemeBuilder but sometime all you need is to change the accent color and some other global properties.

Thats way I ask if you are going to support CSS Vars for styling.

Bootstrap · The most popular HTML, CSS, and JS library in the world. (getbootstrap.com)

Styling

answered on 05 Sep 2023

1 answer

211 views

How to show Tooltip on a DropDownButtonItem

Hello. I would like to show a tooltip on a DropDownButtonItem, I tried but without success. This is the Repl link. May you kindly help me? Thank you.

Tooltip

answered on 05 Sep 2023

1 answer

203 views

Possible error in the edit grid template

Blazor Grid - Popup Editing - Telerik UI for Blazor

 <GridSettings>
        <GridPopupEditSettings MaxWidth="600px"
                               MaxHeight="300px"
                               Class="custom-popup">
        </GridPopupEditSettings>
        <GridPopupEditFormSettings Orientation="@FormOrientation.Horizontal"
                                   ButtonsLayout="FormButtonsLayout.Center"
                                   Columns="2">
        </GridPopupEditFormSettings>
    </GridSettings>

The button layout is always left no matter what you choose in

FormButtonsLayout

Grid

answered on 05 Sep 2023

0 answers

222 views

Blazor Schedular Appointment Popup Customization

Hello,
I want to update Blazor Schedular Appointment Popup Customization. I want to add new fields and remove all day event, repeat tabs.
Not required to update all the appointment details. Only possible to view that detail is also fine.
I tried to customize div tag, AppointmentDetailViewTemplate, etc. are not support in TelerikScheduler tag.
Required Popup detail changes screenshot is attached. please find attachment
Second thing is I want to add SchedulerViews for year. that is also not support in balzor code.
Anyone have any solution for Blazor Schedular Appointment Popup Customization and Yearly Scheduler view, please let me know...

Thank You

Calendar

Scheduler

asked on 05 Sep 2023

2 answers

1.0K+ views

Unable to build SASS after upgrade to kendo-theme-default 6.7.0 and Blazor UI 4.4.0

I am using Blazor UI and have upgraded to latest version 4.4.0 also upgraded the kendo-theme-default to version 6.7.0.

Using dart sass version 1.66.1 for the build.

Not using all your components so in my vendors folder I have this imports in _index.sass.

It used to work but not after the upgrade.

@import "../../node_modules/@progress/kendo-theme-default/scss/treeview";
@import "../../node_modules/@progress/kendo-theme-default/scss/tabstrip";
@import "../../node_modules/@progress/kendo-theme-default/scss/grid";
@import "../../node_modules/@progress/kendo-theme-default/scss/button";
@import "../../node_modules/@progress/kendo-theme-default/scss/common";
@import "../../node_modules/@progress/kendo-theme-default/scss/checkbox";
@import "../../node_modules/@progress/kendo-theme-default/scss/textbox";
@import "../../node_modules/@progress/kendo-theme-default/scss/loader";

in package.json

"scripts": {
    "sass": "npx sass --quiet-deps ./sass/app.scss ./wwwroot/css/app.css",
    "sass:watch": "npx sass --watch --quiet-deps ./sass/app.scss ./wwwroot/css/app.css"
  },

Output from build

> npx sass --quiet-deps ./sass/app.scss ./wwwroot/css/app.css

Error: Can't find stylesheet to import.
  ╷
1 │ @import "@progress/kendo-theme-core/scss/functions/index.import.scss";
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  node_modules\@progress\kendo-theme-default\scss\core\functions\index.import.scss 1:9  @import
  node_modules\@progress\kendo-theme-default\scss\_variables.scss 1:9                   @import
  node_modules\@progress\kendo-theme-default\scss\core\_index.scss 4:9                  @import
  node_modules\@progress\kendo-theme-default\scss\treeview\_index.scss 1:9              @import
  sass\vendors\_index.scss 2:9                                                          @import
  sass\app.scss 7:9                                                                     root stylesheet

Have been wasting another hour (:

have modified the @import path in the Telerik source files

$wcag-min-contrast-ratio: 4.5 !default;

// Variables
@import "../_variables.scss";

//@import "@progress/kendo-theme-core/scss/index.import.scss";
@import "../../../kendo-theme-core/scss/functions/index.import.scss";

// Expose
@include exports("kendo-core-styles") {
    @include kendo-core--styles();
}

And then I get this new error. Should I stop using Dart SASS?

2>EXEC: Warning  DEPRECATION: Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.

Recommendation: math.div($a, $b) or calc($a / $b)

More info and automated migrator: https://sass-lang.com/d/slash-div

   ÔòÀ
66 Ôöé     @return ( $a / $b );
   Ôöé               ^^^^^^^
   ÔòÁ
    node_modules\@progress\kendo-theme-core\scss\functions\_math.import.scss 66:15  k-math-div()
    node_modules\@progress\kendo-theme-default\scss\_variables.scss 285:21          @import
    node_modules\@progress\kendo-theme-default\scss\core\_index.scss 4:9            @import
    node_modules\@progress\kendo-theme-default\scss\treeview\_index.scss 1:9        @import
    sass\vendors\_index.scss 4:9                                                    @import
    sass\app.scss 7:9                                                               root stylesheet

2>EXEC: Error  : Undefined mixin.
   ÔòÀ
10 Ôöé Ôöî @include exports("kendo-core-styles") {
11 Ôöé Ôöé     @include kendo-core--styles();
12 Ôöé Ôöö }
   ÔòÁ
  node_modules\@progress\kendo-theme-default\scss\core\_index.scss 10:1     @import
  node_modules\@progress\kendo-theme-default\scss\treeview\_index.scss 1:9  @import
  sass\vendors\_index.scss 4:9                                              @import
  sass\app.scss 7:9                                                         root stylesheet
2>------- Finished building project: Zeus.Client. Succeeded: False. Errors: 1. Warnings: 1
Build completed in 00:00:02.138

Styling

answered on 04 Sep 2023

0 answers

136 views

Blazor UI Troubleshooting and Tips

I'm diving into the realm of Telerik UI for Blazor, and I've hit a bit of a roadblock that I'm hoping someone can help me with. I'm currently working with the NumericTextBox component, and I'm trying to achieve browser-level auto complete while Virginia DMV online services for vehicle registration DMVNOW Portal maintaining custom formatting for units (like "in", "kg", "cm", etc.).However, I've noticed that when the browser's auto complete history includes the formatting string, it messes up the value handling within the component. This causes the value to disappear before the onchange event triggers, since it's technically a string.Has anyone else encountered this situation?

General Discussions

updated question on 04 Sep 2023

0 answers

371 views

Change grid page size does not refresh data

I use a grid with PageSizes settings and OnRead event to load data.

When i change the selected page size combobox value, the grid does not reload. It update only the pager, but grid does not update the records.

You can reproduce with this code:

https://blazorrepl.telerik.com/mHkjEoOV17OVmZ9u30

How to solve?

Thanks

Grid

asked on 04 Sep 2023

1 answer

96 views

Trouble Building SASS for Blazor Telerik Checkbox with Name Property

I've been working on a Blazor project and using Telerik components. when I try to set the Name property for the Checkbox. It seems that whenever I include the Name property in the Checkbox, the SASS compilation process fails, throwing an error I'm not familiar with. Has anyone else faced a similar problem

General Discussions

answered on 04 Sep 2023

1 answer

495 views

SvgIcon not in the current context

Hi there,

I knew I must have missed something about this error. I'm trying to using SvgIcon in the grid button but it complained about ""The name 'SvgIcon' does not exist in the current context". Please advise.

Here is the demo i'm following:

https://demos.telerik.com/blazor-ui/grid/editing-inline

Thanks,

Bob

Grid

answered on 02 Sep 2023