Telerik Forums
UI for ASP.NET Core Forum
2 answers
136 views

 

Using ASP.NET Core 3.1 Razor Pages

 

Page Model:

        public IList<Label> Label { get;set; }

        public async Task OnGetAsync()
        {

            Label = await _context.Labels
                .ToListAsync();

       }

Page: This renders no output at all on the Razor page even though debugging shows records in Model.Label.

I've also noticed that the standard table bound to the same data will work until this code is added to the page, it then also renders nothing. Other controls work fine.

@(

    Html.Kendo().Grid(Model.Label)
    .Name("label-grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.ProductId).Title("Item");
        columns.Bound(c => c.Template);
        columns.Bound(c => c.Family);
        columns.Bound(c => c.ProductLine);
        columns.Bound(c => c.EdgeDetail);
        columns.Bound(c => c.GridSize);
        columns.Bound(c => c.Size);
    })

)

Mark
Top achievements
Rank 1
 answered on 27 Mar 2020
2 answers
142 views

Hello,

I'm currentlty migrating a project to net core 3.1 and I have an issue with the ForeignKey column into a grid. Everything is fine with an another net version.

The issue is that if I try to have a ForeignKey column with a guid proprerty is not working properly, the dropdown is correctly populated so I can select the value I want but after the selection the cell is empty, the selected value has been successfuly sent to the server and if I try to display the grid items into the console the value is correct too but nothing is displayed.

And if I try to switch the type of the property from GUID to string, it's working.

The DataFieldValue and the DataFieldText are correct too.

Any ideas?

Thanks.

 

Pierre
Top achievements
Rank 1
 answered on 27 Mar 2020
8 answers
1.7K+ views

I have a grid very similar to the one in this example where I am using 3 different client templates to populate and bind 3 drop downs in my grid:

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

My dropdowns are:

  • Category
  • Department
  • Configuration

I have a business rule whereby if the user chooses one particular category then I need to set the Configuration drop down to it's first selection (which is 'NONE') and disable it so that the user is unable to change it. If the user chooses any other category, I need to re-enable that Configuration dropdown so that they can make a choice. How do I tackle this? 

Nikolay
Telerik team
 answered on 27 Mar 2020
1 answer
222 views
Is there a way to read a barcode from image in .net core?
Tsvetomir
Telerik team
 answered on 27 Mar 2020
4 answers
1.8K+ views

Hey,

So I've been using the asp.net core kendo and it is great but I cannot seem to get over one hurdle and that is the validation.

I have extended the kendo validation to include remote validation to check if a field name exists in the database already, that all works fine but the problem currently is that if I include the jQuery validation and jQuery unobtrusive validation into my scripts I would get 404 errors every time I type something into the text box (because the remote url passed down is different on unobtrusive than on kendo validation). I have attached an image of the 404 error I am getting.

But if I remove jQuery validation and jQuery unobtrusive I get no errors but because of the nature of razor pages the kendo remote validation does not register to the model and so even if the remote validation failed, the field is updated/added.

app.js

"use strict";
 
import gridFunctions from "./js/gridFunctions";
 
// Top level packages that need to be initiated first
import $ from "../node_modules/jquery/dist/jquery";
window.jQuery = $;
window.$ = $;
gridFunctions();
 
// Scss
import "./scss/app.scss";
 
// Add all kendo
import "@progress/kendo-ui";
import "@progress/kendo-ui/js/kendo.aspnetmvc";
import "@popperjs/core";
 
// Add jquery validation
import "jquery-validation/dist/jquery.validate";
import "jquery-validation-unobtrusive/dist/jquery.validate.unobtrusive";
 
// Add boostrap js
import "@popperjs/core/dist/cjs/popper";
import "bootstrap/dist/js/bootstrap.bundle";
 
// Add Font Awesome
import "@fortawesome/fontawesome-free/js/all";
 
$.validator.setDefaults({
    ignore: ""
});

 

Edit.cshtml

 <form method="post">
    <input type="hidden" asp-for="@Model.SystemRole.SystemRoleId" />
 
    @* Inputs *@
    <div class="row">
        <div class="col-sm-3">
            <div class="input-outer">
                <label asp-for="@Model.SystemRole.SystemRoleDesc" class="required"></label>
                <input asp-for="@Model.SystemRole.SystemRoleDesc"
                       data-val-remote-additionalfields="SystemRoleDesc"
                       data-val-remote-url="CheckSystemRoleDescExists"
                       class="k-textbox" />
                <span asp-validation-for="@Model.SystemRole.SystemRoleDesc"></span>
            </div>
 
            <div class="input-outer">
                <label asp-for="@Model.SystemRole.SystemRoleRef" class="required"></label>
                <input asp-for="@Model.SystemRole.SystemRoleRef"
                       data-val-remote-additionalfields="SystemRoleRef"
                       data-val-remote-url="CheckSystemRoleRefExists"
                       class="k-textbox" />
                <span asp-validation-for="@Model.SystemRole.SystemRoleRef"></span>
            </div>
 
            <div class="input-outer">
                <label asp-for="@Model.SystemRole.IsDeleted"></label>
                <input asp-for="@Model.SystemRole.IsDeleted" type="checkbox" data-validate="false" class="k-checkbox">
                <span asp-validation-for="@Model.SystemRole.IsDeleted"></span>
            </div>
        </div>
        <div class="col-sm-3"></div>
        <div class="col-sm-3"></div>
        <div class="col-sm-3"></div>
    </div>
 
    <hr />
 
    @* Buttons *@
 
    <input type="submit" value="Update" class="btn btn-primary" />
 
</form>
 

 

Any help is really appreciated! 

Thank you.

Aleksandar
Telerik team
 answered on 25 Mar 2020
10 answers
663 views

I am using the code below which works to show that icon but at a cost of causing another read action on the controller.  How can we show the sort icon in a column by default, indicating to the user what the current sort is?

 

var kendoGrid = $("#grid").data('kendoGrid');
var dsSort = [];
dsSort.push({ field: "ProductRoot.Name", dir: "asc" });        
kendoGrid.dataSource.sort(dsSort); 

 

 

 

Tsvetomir
Telerik team
 answered on 24 Mar 2020
1 answer
244 views

The grid definition in asp.net mvc core chtml

index.cshtml
@(Html.Kendo().Grid<COSalesDto>()

.Name("grid")

.Columns(columns => { columns.Bound(p => p.CatalogNumber); columns.Bound(p => p.UsageCode).Width(150); })

Pageable() .Sortable() .Filterable()

.DataSource(dataSource => dataSource

       .Ajax() .PageSize(20)

     .Read(read => read.Action("ChangeOrder_Read", "Naco"))

).Deferred() )  

Here is my data returned from ajax call

{ "Data": [ { "CatalogNumber": "Catalog 12345", "UsageCode": "Usage Code 1" }, { "CatalogNumber": "Catalog 8234758", "UsageCode": "Usage Code 2" } ], "Total": 0, "AggregateResults": null, "Errors": null }

all events are triggering on grid, but no data binding happening.  Here is my entry in startup

Startup.cs

services.AddControllersWithViews(options => { options.Filters.Add(new AbpAutoValidateAntiforgeryTokenAttribute()); })

.AddJsonOptions(options => { options.JsonSerializerOptions.PropertyNameCaseInsensitive = true; options.JsonSerializerOptions.PropertyNamingPolicy = null; }) 

Any help greatly appreciated.
Thanks V


Martin
Telerik team
 answered on 24 Mar 2020
1 answer
113 views

I have a kendo timeline in a razor page defined in a Razor Class Library.

it all works as expected when the RCL is referenced from an AspNet Core MVC project but nothing is generated or shown when referenced from a Razor Pages project. 

Am I missing something ?

NB: I am using one .cshtml file to render the page

Tsvetomir
Telerik team
 answered on 24 Mar 2020
1 answer
238 views

Hi

I am implementing the FileManager, but I have come across a problem. When the server side upload fails, this doesn't raise the Error event, instead controls swallows the error and dumps it to the console. If there server side fails, I would like to alert the user and give more details feedback, how could I accomplish this?

In the code below I have set the error method and the action method straight up throws an exception, i also tried this just returning StatusCode(500)

<div>
    @(Html.Kendo().FileManager()
        .Name("filemanager")
        .DataSource(ds =>
        {
            ds.ServerFiltering(true);
            ds.Read(operation => operation
                .Type(HttpVerbs.Post)
                .Action("ReadDocument", "Home")
                );
            ds.Destroy(operation => operation
                .Type(HttpVerbs.Post)
                .Action("DestroyDocument", "Home")
                );
            ds.Create(operation => operation
                .Type(HttpVerbs.Post)
                .Action("CreateDocument", "Home")
                );
            ds.Update(operation => operation
                .Type(HttpVerbs.Post)
                .Action("UpdateDocument", "Home")
                );
        })
        .UploadUrl("Upload", "Home")

       .Events(e => e
            .Error("onError")
        )
        )
</div>


<script>
    function onError(e) {
        console.log("there is an error");
        debugger;
      
    };
    function onOpen(e) {
        debugger;
    };
</script>

 

 

---controller---

[HttpPost]
        public IActionResult Upload(IFormFile file, string path)
        {
            throw new NotImplementedException("error");
        }

 

 

Ross

Veselin Tsvetanov
Telerik team
 answered on 24 Mar 2020
1 answer
107 views

Hello All,

I wish to seek your guidance on this question.  How do we post strong type to the controller? More specifically, can we post the selected data-item to the controller?

Here is the sample form:

<form asp-controller="home" asp-action="UpdateMenu" method="post">
    <!-- Input and Submit elements -->
    @(Html.Kendo().DropDownList()
          .Name("selectedOptions")
          .DataTextField("Name")
          .DataValueField("ID")
          .DataSource(source => {
              source.Read(read => {
                  read.Action("OptionList", "home");
              });
          })         
    )
     <button type="submit">Update</button>
</form>

 

Here is the controller:

[HttpPost]
public void UpdateMenu(Menu targetMenu, string[] selectedOptions)
{
    ....
}

 

I am able to get the selected ID to bind to the selectedOptions variable but no luck with the data-item object. 

Thank you for your time. 

Ivan Danchev
Telerik team
 answered on 23 Mar 2020
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?