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

I don't think I'm alone in saying that it would be nice to see better docs, maybe even an entire separate section for this library that was Raorpages-specific.  

Would be nice to see such things as:
- Client template examples
- Different ways of loading & customizing the grid
- Common problems and their solutions


Petar
Telerik team
 answered on 09 Jan 2020
1 answer
267 views

I recently upgraded my project to ASP NET Core 3.2 and now my grids are returning undefined.  I've found a couple threads about this, but nothing that has worked for me so far.  I have an enumerable defined object that I'm creating in my AJAX LoadData method to load my data and returning.  What am I doing wrong?

 

index.cshtml

<ejs-grid id="Grid" allowPaging="true" allowSorting="true" allowFiltering="true">
    <e-data-manager url="/Routes/LoadData" updateUrl="/Routes/UpdateData" adaptor="UrlAdaptor"></e-data-manager>
    <e-grid-columns>
        <e-grid-column field="Name" headerText="Name" allowSorting="true"></e-grid-column>
        <e-grid-column field="Frequency.Name" headerText="Frequency" type="string"></e-grid-column>
        <e-grid-column field="DayOfWeek.Name" headerText="Day" type="string"></e-grid-column>
        <e-grid-column field="TimeOfDay.TimeString" headerText="Time"></e-grid-column>
        <e-grid-column field="RouteId" headerText="" template="#edittemplate"></e-grid-column>
    </e-grid-columns>
</ejs-grid>

<script id="edittemplate" type="text/x-template">
    <div>
        <a rel='nofollow' href="/Routes/Edit/${RouteId}">Edit</a>&nbsp;|&nbsp;
        <a rel='nofollow' href="/Routes/Details/${RouteId}">Details</a>&nbsp;|&nbsp;
        <a rel='nofollow' href="/Routes/Delete/${RouteId}">Delete</a>&nbsp;
    </div>
</script>

 

 

Controller

        public IActionResult LoadData([FromBody]DataManagerRequest dm)
        {
            var sa = new JsonSerializerSettings();
            IEnumerable<Route> DataSource = _context.Route
                .Include(r => r.DayOfWeek)
                .Include(r => r.Frequency)
                .Include(r => r.TimeOfDay)
                .ToList();
            DataOperations operation = new DataOperations();
            if (dm.Search != null && dm.Search.Count > 0)
            {
                DataSource = operation.PerformSearching(DataSource, dm.Search);  //Search
            }
            if (dm.Sorted != null && dm.Sorted.Count > 0) //Sorting
            {
                DataSource = operation.PerformSorting(DataSource, dm.Sorted);
            }
            if (dm.Where != null && dm.Where.Count > 0) //Filtering
            {
                DataSource = operation.PerformFiltering(DataSource, dm.Where, dm.Where[0].Operator);
            }
            int count = DataSource.Cast<Route>().Count();
            if (dm.Skip != 0)
            {
                DataSource = operation.PerformSkip(DataSource, dm.Skip);         //Paging
            }
            if (dm.Take != 0)
            {
                DataSource = operation.PerformTake(DataSource, dm.Take);
            }

            return Json(new { result = DataSource, count = _context.Route.Count() });
        }

Alex Hajigeorgieva
Telerik team
 answered on 09 Jan 2020
18 answers
623 views
I have looked all over the forums and I haven't been able to find a solution. I have attached some screenshot of the issues I keep encountering. This happens on only 3 of my charts which have long category names on the axis. I have tried some function and templates but have not been able to correct this. The issue only appears when exporting to pdf.
DC
Top achievements
Rank 1
 answered on 08 Jan 2020
2 answers
554 views

Have a razorpages app started and several areas of a view have various dropdowns etc that gather a users selections.  These selections are then used as inputs to grab data for a grid.  Ok, easy enough, my example is working so far.  However, so far I have only got to the point of LOADING my grid, now I need to handle updates/deletes etc.

Im looking over the examples, both frm the kendo project template and from this github project
https://github.com/telerik/ui-for-aspnet-core-examples/blob/master/Kendo.Examples.RazorPages/Kendo.Examples.RazorPages/Pages/Grid/GridCrudOperations.cshtml

Ok, some general questions and observations:

(1) These examples assume that criteria for getting the grid data is known at execution time.  In my case I need to gather several inputs before fetching the data for the grid.  Im doing this now, then loading the grid with json and javascript and it works.  However, now I need to handle updating/deleting etc
(2) What is the purpose of the .Data methods on the Datasource crud methods eg. and where is this Data method in the docs as used here?

.DataSource(ds => ds.Ajax()
        .Read(r => r.Url("/Index?handler=Read").Data("forgeryToken"))
        .Update(u => u.Url("/Index?handler=Update").Data("forgeryToken"))
        .Create(c => c.Url("/Index?handler=Create").Data("forgeryToken"))
        .Destroy(d => d.Url("/Index?handler=Destroy").Data("forgeryToken"))
        .Model(m => m.Id(id => id.OrderID))
    .PageSize(10)

(3) If I want to handle "batch" editing, AND I load the Dataset via JSON with javascript, how then does the .Read and other datasource method(s) need to change?
eg.  this example ,
https://demos.telerik.com/aspnet-core/grid/editing

so to load the product grid then

function testLoadDS() {
    var testObj = [{ "OrderID": "1", "Freight": "10.1", "OrderDate": "10/19/2019", "ShipCity": "Austin", "ShipName": "Test123" }];
    let productDS = $("#grid").data("kendoGrid").dataSource;
    productDS.data(testObj);
}

 

So then, this example, what things need to change from in-line to batch editing?
https://github.com/telerik/ui-for-aspnet-core-examples/tree/master/Kendo.Examples.RazorPages/Kendo.Examples.RazorPages/Pages/Grid

 


Tsvetomir
Telerik team
 answered on 08 Jan 2020
1 answer
376 views

In this example

https://demos.telerik.com/aspnet-core/grid/editing

How could one show a image button instead of a command type button for the delete function?

Also, similar to the last question - will this example work with partial page updates?  In other words will the updating of the grid cause the entire view its contained within to be refreshed?

Alex Hajigeorgieva
Telerik team
 answered on 07 Jan 2020
3 answers
591 views

I want to export the current sheet to xlsx and send it to the server. I use excel proxy to send the file to server. but when the server side process done. the ui will auto refresh. I want to receive the return value and not refresh the UI, how can I do this, please help.

 

server side code:

[HttpPost]
        public ActionResult Post()
        {
            try
            {
                var data = Request.Form;
                var file = data["base64"][0];
                var fileName = data["fileName"][0];
                var contentType = data["contentType"][0];
                byte[] buffer = Convert.FromBase64String(file);
                string filePath = FileHelper.MapPath("/wwwroot/UserUpload/" + fileName);
                FileStream fs = new FileStream(filePath, FileMode.CreateNew);
                fs.Write(buffer, 0, buffer.Length);
                fs.Close();
                return new JsonResult("OK");
            }
            catch (Exception e)
            {
                return new JsonResult("Fail");
            }
        }

Veselin Tsvetanov
Telerik team
 answered on 07 Jan 2020
1 answer
121 views

If one has a grid on a section of a page and follows the approach with inline editing, as in this example, will just the grid update and NOT the entire view?
https://demos.telerik.com/aspnet-core/grid/editing-inline

 

Alex Hajigeorgieva
Telerik team
 answered on 07 Jan 2020
4 answers
4.0K+ views

I have a grid that has an edit and a delete button.  I want to hide those buttons conditionally based on a specific value within the row.  How can I accomplish this?  For reference here is the current Grid create.

 

01.@(Html.Kendo()
02.      .Grid<CdEyeColor>()
03.      .Name("Codes")
04.      .DataSource(ds =>
05.      {
06.        ds.Ajax()
07.        .ServerOperation(true)
08.        .Model(m =>
09.        {
10.          m.Id(code => code.EyeColorId);
11.        })
12.        .Create(create => create.Action("CreateCode", "CdEyeColor"))
13.        .Read(read => read.Action("ReadCode", "CdEyeColor"))
14.        .Update(update => update.Action("EditCode", "CdEyeColor"))
15.        .Destroy(destroy => destroy.Action("DeleteCode", "CdEyeColor"));
16.      })
17.      .Columns(columns =>
18.      {
19.        columns.Bound(c => c.EyeColorTitle).Width(100);
20.        columns.Bound(c => c.EyeColorDescription).Width(200);
21.        columns.Bound(c => c.BeginDate).Width(100);
22.        columns.Bound(c => c.EndDate).Width(100);
23.        columns.Bound(c => c.changedByName).Width(150);
24.        columns.Bound(c => c.ChangedTimestamp).Width(200);
25.        columns.Bound(c => c.createdByName).Width(150);
26.        columns.Bound(c => c.CreatedTimestamp).Width(100);
27.        columns.Command(command =>
28.        {
29.          command.Edit().UpdateText("Update");
30.          command.Destroy();
31.        });
32.      })
33.      .ToolBar(toolbar => toolbar.Create())
34.      .HtmlAttributes(new { style = "height: 380px;" })
35.      .Scrollable()
36.      .Groupable()
37.      .Events(x => { x.Edit("onEdit"); x.Save("onGridSave"); })
38.      .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("EditorTemplateEyeColor").Window(window => { window.Title("Eye Color"); }))
39.      .Sortable()
40.      .Pageable(pageable => pageable
41.      .Refresh(true)
42.      .PageSizes(true)
43.      .ButtonCount(5))
44.)
Joel
Top achievements
Rank 2
Iron
Iron
Iron
 answered on 06 Jan 2020
3 answers
324 views

I have a razorpage with a grid and these methods on the DataSource.

 

                        .Update(u => u.Url("/Audit?handler=Update").Data("forgeryToken"))
                        .Create(c => c.Url("/Audit?handler=Create").Data("forgeryToken"))
                        .Destroy(d => d.Url("/Audit?handler=Destroy").Data("forgeryToken"))

 

For some reason when I edit a row, then hit update, I get a 400 error as the request is being made for Audit?handler=Create instead of the Update handler?

What can I check?

My Update handler
        public JsonResult OnPostUpdate([DataSourceRequest] DataSourceRequest request, ViewLineItemModel localOrder)
        {

            // get updated order from parameter
            // save updates to db

           //....
            // test
            JsonResult r = new JsonResult(localOrder);
            return r;
        }

BitShift
Top achievements
Rank 1
Veteran
 answered on 06 Jan 2020
1 answer
941 views

hello, I'm working through a trial of UI for .NET Core and not having much luck with a very simple task. I'm following the example in the demo for cascading dropdowns and I can't even get the first dropdownlist to load. It just shows a list of items marked Undefined.

 

Here's the code from the View (Create.cshtml):

 

 <div class="form-group">
                <label asp-for="CategoryID" class="control-label"></label>
                @(Html.Kendo().DropDownList()
             .Name("categories")
             .HtmlAttributes(new { style = "width:100%" })
             .OptionLabel("Select category...")
             .DataTextField("CategoryName")
             .DataValueField("CategoryID")
             .DataSource(source =>
                     {
                  source.Read(read =>
                         {
                      read.Action("LoadCategories", "Groups");
                  });
             })
                )
                <span asp-validation-for="CategoryID" class="text-danger"></span>
            </div>


            <div class="form-group">
                <label asp-for="SubcategoryID" class="control-label"></label>
                
                @(Html.Kendo().DropDownList()
              .Name("subcategories")
              .HtmlAttributes(new { style = "width:100%" })
              .OptionLabel("Select subcategories...")
              .DataTextField("SubcategoryName")
              .DataValueField("SubcategoryID")
              .DataSource(source =>
              {
                  source.Read(read =>
                  {
                      read.Action("LoadSubcategories", "Groups")
                          .Data("filterSubcategories");
                  })
                  .ServerFiltering(true);
              })
              .Enable(false)
              .AutoBind(false)
              .CascadeFrom("categories")
                )

                <span asp-validation-for="SubcategoryID" class="text-danger"></span>
            </div>

            <script>
                function filterSubcategories() {
                    return {
                        categories: $("#categories").val()
                    };
                }
            </script>

 

 

Here's the code from GroupsController.cs:

 

public JsonResult LoadCategories()
        {
            List<Category> categories = new List<Category>();

            var catQuery = from d in _context.Category
                             where d.IsActive
                             orderby d.CategoryName // Sort by name.
                             select d;


            categories = catQuery.ToList();

            return new JsonResult(categories);
        }

        public JsonResult LoadSubcategories(int? categories)
        {
            List<Subcategory> subcategories = new List<Subcategory>();

            var catQuery = from d in _context.SubCategory
                           where d.CategoryID == categories.GetValueOrDefault()
                           orderby d.SubCategoryName // Sort by name.
                           select d;


            subcategories = catQuery.ToList();

            return new JsonResult(subcategories);
        }

 

I get the same result when using code in GroupsController LoadCategories more similar to your demo source code:

return Json(_context.Category
                     .Select(c => new { CategoryID = c.CategoryID, CategoryName = c.CategoryName }).ToList());

 

 

Plamen
Telerik team
 answered on 02 Jan 2020
Narrow your results
Selected tags
Tags
+? more
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?