Telerik Forums
UI for ASP.NET Core Forum
1 answer
166 views

I am trying to disable my edit and delete commands conditionally. I have found a couple of resources on these forums but none of them work in me scenario. I attempted to use the .Visible() function of the command cell; however, this approach is throwing an error in the browser console. So, I went a different direction and used the .Template() for my command. This is also not working because I am not getting the data item for the row in my template handler. Here is where I am at.


@(Html.Kendo().Grid<DocumentVM>()
        .Name("Documents")
        .Columns(columns =>
        {
            columns.Bound(f => f.Title)
                .ClientTemplate("<a href='" +
                    Url.Action("DisplayFile", "Documents") + "/#=Id#' target='_blank'><i class='k-icon #:FileIcon#'></i> #=Title#</a>"
                );
            columns.ForeignKey(f => f.DocumentTypesId, (System.Collections.IEnumerable)ViewData["DocTypes"], "Id", "Description");
            columns.Bound(f => f.CreatedDate).Title("Date Uploaded");
            columns.Bound(f => f.CreatedBy).Title("Uploaded By");
            columns.Command(command => {
                command.Edit().Template("#= EditableTemplate(data) #");
                command.Destroy().Template("#= DeleteTemplate(data) #");
            });
...
)


function EditableTemplate(data) {
    if (data.Editable) {
        return "<a role='button' class='k-button k-button-icontext k-grid-edit' href='#'><span class='k-icon k-i-edit'></span>Edit</a>"
    }
    else {
        return "<a role='button' class='k-button k-button-icontext k-grid-edit k-state-disabled' href='#'><span style='color: green;' class='k-icon k-i-check'></span>Edit</a>"
    }
}

function DeleteTemplate(data) {
    var currentUser = $("#CurrentUser").val();
    var userIsAdmin = $("#UserIsAdmin").val();

    if (data.Editable === true && currentUser === data.CreatedBy) {
        return "<a role='button' class='k-button k-button-icontext k-grid-delete' href='#'><span class='k-icon k-i-close'></span>Delete</a>"
    }
    else {
        return "<a role='button' class='k-button k-button-icontext k-grid-delete k-state-disabled' href='#'><span class='k-icon k-i-close'></span>Delete</a>"
    }
}
How can I access the row data item in my template handlers for commands?
Stoyan
Telerik team
 answered on 18 May 2022
1 answer
140 views

I have just updated some of my code to 2022 R2 and believe I have found a bug. It is not control specific as it is related to the DataSource and the way it generates urls.

In my code I have controllers and views within a MVC Area (Areas in ASP.NET Core | Microsoft Docs )

Up to now it worked fine and the below sample would end up generating a url that used the ambient area when generating the url

.Read(read => read.Action("Transactions_Read", "Transactions").Data("transreaddata"))

This would produce: /Admin/Transactions/Transactions_Read

Now since R2 2022 it will not use the ambient Area. Thus it will produce: /Transactions/Transactions_Read

 

Current workaround would be to add an area route value in for each url.  If one has lots of datasources where that would be necessary that could be a bit time consuming. May be classified as a breaking change

 

Doing some debugging on it with the actual telerik source code I have found the problem

In file NavigatableExtensions.cs with the function GenerateUrl (line 160)

The below was added between R1 2022 and R2 2022

 

object area;
            if (navigatable.HasValue() && navigatable.RouteValues != null && !navigatable.RouteValues.TryGetValue("area", out area))
            {
                navigatable.RouteValues.Add("area", "");
            }

Effectively, if you rely on using ambient values, you do not create a route value called "area". Thus the TryGetValue fails and causes the code to adda blank area route value which will override the ambient value

 

Mihaela
Telerik team
 answered on 18 May 2022
1 answer
117 views

Hey,

Let's say that I have a ListView with comments:


@(Html.Kendo().ListView<Adelante_ERP_GSBK.Models.ProjectComment>()
                    .Name("listView")
                    .TagName("div")
                    .ClientTemplateId("template")
                    .HtmlAttributes(new {style = "border: none;"})
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .Read(read => read.Action("GetComments", "ProjectComment", new {projectId = Model.Id}))
                    ))

Template


<script type="text/x-kendo-tmpl" id="template">
<div class="post">
    <div class="user-block" style="margin-bottom: 0;">
        <span class="username" style="display: inline; margin-left: 10px;">
            #:User.Name#
        </span>
        <span class="description" style="display: inline; margin-left: 5px">
            #:kendo.toString(CommentDate, "d")#
        </span>
        <a onclick="showInPopup('@Url.Action("AddOrEdit", "ProjectComment", null, Context.Request.Scheme)/#:Id#', 'Edit')" style="cursor: pointer;" title="Dodaj">
            <i class="fa-solid fa-pen-to-square"></i>
        </a>
        <a onclick="showInPopup('@Url.Action("Delete", "ProjectComment", null, Context.Request.Scheme)/#:Id#', 'Delete?')" style="cursor: pointer;" title="UsuĊ„">
             <i class="fa-solid fa-xmark"></i>
        </a>
    </div>
    <div style="margin-left: 10px;">
        #:CommentContent#
    </div>
</div>
</script>

Everything works fine, but I don't want that all users always see edit/delete buttons.

Edit button should be visible only for author and administrator, delete only for administrator.

 

Does anyone have an idea how can I do this?

Stoyan
Telerik team
 answered on 16 May 2022
1 answer
242 views

In my scheduler app i made my own editor for events, with contains most of the default inputs and some of my own. However i am having issues getting the RecurrenceEditor working. The RecurrenceEditor does showup and functions as expected in the ui, however when i submit the form after filling in an recurrence, the value in my model remains null and also doesnt throw any errors. All other inputs such as title, time, etc. does show up in my model and works as expected.

My code for the RecurrenceEditor that always submits null:

<div class="form-group">
     <div class="k-edit-label">
             @(Html.LabelFor(model => model.RecurrenceRule))
     </div>
     <div data-container-for="recurrenceRule" class="k-edit-field">
             @(Html.Kendo().RecurrenceEditorFor(model => model.RecurrenceRule)
                 .HtmlAttributes(new { data_bind = "value:recurrenceRule" }))
     </div>
</div>

An example of a input that i use and does work:

<div class="form-group">
     <div class="k-edit-label">
         @(Html.LabelFor(model => model.Description))
     </div>
     <div data-container-for="description" class="k-edit-field">
         @(Html.TextAreaFor(model => model.Description, new { @class = "k-textbox", data_bind = "value:description" }))
     </div>
</div>

 

Aleksandar
Telerik team
 answered on 16 May 2022
1 answer
624 views
I’m using ASP.NET CORE with Telerik Core UI. I am fetching data from an SQL server, and when I debug code, I see data made to the action method.

 However, Grid doesn’t populate any data; I only see the headers, in developer mode, I see no errors thrown. Could you please let me know what I am doing wrong.

 

For Startup class, I have added appropriate reference

services.AddControllersWithViews()

                       .AddJsonOptions(options =>

            {

             options.JsonSerializerOptions.PropertyNameCaseInsensitive = true;

              options.JsonSerializerOptions.PropertyNamingPolicy = null;

            })

            services.AddKendo();

 

Any help is much appreciated.

 

Model:

public class SampleModel

{

  public int ASSAY_ID { get; set; }

  public string ASSAY_REQUESTED { get; set; }

  public string SAMPLE_NUMBER { get; set; }

  public int ASSAY_NUMBER { get; set; }

}

 

Controler:

  public ActionResult Index([DataSourceRequest] DataSourceRequest request)

        {

 

            SampleRepository samprp = new SampleRepository(_configuration);

            var smp = samprp.GetSamples();

 

            var queryable = smp.AsQueryable<SampleModel>();

            DataSourceResult result = queryable.ToDataSourceResult(request,

 
                c => new SampleModel

                {

                    ASSAY_ID = c.ASSAY_ID,

                    ASSAY_REQUESTED = c.ASSAY_REQUESTED,

                    SAMPLE_NUMBER = c.SAMPLE_NUMBER,

                    ASSAY_NUMBER = c.ASSAY_NUMBER

                 });

            return View(queryable);

        }

View:

@using Kendo.Mvc.UI

@using Kendo.Mvc.Extensions

 

 

@(Html.Kendo().Grid<SCAssayApp.Models.SampleModel>()

                .Name("grid")

                .AutoBind(true)

                .EnableCustomBinding(true)

                .Columns(columns =>

                {

                    columns.Bound(p => p.ASSAY_ID).Width(50);

                    columns.Bound(p => p.ASSAY_NUMBER).Width(60);

                    columns.Bound(p => p.SAMPLE_NUMBER).Width(70);

                    columns.Bound(p => p.ASSAY_REQUESTED).Width(100);

                    columns.Command(command => { command.Edit(); command.Destroy(); }).Width(172);

                })

                .ToolBar(toolbar => toolbar.Create())

                .Editable(editable => editable.Mode(GridEditMode.InLine))

                .Scrollable()

                .HtmlAttributes(new { style = "height:430px;" })

            .DataSource(dataSource => dataSource

                .Ajax()

               .PageSize(20)

                .Events(events => events.Error("error_handler"))
                .Model(model =>

                {

                    model.Id(p => p.ASSAY_ID);

                    model.Field(p => p.ASSAY_NUMBER);

                    model.Field(p => p.SAMPLE_NUMBER);

                    model.Field(p => p.ASSAY_REQUESTED);

                }

               )

        .Read(read => read.Action("Index", "Sample"))

        .ServerOperation(false)

    )
Alexander
Telerik team
 answered on 13 May 2022
1 answer
568 views

Package version: 2020.1.406

We have a grid taking advantage of a client template and the onChange event to automatically save changes.

Everything works correctly if the user presses "Enter" or clicks out of the cell.

If the user uses the "Tab" key to navigate to the next cell, the onChange event fires before the value actually updates in the input.

In the onChange event, if it fires after using the tab key the value is the previous value, but hen using "enter" or clicking out of cell the values are the correct updated value.

 

Here is the code.

 

@(Html.Kendo().Grid<StubAmountsViewModel>
            ()
            .Name("stubAmountsGrid")
            .Columns(columns =>
            {
            //columns.Bound(c => c.AccrualHeaderId).Visible(false);
            columns.Bound(c => c.CustomerNumber);
            columns.Bound(c => c.BusinessUnit).Visible(false);
            //columns.Bound(c => c.CustomerDescription);
            columns.Bound(c => c.DataDate).Format("{0:MMM-yyyy}");
            columns.Bound(c => c.JobDescription);
            columns.Bound(c => c.StubAccrualValue).HtmlAttributes(new {onChange = "stubAccrualValueChange(this)"})
            .ClientTemplate("<input type='text' class='numeric k-textbox k-grid-StubAccrualValue stubAccrualValueInput' min='0' step='0.01' value='#=StubAccrualValue#' style='width: 100% !important;'  />");
            })
            .DataSource(source => source
            .Ajax()
            .PageSize(20)
            .Model(m => m.Id(r => r.AccrualHeaderId))
            .Read(read => read.Action("ReadStubAmounts", "Admin").Data("getClosedMonthData")))
            .Groupable()
            .Pageable(pageable => pageable
            .Refresh(true)
            .PageSizes(true)
            .ButtonCount(5))
            .Sortable()
            .Events(events => events.DataBound("stubAmountsDataBound"))
            )

 

function stubAccrualValueChange(e) {
        const accrual = $("#stubAmountsGrid").data("kendoGrid").dataItem($(e).closest('tr'));
        const newValue = $(e).find("input.stubAccrualValueInput").first()[0].ariaValueNow;

        $.ajax({
            url: '@Url.Action("UpdateStubAccrualValue", "Admin")',
            type: 'POST',
            data: { accrualHeaderId: accrual.AccrualHeaderId, stubAccrualValue: newValue },
            cache: false,
            success: function() {
                //$("#stubAmountsGrid").data("kendoGrid").dataSource.read();
            }
        });
    }
Mihaela
Telerik team
 answered on 13 May 2022
1 answer
355 views
I am programmatically creating and filling multiple editors.  After I assign the contents of each editor, I would like to have the editor shrink or expand its height to fit the contents.  How can this be don?
Mihaela
Telerik team
 answered on 13 May 2022
1 answer
835 views

Hi Team,

We are using Telerik reporting service license and have developed reports but our reports are not having excel export option, however the same is working with the trial version of the product in our local environment. but not with the licensed version.

We are using Asp.Net core version 3.1.

We have tried below articles but no luck so far:

1. https://docs.telerik.com/reporting/using-reports-in-applications/dot-net-core-support

2. https://docs.telerik.com/reporting/knowledge-base/missing-docx-xlsx-pptx-xps-export-options

3. https://www.telerik.com/forums/telerik-report-only-have-pdf-excel-and-word-are-missing

Any urgent help will be appreciated.

 

Thanks,

Markandey Pandey

 

 

 

Todor
Telerik team
 answered on 13 May 2022
1 answer
979 views

I have a dialog box that includes a date picker for an expiry date field that is null be default.

If I select an expiry date say a year into the future, close the dialog box and reopen it, the calendar in the datepicker opens to my last selected date instead of today's date.

Is there anyway to force the calendar to always open to today if a date is not set in the datepicker instead of remembering its last position.

It seems to me, I should be able to get the calendar component in the open event  of the datepicker and then set the initial date. Is that possible?

 

Thanks,

Charlotte

Alexander
Telerik team
 answered on 12 May 2022
1 answer
230 views

Hello,

I would like to return messages to the client whenever a grid create or edit action has completed successfully. I have tried adding to the Json being returned and using VeiwData/TempData but neither is a viable option with the ToDataSourceResult of the grid action methods. I can't seem to find any documentation on how I can achieve this. Please point me in the right direction. Below is an action method I converted from being a grid action to using my own modal editing but I'd like to use the built in grid popup instead.

        [HttpPost]
        public IActionResult Update([DataSourceRequest] DataSourceRequest request, CaseRequestVM vm, bool fromDashboard = false)
        {
            if (ModelState.IsValid)
            {
                bool caseRequestUpdated = _caseRequestService.UpdateCaseRequest(vm);
                if (caseRequestUpdated)
                {
                    TempData["Message"] = "Case request updated."; // ===> SHOW ON CLIENT
                }
                else
                {
                    TempData["Message"] = "Failed to update case request";
                }
            }
            else
            {
                TempData["Message"] = "Failed to update case request";
            }

            if (!fromDashboard)
                return RedirectToAction(nameof(Index));
            else
                return RedirectToAction("Dashboard", "Home");
        }

Stoyan
Telerik team
 answered on 11 May 2022
Narrow your results
Selected tags
Tags
+? more
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
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?