Questions on UI for ASP.NET Core Forum

1 answer

328 views

How do I use a model as my List View datasource and add each List View entry to the model?

Hello,

I've searched forums and documentation and can't seem to find an example of how to do what I need. What I am trying to do is I need an editable List View on my page where I want to use my model as the data source (in memory only). Each time I save a record in the list view I want to add it to the model, then pass the contents of that same model to my server.

The List View will need to display all entries (update with each entry)

I need the data to persist in the model during the session.

Can anybody please point me to an example that does this in MVC C# .NET 6?

Thanks!

ListView

answered on 29 Jun 2023

1 answer

165 views

Grid Custom Popup Editor From Grid within Kendo Window (.NET Core) Displays within Window

Hi,

I have a Kendo Window that displays a grid. I want to use a custom Grid Popup Editor to maintain data in the grid. However, the editor doesn't pop up out of the window, but is added to the window, below the grid.

Is this expected behavior? If so, is there a way to override it so that the Popup Editor appears to display in its own window?

Thanks,

Taylor

Grid

answered on 29 Jun 2023

1 answer

245 views

Chunk Upload Server Validation

Good afternoon,

I'm using a chunk upload to upload files, some of which could be greater than 2GB.

When the user has selected a file I want to run a series of checks of the filename against a database before deciding whether to allow the upload to take place. If it fails that validation I want it to return a message to the view explaining why it failed.

I've set the Upload as follows:

        @(Html.Kendo().Upload()
            .Name("files")
            .HtmlAttributes(new { aria_label = "files"})
            .Enable(true)
            .Multiple(false)
            .Async(a => a
                .Save("Async_ChunkSave", "Source")
                .Remove("Async_Remove", "Source")
                .AutoUpload(true)
                .ChunkSize(4194304)
            )
            .Events(events => events
                .Upload("onUpload")
                .Complete("onComplete")
                .Error("onUploadError"))
        )

I'm using the Upload event to send some extra data from the view:

public async Task<ActionResult> Async_ChunkSaveAsync(IEnumerable<IFormFile> files, string metaData, string uploadData)

Am I right in thinking that although it has a foreach file in files, it will only be one file since chunkData.FileName can only be one file - presumably the same name as the file's.

                    if (files != null)
                    {
                        foreach (var file in files)
                        {
                            path = Path.Combine(fullFolderPath, chunkData.FileName);
                            AppendToFile(path, file);
                        }
                    }

Where is the best place to validate the filename against the database, before it starts handling some potentially very large files? And then return an appropriate error message to the View, and halt the upload?

Kind regards,

Richard

Upload

answered on 28 Jun 2023

2 answers

287 views

Differences between Create and Update actions

I have a MVC Core project which has a Grid. It is a hierarchal grid with a child grid. Combined they show your basic orders and history of orders. The grid fully populates and pages. My problems lie with the editing side of things.

I am using a pop up editor. A editor template is used and effectively gathers users edits. The update side of things works flawlessly. By this I mean you click Edit, the edit occurs, you press the save and the database gets updated. The update method receives the "model" values entered during the edit action. This is "as expected".

My problem exists with the Create action. Both the Update and Create use the same editor. Visually the Create editor accepts user input however when the "Create" action is called, the server method receives a model with null values for all the values entered. Not a single entered value is returned in the model. No errors are present in the developer console., non are occurring in any code I have control over. I simply cannot explain the lack of values in the model.

I have compared the "Request.Form" values in the Update vs Create methods. My Update methods request has FORM values in approximately 107 keyvalue pairs. When the Create methods are used it gets 47 items. Those 47 are all the default values of the model. (I added default values to the datasource model to test this. Those values arrive in the model, not the entered values)

Can anyone point me to the differences between the Update/Create actions? Can anyone point me to a path to find/solve my problem?

Thanks for any suggestions.

Grid

answered on 28 Jun 2023

0 answers

483 views

Add item for null / undefined values to ASP.NET Core Grid Filter Multi Checkboxes

Hi,

We have a Kendo Grid bound to a ViewModel with a string value that can be null. If we use NullValueHandling.Include in our MVC project Startup NewtonsoftJson.SerializerSettings:

.AddNewtonsoftJson(o =>
{
    o.SerializerSettings.ContractResolver = new DefaultContractResolver();
    o.SerializerSettings.NullValueHandling = NullValueHandling.Include;
})

this results in the null value being included in the Grid Multi Filter (see attached). If we use NullValueHandling.Ignore, this results in no value being included in the Grid Multi Filter and we can't filter on empty values. This seems odd, as the Grid is bound to a ViewModel which has the property declared on it. In KendoReact Grids, the value is correctly included in the Grid Multi Filter as 'undefined' when using NullValueHandling.Ignore e.g. https://stackblitz.com/edit/react-ycmafw?file=app%2Fproducts.json.

Is there any way to force the ASP.NET Core Grid to include the property as undefined?
If not, is there any way to add a custom item to the Grid Multi Filter list that will match undefined values?

Kind regards,

David

Filter

Grid

asked on 26 Jun 2023

1 answer

74 views

The lines on the chart are not the same color as the landmarks

currently i have a chart line and i have specified the color for each element in it from the store proc , but for some reason the lines connecting the timelines on the chart are different colors , only the The dot right at the landmark is the correct color I specified.
Here is my code

 @(Html.Kendo().Chart<Commsights.Data.DataTransferObject.DashbroadDataTransfer>()
                                                                .Name("LineChart_Customer_Processed")
                                                                .DataSource(dataSource => dataSource
                                                                .Read(read => read.Action("Chart_CountData_DaXuLyTolist", "Dashbroad").Data("FilterCompany"))
                                                                .Group(group => group.Add(model => model.CompanyName))
                                                                .Sort(sort => sort.Add(model => model.DatePublish).Ascending())
                                                                )
                                                                .Events(events => events.SeriesClick("onSeriesClick"))
                                                                .Theme("material")
                                                                .Series(series =>
                                                                {
                                                                    series.Line(model => model.ID_Count)
                                                                    .Name("#= group.value #")
                                                                    .Style(ChartSeriesStyle.Smooth)
                                                                    .CategoryField("DatePublish")
                                                                    .Tooltip(tooltip => tooltip
                                                                    .Visible(true)
                                                                    .Template("#= kendo.toString(category, 'MM/dd') # - #= value # (#= series.name # Article)"))
                                                                    .Width(3).Opacity(0.6)
                                                                   .ColorField("Color");
                                                                })
                                                                .Legend(legend => legend
                                                                .Position(ChartLegendPosition.Bottom)
                                                                )
                                                                .ValueAxis(axis => axis.Numeric()
                                                                .Labels(labels => labels
                                                                .Format("{0}")
                                                                .Skip(2)
                                                                .Step(2)
                                                                )
                                                                )
                                                                .CategoryAxis(axis => axis
                                                                .BaseUnit(ChartAxisBaseUnit.Days)
                                                                .Labels(labels => labels
                                                                .DateFormats(formats => formats.Months("MM/dd"))
                                                                .Rotation(-45)
                                                                )
                                                                )
                                                                .HtmlAttributes(new { style = "width: 100%; height: 400px;" })
                                                                )

Please help me!

Chart

answered on 23 Jun 2023

2 answers

202 views

how to change line color in linechart when dots and line color are not the same

here is my code

@(Html.Kendo().Chart<Commsights.Data.DataTransferObject.DashbroadDataTransfer>()
                                                                .Name("LineChart_Customer_Processed")
                                                                .DataSource(dataSource => dataSource
                                                                .Read(read => read.Action("Chart_CountData_DaXuLyTolist", "Dashbroad").Data("FilterCompany"))
                                                                .Group(group => group.Add(model => model.CompanyName))
                                                                .Sort(sort => sort.Add(model => model.DatePublish).Ascending())
                                                                )
                                                                .Events(events => events.SeriesClick("onSeriesClick"))
                                                                .Theme("material")
                                                                .Series(series =>
                                                                {
                                                                    series.Line(model => model.ID_Count)
                                                                    .Name("#= group.value #")
                                                                    .Style(ChartSeriesStyle.Smooth)
                                                                    .CategoryField("DatePublish")
                                                                    .Tooltip(tooltip => tooltip
                                                                    .Visible(true)
                                                                    .Template("#= kendo.toString(category, 'MM/dd') # - #= value # (#= series.name # Article)"))
                                                                    .Width(3).Opacity(0.6)
                                                                   .ColorField("Color");
                                                                })
                                                                .Legend(legend => legend
                                                                .Position(ChartLegendPosition.Bottom)
                                                                )
                                                                .ValueAxis(axis => axis.Numeric()
                                                                .Labels(labels => labels
                                                                .Format("{0}")
                                                                .Skip(2)
                                                                .Step(2)
                                                                )
                                                                )
                                                                .CategoryAxis(axis => axis
                                                                .BaseUnit(ChartAxisBaseUnit.Days)
                                                                .Labels(labels => labels
                                                                .DateFormats(formats => formats.Months("MM/dd"))
                                                                .Rotation(-45)
                                                                )
                                                                )
                                                                .HtmlAttributes(new { style = "width: 100%; height: 400px;" })
                                                                )

I used colorfield() to specify the color of the elements on the chart but I don't understand why the dots at the landmarks are the correct color I specified to load from the store proc, but the lines connect them together wrong color.
Pls help me.

Chart

answered on 22 Jun 2023

1 answer

854 views

How do I get the Thumbnail for the Images?

I am using the Image Browser in Kendo Editor for our Razor Pages and the images we upload are stored to a blob. But When I try to get the thumbnail using transport.thumbnail all I see is a loading wheel on the k-file-preview.
How do I get the thumbnail as a image preview instead of the spinning wheel.

Say I am uploading an Image - k-file-preview shows this link --> https://demos.telerik.com/aspnet-mvc/imagebrowser/thumbnail?path=thumbnail1.jpg
and upon insert the image into the editor the image url shows as --> https://demos.telerik.com/aspnet-mvc/content/userfiles/images/thumbnail1.jpg

does this mean we have thumbnails for the uploaded image stored in another folder, and upon calling thumbnail path it looks for the path n gives the preview??

then again for asp .net core i see k-listview-item i do not see a k-file-preview but on asp .net mvc and for jQuery I can see the thumbnail on demo --> https://demos.telerik.com/aspnet-mvc/editor/imagebrowser

Editor

answered on 20 Jun 2023

1 answer

1.0K+ views

Merge cells in a kendoGrid.

Hello good day.

I have a KendoGrid where there are two rows for each record, the first two fields are repeated, I would like to merge two cells and make a single row with them, but the rest of the fields belonging to those records remain in their two different rows.

I show how it looks right now:

I show how I want it to look:

Thank you so much.

Grid

answered on 20 Jun 2023

1 answer

382 views

Set DataSource to Razor page model

Hi, I want to create a shared data source that I can then apply filtering to. This data source should be initialised from a property on the Razor page model.

With a Grid you can do this:

Html.Kendo().Grid(Model.Devices)

But I can't figure out the equivalent for the DataSource. This is not allowed...

Html.Kendo().DataSource<DeviceAggregate>(Model.Devices)
.Name("devicesDataSource")

Grid

answered on 19 Jun 2023