Questions on UI for ASP.NET Core Forum

1 answer

117 views

How to auto fill Price when change ProductName.

Dear support teams.

I have a problem that I would like your help with.
using Telerik for AspNet.Core, with Grid control.
In the database, there is a list of goods, including goods code, name of goods, and unit price.
For example there are 3 goods
G01 - Goods 01 - 10$
G02 - Goods 02 - 20$
G03 - Goods 03 - 30$
On the grid I also created 3 corresponding fields,
When in add new row mode, enter the commodity code I want to display the name of the goods and the unit price as soon as I have entered "G01"

Do you have any solution to do it?

Thanks for your support.

Regards.

Grid

answered on 03 Mar 2022

1 answer

920 views

MVC Core Kendo Grid Total rows

Hi,

I'm working with Kendo Grid with MVC Core. I try to do the total rows (picture below) for 2 columns

Total Tax Rate (line 8) = line 1 + 2 + 3 + 4 + 5 + 6 for column d and e

Net Tax Rate (line 10) = total of line 8 - line 9 for both column d and e

The users want to see new calculate total every time they make some changes. Any suggestion how to handle this requirement.

Thank you.

Grid

answered on 03 Mar 2022

1 answer

345 views

Unable to build asp.net MVC Core 6.0 app with Telerik nuget in Build server - Compatibility issue

this is an Asp.net MVC Core 6.0 project referring latest Telerik Nuget dll - 2022.1.119

Builds fine locally. But fails in build server due to compatibility issue.

Below is the build log from server.

2022-03-01T03:27:30.5720121Z Checking compatibility for Microsoft.CodeAnalysis.CSharp.Workspaces 4.0.0 with .NETFramework,Version=v6.0.
2022-03-01T03:27:30.5721443Z Package Microsoft.CodeAnalysis.CSharp.Workspaces 4.0.0 is not compatible with net60 (.NETFramework,Version=v6.0). Package Microsoft.CodeAnalysis.CSharp.Workspaces 4.0.0 supports:
2022-03-01T03:27:30.5724004Z   - netcoreapp3.1 (.NETCoreApp,Version=v3.1)
2022-03-01T03:27:30.5724701Z   - netstandard2.0 (.NETStandard,Version=v2.0)
 
Compatibility Issue is because Telerik dll is referring to code analysis dll, which supports only .Net 3.0 core apps.
Please let me know how to resolve this. Why Telerik dll is pulling an lower framework (3.0 core) dependency for .net 6.0 project? Below is snapshot of dll reference in project. Let me know.

General Discussions

answered on 02 Mar 2022

1 answer

1.6K+ views

How do you set value of dropdownlist grid column to field from model instead of a hardcoded default?

I have a grid which lets you create a new row and default values are set. When you create a new row, an API call is made to retrieve the default values which populates the columns. However I would like to set the default value of one of those columns but it is a dropdownlist column (separate API call that gets the values for that column).

To be more specific, I'm confused about is how to get the value "displayvalue" from the UVLJournalEntries model and set it as the default value for the dropdownlist. For example I have "default value" hardcoded here:

                    items.Add().Text("Journal Entries").Content(@<text>
                                @(Html.Kendo().Grid<ArusUI.Areas.UVL.Models.UVLJournalEntriesModel>()
                     .Name("JEGrid_#=PONum#_#=lineNum#") // template expression, to be evaluated in the master context
                      .Columns(columns =>
                      {
                          columns.Bound(p => p.distrPercent).Title("Distribution Percent").Width(16);
                          columns.Bound(p => p.amt).Title("Amount").Width(21); ;
                          columns.Bound(p => p.newCostCenter).Title("Cost Center")
                            .Width(18)
                            .ClientTemplate("\\#=newCostCenter.displayvalue\\#")
                            .Filterable(false);
                          columns.Bound(p => p.acctNum).Title("Account Nbr")
                            .Width(18);
                          columns.Bound(p => p.subAcctNum).Title("Sub Account Nbr")
                              .Width(17);
                          columns.Bound(p => p.refType).Title("Reference Type").Width(20);
                          columns.Bound(p => p.refNum).Title("Reference Nbr").Width(21);
                          columns.Bound(p => p.refSubNum).Title("Reference Sub Nbr").Width(25);
                          columns.Bound(p => p.project).Title("Project Nbr").Width(20);
                          columns.Bound(p => p.activityID).Title("Activity ID").Width(20);
                          columns.Bound(p => p.userDef).Title("User Defined").Width(25);
                      })
                              .ToolBar(toolbar =>
                              {
                                  toolbar.Create().HtmlAttributes(new { Id = "AddId_#=PONum#_#=lineNum#" });
                                  toolbar.Custom().Text("Undo").Name("Cancel").HtmlAttributes(new { Id = "UndoId_#=PONum#_#=lineNum#" });

                              })
                            .Editable(editable => editable.Mode(GridEditMode.InCell))
                            .Selectable(selectable => selectable
                                        .Mode(GridSelectionMode.Single))
                            .Events(ev => ev.Edit("onJEEdit"))
                            .DataSource(dataSource => dataSource
                                .Ajax()
                                .PageSize(10)
                            .Model(model =>
                            {
                                model.Id(field => field.id);
                                //model.Field(field => field.newCostCenter.displayvalue).Editable(true);
                                model.Field(field => field.newCostCenter).DefaultValue(new ArusUI.Areas.UVL.Models.CostCenterModel() { displayvalue = "default value" });
                            })
                            )
                            .Sortable()
                            .Pageable()
                            .Resizable(resize => resize.Columns(true))
                            .Width(2050)
                            .ToClientTemplate())
                    </text>

That part that I highlighted in orange kind of explains what I tried to do but I get the error "newCostCenter" is not defined.

This is the Edit event which populates the default values:

function onJEEdit(e) {
    var URL = '/UVL/GetJournalEntries/'
    var arrValues = e.sender._cellId.split('_');
    var lineNbr = arrValues[2].substring(0, 4);
    var PONbr = arrValues[1];
    var POReleaseNbr;


    if (PONbr.length <= 8) {
        POReleaseNbr = "";
    } else {
        POReleaseNbr = PONbr.substring(0, 8);
    };

    var jeGrid = $(`#JEGrid_${PONbr}_${arrValues[2]}`).data("kendoGrid");
    var detailGridWrapper = jeGrid.wrapper;
    var parentRow = detailGridWrapper.closest("tr.k-detail-row").prev("tr");
    var parentGrid = parentRow.closest("[data-role=grid]").data("kendoGrid");
    var parentModel = parentGrid.dataItem(parentRow);
    var JEGridData = jeGrid.dataSource.data();
    var oldData = jeGrid.dataSource._pristineData;
    var newData = jeGrid.dataSource._data;

    var dataText = $("#Facility").data("kendoDropDownList").text();
    var facility = dataText.split('-');
    var _facilityCode = $.trim(facility[0]);
    var _facilityDesc = $.trim(facility[1]);

    $.ajax({
        type: 'GET',
        url: URL,
        data: { facility: _facilityCode, description: _facilityDesc, purchaseOrderNbr: PONbr, poReleaseNbr: POReleaseNbr, lineNbr: lineNbr },
        dataType: 'json',
        success: function (data) {
            test = data;
            if (data != "error" && data != undefined) {

                var distrPercent = data.journalEntries[0].distrPercent;
                costCenter = data.journalEntries[0].costCenter;
                account = data.journalEntries[0].acctNum;
                amt = data.journalEntries[0].amt;
                referenceType = data.journalEntries[0].refType;
                referenceNbr = data.journalEntries[0].refNum.toString();
                referenceSubNbr = data.journalEntries[0].refSubNum;
                if (data.journalEntries[0].projectNbr != null) { projectNbr = data.journalEntries[0].projectNbr; };
                if (data.journalEntries[0].activityId != null) { activityId = data.journalEntries[0].activityId; };              
                userDef = data.journalEntries[0].userDef;

                if (e.model.isNew() && !e.model.dirty) {

                    newData[0].set("distrPercent", distrPercent);
                    newData[0].set("amt", amt);
                    newData[0].set("refType", referenceType);
                    newData[0].set("refNum", referenceNbr);
                    newData[0].set("refSubNum", referenceSubNbr);
                    newData[0].set("project", projectNbr);
                    newData[0].set("activityID", activityId);
                    newData[0].set("userDef", userDef);

                } else {
                    //not complete

                }


            }
            else {
                Swal.fire(
                    'Something went wrong!',
                    'Please Try again',
                    'error'
                );
            }
        }

    });

}

Here are the controller methods for getting default values (GetJournalEntries) and getting the values for the dropdownlist column (GetCostCenter):

        public async Task<JsonResult> GetJournalEntries(string facility, string description, string purchaseOrderNbr, string poReleaseNbr, int lineNbr)
        {
            string baseUrl = string.Empty;
            HttpClientHandler clientHandler = new HttpClientHandler
            {
                ServerCertificateCustomValidationCallback = (sender, cert, chain, sslPolicyErrors) => { return true; }
            };
            using var client = new HttpClient(clientHandler, true);
            int line = lineNbr;
            string lineNbrStr = UVLFunctions.FmtLineNbr(line);

            try
            {
                if (!String.IsNullOrEmpty(facility) && purchaseOrderNbr != null)
                {

                    baseUrl = _iconfiguration.GetValue<string>("API:UVL") + "/Jes/?facility="
                        + facility + "&description=" + description + "&purchaseOrderNbr=" + purchaseOrderNbr + "&poReleaseNbr=" + poReleaseNbr + "&lineNbr=" + lineNbrStr;

                    var response = await client.GetStringAsync(baseUrl);

                    JEGridModel allJEs = JsonConvert.DeserializeObject<JEGridModel>(response);

                    var id = 0;
                    foreach (var item in allJEs.journalEntries)
                    {
                        item.id = id;
                        id++;
                    };

                    allJEs.journalEntries.ForEach(c => c.newCostCenter = new CostCenterModel() { displayvalue = c.costCenter });

                    return Json(allJEs);
                }
                else
                {
                    return Json("");
                }
            }
            catch (System.Exception e)
            {
                throw e;
            }
        }

        public async Task<JsonResult> GetCostCenter(string facilityCode, string facilityDesc)
        {
            try
            {
                string baseUrl = _iconfiguration.GetValue<string>("API:UVL") + "/CostCenters/?facility=" + facilityCode + "&description=" + facilityDesc;

                HttpClientHandler clientHandler = new HttpClientHandler
                {
                    ServerCertificateCustomValidationCallback = (sender, cert, chain, sslPolicyErrors) => { return true; }
                };

                var json = await new HttpClient(clientHandler).GetStringAsync(baseUrl);

                CostCenterListModel costCenter = JsonConvert.DeserializeObject<CostCenterListModel>(json);
                //costCenter.uvlCostCenter.Sort((v1, v2) => v1.displayvalue.CompareTo(v2.displayvalue));
                return Json(costCenter.uvlDatalist);
            }
            catch (System.Exception e)
            {
                throw e;
            }

        }

EditorTemplate for dropdownlist column:

@model ArusUI.Areas.UVL.Models.CostCenterModel
@using Kendo.Mvc.UI

@(Html.Kendo().DropDownListFor(model=>model)
        .DataValueField("displayvalue")
        .DataTextField("displayvalue")
        .OptionLabel("--Select--")
        .HtmlAttributes(new { style = "font-size:inherit;width:100%;height:1.3rem;align-items: center" })
.DataSource(source =>
{
    source.Read(read =>
    {
        read.Action("GetCostCenter", "UVL").Data("GetFacilityCode");
    }).ServerFiltering(false);
})
)

Model for journal entry grid and model for dropdownlist:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks;

namespace ArusUI.Areas.UVL.Models
{
    public class JEGridModel
    {
        public List<UVLJournalEntriesModel> journalEntries { get; set; }
    }
    public class UVLJournalEntriesModel 
    {
        public int id { get; set; }
        [Range(0, 100)]
        public string distrPercent { get; set; }
        public int amt { get; set; }
        [UIHint("UVL/CostCenter")]
        public CostCenterModel newCostCenter { get; set; }
        public string costCenter { get; set; }
        [UIHint("UVL/AccountNumber")]
        public AccountNumberModel newAccountNumber { get; set; }
        public string acctNum { get; set; }
        public string subAcctNum { get; set; }
        public string refType { get; set; }
        public string refNum { get; set; }
        public string refSubNum { get; set; }
        public string project { get; set; }
        public string activityID { get; set; }
        public string userDef { get; set; }

    }

}

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace ArusUI.Areas.UVL.Models
{
    public class CostCenterListModel
    {
        public List<CostCenterModel> uvlDatalist { get; set; }
    }
    public class CostCenterModel
    {
        public string displayvalue { get; set; }

    }
}

I tried following this demo (Editing custom editor in ASP.NET Core Grid Component Demo | Telerik UI for ASP.NET Core) initially but I am very new so I couldn't understand exactly what I needed to change in my own code. If you have suggestions on what I should do, please let me know (and if possible be very descriptive so I can understand). Thank you for your time.

DropDownList

Grid

answered on 02 Mar 2022

1 answer

864 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

677 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

475 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

113 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

106 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

404 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())