Questions on UI for ASP.NET Core Forum

1 answer

885 views

Grid Sever Export to export only filtered rows

Good afternoon,

I've been using the following demo to export a large dataset to Excel:

https://demos.telerik.com/aspnet-core/grid/server-export

However, unless you click the checkbox to select a row or all rows on a page, it exports all 830 rows in the demo data source regardless of whether any filters have been applied. If you use the checkbox to select rows it will export one page i.e. 20 rows.

Ideally I want to export all the filtered rows in the grid and not require a checkbox to select them. If I filter the Freight column as > 200 and then export, I only want to export the 73 items.

Is this possible?

Kind regards,

Richard

Grid

answered on 02 Mar 2022

3 answers

699 views

Migration process from AJAX to Core

Hi All,

We have been using the UI ASP AJAX product to build up our WebApp during the past 5 years. We would like now to migrate to UI ASP Core. Is there some kind of tool from Telerik that would ease the process ?

We are aware that will require code editing at some point, but if there was some kind of Analyzer or something to indicate what lib must be replaced / updated / deleted or what telerik object / class should be used instead of the current one to achieve similar behavior etc .... This would be great help.

Cheers

Chris

General Discussions

answered on 02 Mar 2022

1 answer

491 views

OrgChart: Custom fields / Template with edit button

Hello,

two questions regarding the OrgChart ...

is it possible to use additional custom fields in the OrgChart or is that limited to Id, ParentId, Name, Title, Avatar, Expanded?

If a template is used, how to get the edit, create, delete menu displayed? is it possible to use an EditorTemplate?

Thank you for your help.

Best regard, Oliver

OrgChart

answered on 02 Mar 2022

1 answer

117 views

Image size in Editor in % not in px size

Hi,

When adding a large image (>1000px width) in the Editor, it looks fine on a laptop/tablet.

But when showing it on a mobile, it doesn't.

Is it possible to enter the image size in % so it auto rescales depending on the screen size?
Or is there another way to solve this problem?

Thanks...

Editor

answered on 25 Feb 2022

1 answer

112 views

Remove buttons from Editor Toolbar when showing on mobile

Hi,

I'm using the Editor with a lot of options/buttons and that works fine on a 'large' screen.

On a mobile it will split over 4 lines.
(Hardly no room for editing text left)

Is it possible to reduce the number of options/buttons in the toolbar when showing it on a mobile phone?
(I only want to keep the Bold/Italic/Underline buttons)

Thanks....

Editor

Toolbar

answered on 25 Feb 2022

1 answer

418 views

Asp net Core Grid - aggregates not work

Hello I want to use aggregate function in my grid but it not work. I read examples here but no success.

Can someone tell me why?

Here is my code:

 @(Html.Kendo().Grid(Model.RecipeLinesdetail)
                .Name("#grid")
                .Editable(editable => editable.Mode(GridEditMode.InCell))
                .Columns(c=>{
                    c.Bound(c=>c.RecipeLineId).Hidden(true);
                    c.Bound(c=>c.ChemistryRecipeViewModel.ChemistryName)
                        .EditorTemplateName("ChemistryEditor")
                        .Width(500)
                        .ClientTemplate("#= ChemistryRecipeViewModel.ChemistryName # <input type='hidden' name='RecipeLinesdetail[#=index(data)#]"+
                            ".ChemistryRecipeViewModel.ChemistryId' value='#= ChemistryRecipeViewModel.ChemistryId #' />"+
                                                        "<input type='hidden' name='RecipeLinesdetail[#=index(data)#]"+
                            ".ChemistryRecipeViewModel.ChemistryName' value='#= ChemistryRecipeViewModel.ChemistryName #' />");
                    c.Bound(c=>c.Dosage)
                          .EditorTemplateName("DosageEditor")                          
                          .ClientTemplate("#= kendo.toString(Dosage,\"n3\")# <input type='hidden' name='RecipeLinesdetail[#=index(data)#].Dosage' value='#= Dosage #' />")
                          .ClientFooterTemplate("Dávkování celkem: #=sum#");
                    c.Bound(c=>c.Units.UnitName)
                        .EditorTemplateName("UnitsEditor")
                        .Title("Jednotka výpočtu")
                        .ClientTemplate("#= Units.UnitName # <input type='hidden' name='RecipeLinesdetail[#=index(data)#]"+
                            ".Units.UnitId' value='#= Units.UnitId #' />"+
                            "<input type='hidden' name='RecipeLinesdetail[#=index(data)#]"+
                            ".Units.UnitName' value='#= Units.UnitName #' />");
                    c.Bound(c=>c.Rounded)
                        .EditorTemplateName("DosageEditor")
                        .ClientTemplate("#= kendo.toString(Rounded,\"n3\") # <input type='hidden' name='RecipeLinesdetail[#=index(data)#].Rounded' value='#= Rounded #' />");
                    c.Bound(c=>c.Units2.UnitName)
                        .EditorTemplateName("Units2Editor")
                        .Title("Jednotka vážení")
                        .ClientTemplate("#= Units2.UnitName # <input type='hidden' name='RecipeLinesdetail[#=index(data)#]"+
                            ".Units2.UnitId' value='#= Units2.UnitId #' />"+
                            "<input type='hidden' name='RecipeLinesdetail[#=index(data)#]"+
                            ".Units2.UnitName' value='#= Units2.UnitName #' />");
                    c.Bound(c=>c.Comment)
                        .ClientTemplate("#= Comment # <input type='hidden' name='RecipeLinesdetail[#=index(data)#].Comment' value='#= Comment #' />");
                    c.Command(command => command.Destroy()).Width(150);
                })
                .DataSource(dataSource => dataSource
                .Ajax()
                .Aggregates(agr=>{
                    agr.Add(c=>c.Dosage).Sum();
                })
                .Batch(true)
                .Create(create => create.Action("Create", "Recipes"))
                .Destroy(destroy => destroy.Action("Destroy", "Recipes"))
                .Model(m =>{
                    m.Id(id=>id.RecipeLineId);
                    m.Field(id=>id.RecipeLineId).Editable(false).DefaultValue(0);
                    m.Field(f=>f.ChemistryRecipeViewModel).DefaultValue(
                       new ChemistryRecipeViewModel{
                           ChemistryId="0",
                           ChemistryName=""
                       }); 
                   m.Field(f=>f.Units).DefaultValue(
                       new UnitRecipeViewModel{
                           UnitId=0,
                           UnitName=""
                       }); 
                    m.Field(f=>f.Units2).DefaultValue(
                       new UnitRecipeViewModel{
                            UnitId=0,
                           UnitName=""
                       });
                    m.Field(f=>f.Comment).DefaultValue("");
                }))

                .ToolBar(toolbar =>
                {
                    toolbar.Create();
                    toolbar.Excel();
                    toolbar.Search();
                })

                .Excel(excel=>excel.ProxyURL(Url.Action("Excel_Export_Save", "Grid")))
                .Editable())

And last point is I would like to have it works also when user add or change value

Is there possibility to update Sum when cell change?

Many thx in advance

Lukas

Grid

answered on 23 Feb 2022

0 answers

141 views

Confused about ASP .Net Core and its use with Angular for frontend

Hi,

I'm pretty new to ASP .Net Core but I have read on microsoft site that code written with it can be run on the browswer and can be used to create UI. So, If all this can be done with ASP .Net Core why is people pairing it with Angular? I known there's something I'm missing here but don't know what.

I would really appreciate it if anyone could clarify it.

Cheers!

General Discussions

asked on 23 Feb 2022

1 answer

318 views

No records to display in Telerik's TreeList With Razor Page

Template code:

@(Html.Kendo().TreeList<EmployeeDirectoryModel>()
    .Name("treelist")
    .Toolbar(toolbar => toolbar.Create())
    .Columns(columns =>
    {
        columns.Add().Field(e => e.FirstName).Title("First Name").Width(220);
        columns.Add().Field(e => e.LastName).Title("Last Name").Width(200);
        columns.Add().Field(e => e.Position);
        columns.Add().Field(e => e.HireDate).Format("{0:MMMM d, yyyy}");
        columns.Add().Width(350).Command(c =>
        {
            c.CreateChild().Text("Add child");
            c.Edit();
            c.Destroy();
        })
        .HtmlAttributes(new
        {
            style = "text-align: center;"
        });
    })
    .Editable()
    .DataSource(dataSource => dataSource
        .Read(r => r.Url("/Employees/Index?handler=Read").Data("forgeryToken")) // Specify the url to the OnPostRead method.
        .Update(u => u.Url("/Employees/Index?handler=Update").Data("forgeryToken"))
        .Create(c => c.Url("/Employees/Index?handler=Create").Data("forgeryToken"))
        .Destroy(d => d.Url("/Employees/Index?handler=Destroy").Data("forgeryToken"))
        .Model(m =>
        {
            m.Id(f => f.EmployeeId); // Provide the Id property of the model.
            m.ParentId(f => f.ReportsTo); // Provide the Child Id property of the model.
            m.Expanded(false); // Set to true if you want the TreeList to be expanded by default.
            m.Field(f => f.FirstName);
            m.Field(f => f.LastName);
            m.Field(f => f.ReportsTo);
            m.Field(f => f.HireDate);
            m.Field(f => f.Position);
        })
    )
    .Height(540)
)

Headers request:

Response:

{
    "data": [
        {
            "employeeId": 1,
            "firstName": "Daryl",
            "lastName": "Sweeney",
            "reportsTo": null,
            "position": "CEO",
            "hasChildren": false,
            "hireDate": "2022-02-19T14:02:27.590078+07:00"
        },
        {
            "employeeId": 2,
            "firstName": "Guy",
            "lastName": "Wooten",
            "reportsTo": 1,
            "position": "Chief Technical Officer",
            "hasChildren": false,
            "hireDate": "2022-02-20T14:02:27.590084+07:00"
        },
        {
            "employeeId": 3,
            "firstName": "Buffy",
            "lastName": "Weber",
            "reportsTo": 2,
            "position": "VP, Engineering",
            "hasChildren": false,
            "hireDate": "2022-02-21T14:02:27.5900853+07:00"
        },
        {
            "employeeId": 4,
            "firstName": "Hyacinth",
            "lastName": "Hood",
            "reportsTo": 3,
            "position": "Team Lead",
            "hasChildren": false,
            "hireDate": "2022-02-22T14:02:27.5900856+07:00"
        },
        {
            "employeeId": 5,
            "firstName": "Akeem",
            "lastName": "Carr",
            "reportsTo": 4,
            "position": "Junior Software Developer",
            "hasChildren": false,
            "hireDate": "2022-02-23T14:02:27.590086+07:00"
        },
        {
            "employeeId": 6,
            "firstName": "Rinah",
            "lastName": "Simon",
            "reportsTo": null,
            "position": "Software Developer",
            "hasChildren": false,
            "hireDate": "2022-02-24T14:02:27.5900865+07:00"
        },
        {
            "employeeId": 7,
            "firstName": "Gage",
            "lastName": "Daniels",
            "reportsTo": 6,
            "position": "Software Architect",
            "hasChildren": false,
            "hireDate": "2022-02-25T14:02:27.5900868+07:00"
        },
        {
            "employeeId": 8,
            "firstName": "Constance",
            "lastName": "Vazquez",
            "reportsTo": 6,
            "position": "Director, Engineering",
            "hasChildren": false,
            "hireDate": "2022-02-26T14:02:27.5900871+07:00"
        },
        {
            "employeeId": 9,
            "firstName": "Darrel",
            "lastName": "Solis",
            "reportsTo": 8,
            "position": "Team Lead",
            "hasChildren": false,
            "hireDate": "2022-02-27T14:02:27.5900874+07:00"
        },
        {
            "employeeId": 10,
            "firstName": "Brian",
            "lastName": "Yang",
            "reportsTo": 9,
            "position": "Senior Software Developer",
            "hasChildren": false,
            "hireDate": "2022-02-28T14:02:27.5900878+07:00"
        },
        {
            "employeeId": 11,
            "firstName": "Lillian",
            "lastName": "Bradshaw",
            "reportsTo": 9,
            "position": "Software Developer",
            "hasChildren": false,
            "hireDate": "2022-03-01T14:02:27.5900882+07:00"
        }
    ],
    "total": 11,
    "aggregateResults": {},
    "errors": null
}

UI result:

Grid

TreeList

answered on 18 Feb 2022

2 answers

1.2K+ views

Set "maxlength" to a field in forms

Hi,

I'm trying to set the maximum length of input characters using HtmlAttributes in a form. But it seems it doesn't work; I can still type more than 4 characters. Here is an example in REPL:

https://netcorerepl.telerik.com/wmkmbflo51nxiZPb01

                   i.Add()
                        .Field(f => f.FirstName)
                        .Editor(e=> e.TextBox().HtmlAttributes(new { maxlength = "4" }))
                        .Label(l => l.Text("First Name:"));

Thanks,

Humberto

Form

TextBox

answered on 18 Feb 2022

1 answer

155 views

ComboBox Strict Selection

I don't want the user to be able to type in the Text part of the combo box. They are required to select from the options provided. How do I prevent typing?

ComboBox

answered on 18 Feb 2022