Hi,

I would like to get Telerik feedback on the best way to override the delete grid function.

We are using a grid with inline editing but on the delete we need to capture extra data.

We are are doing right now:

1. Listening for the on remove event
2. event prevent default
3. launch a dialog to capture extra data
4. user confirm or not
5. if user confirm we delete
6. if user cancel we cancel

Everything is working good but I would like to get recommandation on how to prevent the row to disapear from the frontend ONLY WHEN the user confirm.

Right now as soon the delete command is clicked and we reach the on remove the row is already removed from the frontend.

here is code samples we have

the grid with the onremove

The onremove js  stopping the event and launching how dialog

if user cancel that s what we have (the row is re showing) 

I tried the setup an onclick event on the delete command

But somehow the function is never called

The grid is capable of because when i setup the built in confirmation dialog on the row is staying in the UI until a choice is made.

other option would be to build my own delete button but I want to ask you guys before moving forward.

Let me know what is your recommended to proceed with all that logic being the exact same but without row getting away while user is making his choice.

Cheers

Is this intended behaviour or a bug ?

In the Scheduler demo on your site (https://demos.telerik.com/aspnet-core/scheduler/index)

Screenshot 1

Add a recurring daily event that starts in the past sometime. My example: yesterday. 

Screenshot 2

Change one of the items in the past, so there is a recurrence exception for that day. My example: yesterday.

Then drag drop one of the events (on a future date) so it starts later in the day.  My example: tomorrow.
When the option comes up choose "Edit the series".

Screenshot 3
It then wipes out the previous events so in my example I have lost today and yesterday.

I assume that it is updating the start date of the event and emptying the recurrence rule, which is why this is happening, however it doesn't seem right to me.

I just want to change the event to start later for the whole series, I don't expect it to change the start date and remove recurrence exceptions.

Thank you.

Hi,

I have a sub-grid where only a few columns are editable (InCell/batch mode).

I'm trying to display and update aggregate values for a calculated field/column.

I have tried 2 approaches, but got stuck with both:

1) Using the ViewModel

I have added calculated field to my ViewModel class

This does allow me to define an aggregate value for TotalAmount in the DataSource section, and that displays correctly initially.

But if I modify Quantity or UnitCost (both editable columns in the grid, using InCell editing), the value of TotalCost doesn't get updated accordingly. 

Can I force a refresh of the contents of the row and the aggregate values (e.g. in onSave() function?) *without* saving the edits, and if so: how?

2) Using a calculated column

Following the instructions of your colleague in this post: 

https://www.telerik.com/forums/asp-net-kendo-ui-grid-calculated-column

... I defined a Template-type column with calculated values.

But that value doesn't get updated either when I change the values of Quantity or UnitCost.

Furthermore, I don't know if it's possible to define/display aggregate values for a column of type Template?

Appreciate your help,

Erik

As a result a "select group by" statement, i got a resultset that looks like image in Data.jpg

Can i get a visualisation of query result similar in attached image Chart.jpg using donut chart?

Hello,

when i user colorField and user group in DataSource the color result is different  like image i attached

you can see here

https://dojo.telerik.com/aBOWINak

    group: {
                field: "symbol"
            },

            sort: {
                field: "date",
                dir: "asc"
            },

            schema: {
                model: {
                    fields: {
                        date: {
                            type: "date"
                        }
                    }
                }
            }
        });

        function createChart() {
            $("#chart").kendoChart({
                title: { text: "Stock Prices" },
                dataSource: stocksDataSource,
                series: [{
                    type: "column",
                    field: "close",
                    categoryField: "date",
                    name: "#= group.value # (close)",
                    colorField:"color"
                }],
                legend: {
                    position: "bottom"
                },

     Hi

I am looking at the scheduler: https://demos.telerik.com/aspnet-core/scheduler/index and I am wondering when you double click in a day box (on the month view) a "event" dialog comes up. 

How does the start/end get populated. I understand if I click June 3rd box it will populate it with that date. I am guessing it is using the "DateTimePicker" but I am not sure how the correlation works.

I am after not having the "all day" even being checked and I would like to set a default time to the picker.

Hi all,

I don't know how to use template with the popup edit mode and the tag helpers.

I did not found any help in the documentation.

Is it possible ?

<kendo-grid>

    <editable mode="popup" template="???" />

</kendo-grid>

Hi All,

I Have a page with  two different grids. A Parent grid and a child grid. Through JS i use the change event of the grid to refresh the datasource of the second grid (to view the child entries). I only want one row at a time to be selected. First i used the single selection mode, but i was not able to clear the selection bu clicking somewhere else in (whitespace of the the grid) or on that row again. SO i moved to checkbox selection. THis works like a charm (also un-selecting), but it allows for multiple rows to be selected. Is there any way (built in or (js) hack) to do this?

My grid:

                @(Html.Kendo().Grid<PortSupervisor.ViewModels.Worklist.BookingsViewModel>()
        .Name("Bookingsgrid")
        .Sortable()
        .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("BookingsEditor").Window(w=>w.Title("Insert/edit booking")))
        .Scrollable()
        .Selectable(s=>s.Mode(GridSelectionMode.Single))
        .Events(events =>
        {
            events.Change("onBookingsgridChange");
            events.Save("onSave");
        })
        .ToolBar(x =>
        {
            x.Create().Text("Add new Booking");
        })
        .Columns(columns =>
        {
            columns.Select().Width("2rem").ClientHeaderTemplate(" ");
            columns.Bound(c => c.ContainerNumber);
            columns.Bound(c => c.BookingReferenceOperator).Title("Ref. Operator");
            columns.Command(column =>
            {
                column
                    .Edit()
                    .Text(" ")
                    .IconClass("fa fa-edit")
                    .UpdateText("Save")
                    .UpdateIconClass(" ")
                    .CancelText("Cancel")
                    .CancelIconClass(" ")
                    .HtmlAttributes(new { data_tippy_content = "Edit" });
                column.Destroy().IconClass("fa fa-trash").Text(" ").HtmlAttributes(new { data_tippy_content = "Delete" });
            });
        })
        .DataSource(ds => ds.Ajax()
            .Events(events => events.Error("function(args){telerikGridErrorhandler(args,'Bookingsgrid');}"))
            .Read(r => r.Url("/Worklist/Journey/Bookingsgrid?handler=Read").Data("JourneyIdTokenAndVars"))
            .Update(u => u.Url("/Worklist/Journey/Bookingsgrid?handler=Update").Data("JourneyIdTokenAndVars"))
            .Create(c => c.Url("/Worklist/Journey/Bookingsgrid?handler=Create").Data("JourneyIdTokenAndVars"))
            .Destroy(d => d.Url("/Worklist/Journey/Bookingsgrid?handler=Destroy").Data("JourneyIdTokenAndVars"))
            .Model(m => {
                m.Id(field => field.BookingId);
                m.Field(field => field.BookingId).Editable(false);
            })
            .PageSize(5)
        )
        .Pageable()
        .Height("29rem")
    )

Hi,

We are building grids for client using only tag helper.

I am trying to apply this solution showing only icon for commands buttons

https://docs.telerik.com/kendo-ui/knowledge-base/grid-icon-only-buttons

  <column  width="200">
                        <commands>
                            <column-command text=" " name="edit"></column-command>
                            <column-command text=" " name="destroy"></column-command>
                        </commands>
                    </column>
                </columns>

I tried to find the correct syntax taghelper without success

Hello,

I am using kendo grid in ASP.net core. I have a grid on a view and as long as I don't scroll horizontally I can resize the columns.  Once I move the horizontal scrollbar just a little the resize handle moves also.  Instead of finding it on the line between the columns it is found over in the column header area.  Any idea what I am missing here? I did a search on the forum and I found it was a bug on old version but mine is update to last version.

<div class="row">
    <div class="col col-md-offset-11 mt-3 suite-projects-grid" data-archive-mode="false">
        @(Html.Kendo().Grid<Models.WebProject>
            ()
            .Name("suite-projects-grid")
            .Columns(columns =>
            {
                columns.Bound(p => p.name)
                        .ClientTemplate("# if (name != null) { #<a href='../project/#=name#/#=_id#'>#=name#</a># } else { #" + "" + "# } #")
                        .Title(Localizer.Text("Project Name")).Filterable(true);
                columns.Bound(p => p.created_date).Title("Created date").Format("{0: dd/MM/yyyy}").Filterable(false).Width(200);
                columns.Bound(p => p.model_count).Title("Revit File(s)").Width(120).Filterable(false).Sortable(false);
                columns.Bound(p => p.job_count).Title("Work Order(s)").Width(100).Filterable(false).Sortable(false);
                columns.Bound(p => p.panel_count).Title("Panel(s)").Width(100).Filterable(false).Sortable(false);
                //columns.Command(command => command.Custom("menu").Template("<i class='fas fa-bars'></i>").Click("showDetails")).Width(100);
                columns.Bound(p => p.archived)
                        .ClientTemplate("# if (!archived) { #<button class='btn btn-default' title='Archive Project'><i class='fas fa-file-archive'></i></button># } else { #<button class='btn btn-default' title='UnArchive Project'><i class='far fa-file-archive'></i></button># } #")
                        .HtmlAttributes(new { @class = "k-grid-archiveProject text-center" })
                        .Title(" ").Filterable(false).Width(70);
                columns.Command(command => command.Custom("PurgeProject").Text(" ").HtmlAttributes(new { @class = "btn-default", title = "Purge Project" })
                        .IconClass("fas fa-trash").Click("purgeProject")).Width(65);
                columns.Command(command => command.Custom("ManageProjectsUsers").Text(" ").HtmlAttributes(new { @class = "btn-default", title = "Manage Projects Users" })
                        .IconClass("fas fa-user").Click("manageProjectUsers")).Width(50);

            })

            .Sortable()
            .Filterable()
            .Resizable(resize => resize.Columns(true))
            .Pageable(pager => pager
                .Input(true)
                .Numeric(false)
                .Refresh(true)
            )
            .Scrollable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(100)
                .ServerOperation(false)
                .Events(events =>
                {
                })
                .Model(model =>
                {
                    model.Id(p => p._id);
                })
                .Read(read => read.Action("ProjectsPartial", "Project").Data("gerArchiveParam"))
            )
        )
    </div>
</div>