Declined
Last Updated: 08 Nov 2024 14:55 by ADMIN
Created by: Gold Star
Comments: 2
Category: Telerik REPL
Type: Bug Report
0

Hello! When I try to populate a grid with data I can only get it to show the data if I don't use a nested object. For example:

An object like this I'd assume I could access by adding a grid column like this:

When I do it this way however nothing shows up although all items do load into the grid, they just don't show any text.

To make it show text I can only use the first level of properties in the object:

In this case I'd see the data in this property on the table.

Is this a bug or intended functionality?

Completed
Last Updated: 27 Jun 2024 10:46 by ADMIN
Release 2024 Q2 (May)
Created by: Ak
Comments: 2
Category: Repl for Blazor
Type: Feature Request
1
It will be useful to have some UI that allows you to easily start writing a new snippet. For example, a button in the Toolbar or clickable logo that opens a plain REPL to start writing your new code in.
Unplanned
Last Updated: 27 May 2024 13:12 by Avrohom Yisroel
Created by: Avrohom Yisroel
Comments: 0
Category: Telerik REPL
Type: Feature Request
1
I would like to use the latest features of the C# language such as _selectedBands = [_selectedBandOriginal];
Under Review
Last Updated: 10 Apr 2024 12:42 by ADMIN

 

 

Error returned when run second time whether changed or not

crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100] Unhandled exception rendering component: Could not load type of field 'BlazorRepl.UserComponents.__Main:<Drawer>k__BackingField' (5) due to: Could not load file or assembly 'Telerik.Blazor, Version=5.1.1.0, Culture=neutral, PublicKeyToken=20b4b0547069c4f8' or one of its dependencies. System.TypeLoadException: Could not load type of field 'BlazorRepl.UserComponents.__Main:<Drawer>k__BackingField' (5) due to: Could not load file or assembly 'Telerik.Blazor, Version=5.1.1.0, Culture=neutral, PublicKeyToken=20b4b0547069c4f8' or one of its dependencies. at Microsoft.AspNetCore.Components.ComponentBase.<.ctor>b__6_0(RenderTreeBuilder builder) at Microsoft.AspNetCore.Components.Rendering.ComponentState.RenderIntoBatch(RenderBatchBuilder batchBuilder, RenderFragment renderFragment, Exception& renderFragmentException)

__Main.razor

@inherits LayoutComponentBase

<TelerikMediaQuery Media="(max-width: 560px)" OnChange="@SmallMediaQueryChange"></TelerikMediaQuery>
<TelerikMediaQuery Media="(min-width: 560px) and (max-width: 828px)" OnChange="@MediumMediaQueryChange"></TelerikMediaQuery>
@* break point intended for 768px, however, the demo has two paddings 30px each that lead to the new 828px break point *@
<TelerikMediaQuery Media="(min-width: 828px)" OnChange="@LargeMediaQueryChange"></TelerikMediaQuery>

<div class="demo-menu-container">

    @{
        if (WindowSize == DemoWindowSize.Large)
        {
                    <a href="https://www.nmrk.com/services/valuation-and-advisory">
                    <img src="https://www.nmrk.com/favicons/favicon-32x32.png" sizes="32x32" />
                    </a>
        }
        else
        {
            if (IsDrawerOpen)
            {
                <TelerikButton OnClick="(() => IsDrawerOpen = false)" Icon="@SvgIcon.X" FillMode="@(ThemeConstants.Button.FillMode.Flat)"></TelerikButton>
            }
            else
            {
                <TelerikButton OnClick="@ToggleDrawer" Icon="@SvgIcon.Menu" FillMode="@(ThemeConstants.Button.FillMode.Flat)"></TelerikButton>
            }
        }
    }


    @*<h2 class="tk-title">NEWHAL</h2>*@
    <span class="separator"></span>
    @{
        if (WindowSize == DemoWindowSize.Large)
        {
            <TelerikMenu Data="@MenuItems" CloseOnClick="true" OnClick="@((MenuItem item) => OnMenuItemClick(item))">
                <ItemTemplate Context="item">
                    <span class="k-menu-link-text @(item.Text.ToLower() != "components" ? "k-font-weight-bold" : "")">@item.Text</span>
                </ItemTemplate>
            </TelerikMenu>
        }
    }
</div>

<TelerikDrawer @ref="@Drawer" Class="@DrawerClass" Data="DrawerItems" @bind-Expanded="IsDrawerOpen" Mode="@DrawerMode.Overlay">
    <Template>
        <div class="k-drawer-items" role="menubar" aria-orientation="vertical">
            <ul>
                @foreach (var item in context)
                {
                    var selectedClass = item == SelectedMenuItem ? "k-selected" : string.Empty;
                    var boldClass = item.Text.ToLower() != "components" ? "k-font-weight-bold" : "";

                    if (item.Level == 0)
                    {
                        <li class="k-drawer-item k-drawer-separator"></li>
                    }

                    <li @onclick="@(() => OnItemSelect(item))" class="k-drawer-item @selectedClass k-level-@(item.Level)">
                        @if (item.Expanded && (item.Items?.Any() ?? false))
                        {
                            <TelerikSvgIcon Icon="@SvgIcon.ChevronUp"/>
                        }
                        else if (!item.Expanded && (item.Items?.Any() ?? false))
                        {
                            <TelerikSvgIcon Icon="@SvgIcon.ChevronDown" />
                        }

                        <span class="k-item-text @boldClass">@item.Text</span>
                    </li>
                }
            </ul>
        </div>
    </Template>
    <DrawerContent>
        @((MarkupString)DrawerContent)
    </DrawerContent>
</TelerikDrawer>

@Body

@code {
    public bool IsDrawerOpen { get; set; } = false;
    public string DrawerClass { get; set; }
    public string DrawerContent { get; set; }
    public MenuItem SelectedMenuItem { get; set; }
    public DemoWindowSize WindowSize { get; set; }
    public TelerikDrawer<MenuItem> Drawer { get; set; }
    public List<MenuItem> MenuItems { get; set; }
    public List<MenuItem> DrawerItems { get; set; }

    public class MenuItem
    {
        public string Text { get; set; }
        public string Url { get; set; }
        public bool Expanded { get; set; }
        public int Level { get; set; }
        public List<MenuItem> Items { get; set; }
        public string Content { get; set; }
    }

    public enum DemoWindowSize
    {
        Small,
        Medium,
        Large
    }

    private void UpdateDrawerContent(string content)
    {
        if (!string.IsNullOrEmpty(content))
        {
            DrawerContent = content;
        }
    }

    protected void OnMenuItemClick(MenuItem item)
    {
        UpdateDrawerContent(item.Content);
    }

    public async Task ToggleDrawer()
    {
        await Drawer.ToggleAsync();
    }

    public async Task OnItemSelect(MenuItem selectedItem)
    {
        SelectedMenuItem = selectedItem;
        UpdateDrawerContent(selectedItem.Content);

        selectedItem.Expanded = !selectedItem.Expanded;
        var newData = new List<MenuItem>();

        foreach (var item in DrawerItems.Where(x => x.Level <= selectedItem.Level))
        {
            newData.Add(item);
            if (item == selectedItem && selectedItem.Expanded && (item.Items?.Any() ?? false))
            {
                foreach (var child in item.Items)
                {
                    newData.Add(child);
                }
            }

            if (item != selectedItem && !(item.Items?.Contains(selectedItem) ?? false))
            {
                item.Expanded = false;
            }
        }

        DrawerItems = newData;

        if (selectedItem.Level != 0)
        {
            await ToggleDrawer();
        }

        await Task.Yield();
    }

    public void SmallMediaQueryChange(bool matchesMediaQuery)
    {
        if (matchesMediaQuery)
        {
            WindowSize = DemoWindowSize.Small;
            DrawerClass = "drawer-sm";
        }
    }

    public void MediumMediaQueryChange(bool matchesMediaQuery)
    {
        if (matchesMediaQuery)
        {
            WindowSize = DemoWindowSize.Medium;
            DrawerClass = "";
        }
    }

    public async Task LargeMediaQueryChange(bool matchesMediaQuery)
    {
        if (matchesMediaQuery)
        {
            WindowSize = DemoWindowSize.Large;
            DrawerClass = "";

            if (IsDrawerOpen)
            {
                await Drawer.ToggleAsync();
            }
        }
    }

    protected override void OnInitialized()
    {
        MenuItems = new List<MenuItem>()
        {
            new MenuItem()
            {
                Text = "Bids",
                Expanded = false,
                Level = 0,
            },
                new MenuItem()
                {
                    Text = "Assignments",
                    Level = 0,
                },                   
                new MenuItem()
                {
                    Text = "Jobs",
                    Level = 0,
                    Url = "/jobs"
                },
                new MenuItem()
                {
                    Text = "Comps",
                    Level = 0,
                },
                new MenuItem()
                {
                    Text = "Production",
                    Level = 0,
                },                    
                new MenuItem()
                {
                    Text = "Templates",
                    Level = 0,
                },                   
                new MenuItem()
                {
                    Text = "Administration",
                    Level = 0,                                                          }                                                           
            };

        DrawerContent = MenuItems[0].Content;
        DrawerItems = MenuItems;

        base.OnInitialized();
    }

}

<style>
    .k-menu-link
    {
        color: rgb(18, 116, 172) !important;
    }

    #demo-runner {
        padding: 0px;
    }

    .drawer-sm.k-drawer-expanded .k-drawer.telerik-blazor {
        width: 100%;
    }

    .drawer-sm.k-drawer-expanded .k-drawer-wrapper,
    .drawer-sm.k-drawer-expanded .k-drawer-items {
        width: 100% !important;
    }

    .drawer-sm.k-drawer-expanded .k-drawer {
        max-width: 100vh;
    }

    .drawer-sm.k-drawer-expanded .k-overlay {
        display: none;
    }

    .k-drawer-container {
        position: relative;
        width: 100%;
        height: 95%;
        min-height: 300px;
    }

        .k-drawer-container .k-drawer-content {
            font-size: 16px;
            line-height: 20px;
        }

        .k-drawer-container.k-drawer-overlay .k-drawer {
            position: absolute;
        }

    .k-drawer-content {
        padding: 25px;
        font-size: 18px;
    }

        .k-drawer-content a {
            color: #3D57D8;
            text-decoration: inherit;
        }

            .k-drawer-content a:hover {
                text-decoration: underline;
            }

        .k-drawer-content h2 {
            font-weight: 300;
        }

    .tk-logo,
    .tk-logo svg {
        height: 19px;
        width: 18px;
    }

    .tk-logo {
        margin: 5px;
    }

    .tk-title {
        font-size: 19px;
        font-weight: 400;
        white-space: nowrap;
        overflow: hidden;
    }

    .separator {
        box-sizing: border-box;
        width: 1px;
        height: 20px;
        background: #E5E5E5;
        border-radius: 0px;
    }

    .demo-menu-container {
        height: 48px;
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 0px 8px;
        gap: 8px;
        height: 48px;
        left: 0px;
        top: 0px;
        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.03), 0px 4px 5px rgba(0, 0, 0, 0.04);
    }

        .demo-menu-container figure {
            width: 19px;
            height: 19px;
            margin: 0 5px 0 0;
        }

        .demo-menu-container .k-menu {
            height: 100%;
        }

    .k-drawer-item.k-level-1 {
        padding-inline-start: 60px;
    }

    .k-overlay {
        position: absolute;
    }
</style>

Jobs.razor

@layout __Main

@using System.Text.Json;

@page "/jobs"

<style>
    /* grid */
    .k-grid.font-size,
    /* grid toolbar */
    .k-grid.font-size .k-toolbar,
    /* grid cells */
    .k-grid.font-size table,

    /* textboxes */
    .k-grid.font-size .k-input,
    /* date pickers */
    .k-grid.font-size .k-picker,
    /* buttons */
    .k-grid.font-size .k-button,

    /* column and filter menu */
    .k-popup,
    .k-popup .k-input,
    .k-popup .k-picker,
    .k-popup .k-button,

    /*column menu dropdowns */
    .k-columnmenu-item {
        font-size: 12px;
    }
</style>

<div class="demo-menu-container">
    <strong>Jobs - </strong>last opened: Blah blah blah, Job Status: blah 
</div>

<TelerikGrid @ref="@GridRef"
             class="font-size"
             Data=@GridData
             Height=@Height
             Size="@ThemeConstants.Grid.Size.Small"
             FilterMode="@GridFilterMode.FilterRow"
             FilterRowDebounceDelay="filterDebounceDelay"
             Pageable=true PageSize=@PageSize>
    <GridColumns>
        <GridColumn Field=@nameof(ProjectJobQueue.JobNumber)
                    Title="Job #" Width="100px"
                    DefaultFilterOperator="@FilterOperator.IsEqualTo"
                    ShowFilterCellButtons="@showFilterButtons" />        
        <GridColumn Field=@nameof(ProjectJobQueue.NgageNumber)
                    Title="Ngage" Width="100px"
                    DefaultFilterOperator="@FilterOperator.IsEqualTo"
                    ShowFilterCellButtons="@showFilterButtons" />        
        <GridColumn Field=@nameof(ProjectJobQueue.RmsNumber)
                    Title="RMS" Width="100px"
                    DefaultFilterOperator="@FilterOperator.IsEqualTo"
                    ShowFilterCellButtons="@showFilterButtons" />
        <GridColumn Field=@nameof(ProjectJobQueue.DueDtTm)
                    Title="Due Date" Width="100px" DisplayFormat="{0:MM/dd/yyyy}"
                    DefaultFilterOperator="@FilterOperator.IsEqualTo"
                    ShowFilterCellButtons="@showFilterButtons" />                    
        <GridColumn Field=@nameof(ProjectJobQueue.ClientName)
                    Title="Client" Width="250px"
                    DefaultFilterOperator="@FilterOperator.Contains"
                    ShowFilterCellButtons="@showFilterButtons" />
        <GridColumn Field=@nameof(ProjectJobQueue.EngagementTypeDisplay)
                    Title="Project Type" Width="100px"
                    DefaultFilterOperator="@FilterOperator.Contains"
                    ShowFilterCellButtons="@showFilterButtons" />                    
        <GridColumn Field=@nameof(ProjectJobQueue.PropertyAddress)
                    Title="Address" Width="150px"
                    DefaultFilterOperator="@FilterOperator.Contains"
                    ShowFilterCellButtons="@showFilterButtons" />

        <GridColumn Field=@nameof(ProjectJobQueue.CityDisplay)
                    Title="City" Width="150px"
                    DefaultFilterOperator="@FilterOperator.Contains"
                    ShowFilterCellButtons="@showFilterButtons" />

        <GridColumn Field=@nameof(ProjectJobQueue.CountyDisplay)
                    Title="County" Width="100px"
                    DefaultFilterOperator="@FilterOperator.Contains"
                    ShowFilterCellButtons="@showFilterButtons" />                    
                    
        <GridColumn Field=@nameof(ProjectJobQueue.StateDisplay)
                    Title="State" Width="50px"
                    DefaultFilterOperator="@FilterOperator.Contains"
                    ShowFilterCellButtons="@showFilterButtons" />

        <GridColumn Field=@nameof(ProjectJobQueue.PropertyTypeDisplay)
                    Title="Property Type" Width="150px"
                    DefaultFilterOperator="@FilterOperator.Contains"
                    ShowFilterCellButtons="@showFilterButtons" />

    </GridColumns>
</TelerikGrid>

@code {

    TelerikGrid<ProjectJobQueue> GridRef { get; set; }
    int PageSize = 20;
    string Height = "1200px";
    int filterDebounceDelay { get; set; } = 200;
    bool showFilterButtons { get; set; } = true;

    public List<ProjectJobQueue> GridData { get; set; }

    public string Json { get; set; } = "[...]";

    protected override void OnInitialized()
    {
        GridData = JsonSerializer.Deserialize<List<ProjectJobQueue>>(Json);
    }

    public class ProjectJobQueue
    {
        private bool _isSelected;

        private Guid? _ownerId;

        public string AppraisalStatusDisplay { get; set; }
        public string Appraiser { get; set; }
        public string AssignedTo { get; set; }
        public string BusinessUnitName { get; set; }
        public string CityDisplay { get; set; }
        public string ClientName { get; set; }
        public string CountyDisplay { get; set; }
        public string Description { get; set; }
        public DateTime? DueDtTm { get; set; }
        public Guid? EngagementId { get; set; }
        public string EngagementTypeDisplay { get; set; }
        public string HopkinsId { get; set; }
        public string InterestTypeDisplay { get; set; }
        public DateTime? InvoiceDate { get; set; }
        public bool IsBooked { get; set; }
        public bool IsCanceledCharge { get; set; }
        public bool? IsContractPaid { get; set; }
        public bool IsJobOnHold { get; set; }

        public bool IsRequestedInfo { get; set; }

        public bool IsSelected {get; set;}

        public decimal? JobFee { get; set; }
        public Guid? JobId { get; set; }
        public int? JobNumber { get; set; }
        public string JobStatusDisplay { get; set; }
        public string ManagingDirector { get; set; }
        public string NgageNumber { get; set; }
        public DateTime? OwnedDtTm { get; set; }

        //public Guid? OwnerId { get; set; }
        public Guid? OwnerId
        {
            get { return _ownerId; }
            set
            {
                if (_ownerId != value)
                {
                    _ownerId = value;
                    //RaisePropertyChanged(() => OwnerId);
                }
            }
        }

        public string PostalCode { get; set; }
        public string PropertyAddress { get; set; }
        public string PropertyCategoryDisplay { get; set; }
        public string PropertyTypeDisplay { get; set; }
        public string ReportFormatDisplay { get; set; }
        public DateTime? ReportShippedDate { get; set; }
        public DateTime? RevisedShippedDate { get; set; }
        public string RmsNumber { get; set; }
        public string StateDisplay { get; set; }
        //public IUser UserContext { get; private set; }

    }
}

 

Unplanned
Last Updated: 15 Jan 2024 10:22 by Yuriy
Created by: Yuriy
Comments: 0
Category: Repl for Blazor
Type: Bug Report
1
I experience random No active file to update and console errors.
Completed
Last Updated: 11 Dec 2023 08:48 by ADMIN

Where I've embedded the REPL I seem to be getting errors today.

Any changes your side?

Unplanned
Last Updated: 31 Oct 2023 08:55 by ADMIN
Created by: Peter
Comments: 0
Category: Telerik REPL
Type: Feature Request
1

Hi, 

   It would be great if I could drag a file and have it add to my blazorrepl form as a new attachment.  Would save time vs adding files manually then cutting and copying the contents.

Peter

Need More Info
Last Updated: 30 Aug 2023 15:01 by ADMIN

Hi,

I've used the REPL embed feature to include some examples in my online Blazor course (running via WASM).

This week I've had a few reports of the REPL not loading correctly for people.

It seems to be fine for me, but here's an example of an error one person ran into:

Any ideas?

Thanks

Unplanned
Last Updated: 18 Aug 2023 12:59 by ADMIN
Created by: Robert
Comments: 1
Category: Telerik REPL
Type: Bug Report
0

REPL for aspnet core notifications is broken, it runs on first load and then fails to do anything if I change even a single character and then try to run it again

ASP.NET Core REPL - ASP.NET Core Components Playground & Testing - Telerik

Not sure that link will work but I'm talking about the notification that shows email message, error message and upload success

I'm seeing message in dev tools about  'isMobile is  not defined'

Running in Windows 10, latest version of Edge OR latest version of Chrome

 

 

Unplanned
Last Updated: 29 Mar 2023 06:20 by ADMIN
Created by: Dan
Comments: 7
Category: Repl for .NET Core
Type: Feature Request
1
A similar feature like the dojo to change the version is needed.
Completed
Last Updated: 18 Jan 2023 15:27 by ADMIN
Created by: Mister Magoo
Comments: 3
Category: Telerik REPL
Type: Feature Request
4
It would be nice not to have to keep my own list of REPLs - but more like CodePen where the site keeps a list for me.
Unplanned
Last Updated: 05 Dec 2022 15:42 by Ed
Created by: Nadezhda
Comments: 1
Category: Telerik REPL
Type: Feature Request
3

REPL currently provides the option to add external static assets. However, one might need to create their own JavaScript and CSS files.

We want to track the community's interest in allowing users to add .css and .js files inside the projects and use them from the .razor files. Please add your vote if this is a feature you'd like us to add to the REPL tool.

Unplanned
Last Updated: 01 Nov 2022 11:37 by ADMIN
Created by: Nadezhda
Comments: 0
Category: Telerik REPL
Type: Feature Request
0

We are researching if hot reload can be used in REPL and whether it will affect its performance. 

We want to evaluate the community's interest and feedback in this regard. Please vote for this item if you'd like us to add a hot reload feature. Please also share your thoughts on whether it should be enabled by default or if you'd prefer to have the ability to toggle it when needed.

Unplanned
Last Updated: 01 Nov 2022 11:24 by ADMIN
Created by: Nadezhda
Comments: 0
Category: Telerik REPL
Type: Feature Request
0

We are researching possible options for adding an autocomplete feature for the REPL Editor.

We want to evaluate the community's interest and feedback in this regard. Please vote for this item if you'd like us to add autocomplete feature and share your thoughts and expectations considering the following possible options:

  • Basic C# autocomplete in the @code part of the files and in the .cs files.
  • Relevant Blazor component autocomplete.
  • Autocomplete for Telerik code, knowing the proper context and suggesting the parameters for a specific component.
Unplanned
Last Updated: 01 Nov 2022 11:13 by ADMIN
Created by: Nadezhda
Comments: 0
Category: Telerik REPL
Type: Feature Request
0

REPL currently supports light mode only.

We want to track the community's interest in a dark mode. Please vote for this request if you'd like us to add a dark mode feature to the REPL tool.

Unplanned
Last Updated: 01 Nov 2022 10:57 by ADMIN
Created by: Nadezhda
Comments: 0
Category: Telerik REPL
Type: Feature Request
2

At this point, we provide only compile-time errors in the Error List. The runtime errors are not caught and they are going directly into the browser console.

We want to track the community's interest in having a console for runtime errors. Please add your vote if this is a feature you'd like us to add to the REPL tool.

Completed
Last Updated: 27 Sep 2022 12:52 by Mister Magoo
Created by: Mister Magoo
Comments: 5
Category: Telerik REPL
Type: Bug Report
0

Existing REPLs do not compile and run any more.

Here is one simple example. and the error messages you get when you try to save/run

Telerik REPL for Blazor - The best place to play, experiment, share & learn using Blazor.

Code editor error icon CS0246The type or namespace name 'Telerik' could not be found (are you missing a using directive or an assembly reference?)__Main.razor22
Code editor error icon CS0246The type or namespace name 'Telerik' could not be found (are you missing a using directive or an assembly reference?)__Main.razor23
Code editor error icon CS0246The type or namespace name 'Telerik' could not be found (are you missing a using directive or an assembly reference?)__Main.razor24
Code editor error icon CS0246The type or namespace name 'Telerik' could not be found (are you missing a using directive or an assembly reference?)Comp1.razor23
Code editor error icon CS0246The type or namespace name 'Telerik' could not be found (are you missing a using directive or an assembly reference?)Comp1.razor24
Code editor error icon CS0246The type or namespace name 'Telerik' could not be found (are you missing a using directive or an assembly reference?)

 

Unplanned
Last Updated: 13 Sep 2022 07:19 by ADMIN
Created by: Jon
Comments: 0
Category: Telerik REPL
Type: Feature Request
0

Hey,

If the plan is to encourage more widespread use of the REPL, promoting its role as a "go to" destination to prototype and share Blazor code, I wonder if there's scope for an option to toggle Telerik UI off.

I mean, I get why you'd want that on by default…

But I'm keen to use the REPL to embed "runnable" examples in blog posts and often need to share examples that use plain old CSS, or something like Tailwind (or indeed Bootstrap).

In those scenarios I don't really need the default theme/styles that come with Telerik UI (and they could clash with the styles I am trying to use).

Just a thought :)

Unplanned
Last Updated: 13 Jun 2022 05:48 by ADMIN
Created by: Ak
Comments: 3
Category: Repl for .NET Core
Type: Bug Report
0

The Basic Usage Demo of the DataSource does not run in REPL.

  1. Run the demo https://demos.telerik.com/aspnet-core/datasource
  2. Only the headers are displayed
 
Completed
Last Updated: 08 Jun 2022 08:44 by ADMIN
Release 3.3.2
Created by: Adam
Comments: 1
Category: Telerik REPL
Type: Bug Report
4

https://blazorrepl.telerik.com/GQYpbvbP37ENDltY58

This sample seems to be broken.  It won't run.

1 2