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

Hi,

What is the method for defining custom validation in a Form?  For example, in the Kendo UI for jQuery Form validation demo (https://demos.telerik.com/kendo-ui/form/validation) there is custom validation performed on the RetireDate to ensure that it's after the HireDate. However, the ASP.NET Core validation demo (https://demos.telerik.com/aspnet-core/form/validation)  contains no such validation.  Would it be possible to provide an example on how to perform this validation using ASP.NET Core?

Thanks,
Scott

Ivan Danchev
Telerik team
 answered on 21 Sep 2020
1 answer
509 views

Hello, 

I am currently in the process of localize a webapp. As I understood we're able to create custom localization files (either as a .js file or a .resx file) and use them to replace different labels from telerik components  (e.g 'Drag a column header and drop it here to group by that column' for grid grouping). The localization also includes the formatting of dates and currencies (basically the '.kendo.culture' -js for dates and formatting and the '.kendo.messages' for labels). 

My first question:

Is there a differene between creating a custom .js localization file or a custom .resx file(best practise, usability etc)? Most demos/example just using .js files for the localization and a few tutorials recommend to modifiy the .resx file, so I'm a bit confused. 

Second question:

Is there any way to use a localization file for 'hard strings' inside a html? Basically my ViewModel includes some properties which are displayed directly in a .cshtml file with a key before the property itself. 

For example :

<div>Firstname: @Model.Firstname</div>

 

My goal is to create multiple localization files that includes the key e.g "Firstname" and display it based on the current culture. 

Something like this

<div> @GetLocalizationStringWithWhatever("firstname") : @Model.Firstname </div>
// Result :
// If culture 'German' = <div>Vorname : Joe </div>
// if culture 'France' = <div>Prénom : Joe </div>
// if culture 'Italien' = <div>Nome di battesimo : joe </div>

 

There are probably multiple ways to achieve my goal (e.g safe the keys in a json and read it based on the current culture etc) but im curious if theres anyway to use the telerik (custom) localization files because I need them anyway and I'll be able to use one way to localize my entire webapp. I've tried to find something like that in demos/examples but it seems like theres no example yet. Is it possible?

 

Third question :

This question is very similar to my second question but basically my ViewModel got a few Date properties which are displayed directly in my .cshtml file. Currently I'm displaying them like this:

@Model.RandomDateVariable.Value.ToString("dd.MM.yyyy HH:mm");

The problem is the Dateformat won't change if the culture changes. The grid for example changes the dateformat if the culture changes and I want to achieve something similar directly inside a cshtml file. Again it seems like theres no demo/example/tutorial on how to achieve something like that. Is it possible?

 

Thanks in advance!

Greetings!

Aleksandar
Telerik team
 answered on 21 Sep 2020
1 answer
68 views

Hi,

I wonder if it is possible to show the number of records in the group in the group header in brackets or parentheses?

For example: 
Type: Box (10) --> It should be the group label in the grid.

See the picture attached for details.

Nikolay
Telerik team
 answered on 21 Sep 2020
1 answer
256 views

Hi,

I have a grid where the user can create groups by dragging the title of the column. This grid is paged by 20 records, but it can be changed, there are 5 different page sizes.

When the user creates a group, it will show only the 20 records for the group. But, I expect that when the user collapses the group, it brings the next group and shows the next 20 records from the next group. Is this possible? Nowadays, it just collapses the current group and leaves an empty space. See the picture attached.

 

 

Eyup
Telerik team
 answered on 21 Sep 2020
1 answer
469 views

   Hello, I have a grid that uses ClientTemplates to display the name associated with an id. When grouping, the id shows instead of the specified name. Is there any way to fix this to group by the selected text from the dropdown created in the ClientTemplate rather than the associated id?

 

Grid

@(Html.Kendo().Grid<BCGS.Classes.BCGSSite>
    ()
    .Name("sites")
    .Columns(columns =>
    {
        columns.Bound(s => s.SiteName).HeaderHtmlAttributes(new { @style = "font-weight:bold" }); ;
        columns.Bound(s => s.DistrictDisplayName).Title("District").HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.CountyId).Title("County").ClientTemplate("#=CountyName#").HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.Active).ClientTemplate("#= Active? 'Yes' : 'No' # <value ='#= Active #' />").HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.SiteCategoryId).Title("Category").ClientTemplate("#=CategoryName#").HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.SpecialtyId).Title("Speciality").ClientTemplate("#=SpecialtyName#").HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.Address1).Title("Address 1").HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.Address2).Title("Address 2").HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.City).HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.State).HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Bound(s => s.PostalCode).Title("Zip Code").HeaderHtmlAttributes(new { @style = "font-weight:bold" });
        columns.Command(command => { command.Edit(); command.Destroy(); }).Width(240);
    })

    .Groupable(g => g.Enabled(true))
    .ToolBar(toolbar =>
    {
        toolbar.Search();
        toolbar.Excel();
        toolbar.Create();
    })
    .Excel(excel =>
    excel.FileName("Sites.xlsx")
    .ProxyURL(Url.Action("Excel_Export_Save", "Grid"))
    .AllPages(true))
    .Sortable()
    .Pageable()
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .DataSource(source => source
    .Ajax()
    .PageSize(50)
    .Events(events => {
        events.Error("error_handler");
        events.Sync("update");
    })
    .Model(model =>
    {
        model.Id(s => s.SiteID);
        model.Field(s => s.SiteName).Editable(true);
        model.Field(s => s.DistrictDisplayName).Editable(false);
        model.Field(s => s.SiteCategoryId).Editable(true);
        model.Field(s => s.CountyId).Editable(true);
        model.Field(s => s.Active).Editable(true).DefaultValue(true);
        model.Field(s => s.Address1).Editable(true);
        model.Field(s => s.Address2).Editable(true);
        model.Field(s => s.City).Editable(true);
        model.Field(s => s.State).Editable(true);
        model.Field(s => s.PostalCode).Editable(true);
        model.Field(s => s.SpecialtyId).Editable(true);
    })
    .Create(create => create.Action("SiteEdit", "Admin"))
    .Update(update => update.Action("SiteEdit", "Admin"))
    .Destroy(destroy => destroy.Action("SiteDelete", "Admin"))
    .Read(read => read.Action("SiteGrid", "Admin"))
    )
    )

 

EditorTemplate

@model BCGS.Classes.BCGSSite

@(Html.Kendo().DropDownListFor(m => m)
                    .DataTextField("CountyName")
                    .DataValueField("CountyId")                  
                    .AutoBind(false)
                    .HtmlAttributes(new { data_value_primitive = "true"})
                    .OptionLabel(" ")
                    .BindTo((System.Collections.IEnumerable)ViewData["counties"]))

 

Thank you,

Megan

Neli
Telerik team
 answered on 18 Sep 2020
2 answers
1.1K+ views
Is there a way to conditionally hide/show items in a form?  In my form I have a dropdown list with a Change handler.  Based on the item selected in the list, I either want to display the Budget field or the HourlyMin and HourlyMax fields.  I'm not sure how to do this.
items.Add()
    .Field(p => p.Budget)
    .Label(label => label.Text("Budget"));
items.Add()
    .Field(p => p.HourlyMin)
    .Label(label => label.Text("Hourly Min"));
items.Add()
    .Field(p => p.HourlyMax)
    .Label(label => label.Text("Hourly Max"));

 

 

Thanks!

n/a
Top achievements
Rank 1
 answered on 16 Sep 2020
2 answers
117 views

If my main process is 12345 will this control accommodate the real-life process that does a 13245 once in a while?  I don't want step 3 to require step 2 to be finished step 2 may be outstanding.  On the extreme, can all 5 steps be independent of each other?  

So, what I'm saying is that instead of the process taking steps all the time; sometimes it trips.

Joel
Top achievements
Rank 2
Bronze
Iron
Iron
 answered on 15 Sep 2020
1 answer
234 views

Hey,

In our application we have a few bootstrap-style columns (i.e. a div with class "row" and 3 nested divs with class "col-4"). These are placed inside a Kendo-Tabstrip-Control.

At first we used the Bootstrap-v4 Theme and everything worked out nicely, however, we now switched to a (customized but this does not matter) Default-Theme and noticed that bootstrap-style columns inside a tabstrip always cause an overflow by a few pixels (8 to be exact). This causes a horizontal scrollbar to appear within the tabstrip-content only when using the Default Theme, but not when using the Bootstrap Theme.

Using my Browsers HTML-Viewer, I tracked it down to the fact that in Bootstrap-v4, the padding of .k-tabstrip > .k-content elements is set to 0.5rem 1rem (amounting to 8px 16px) while in the default theme it is set to 6px 12px which clearly amount to 4px of additional room on the sides (in sum, the afforementioned 8px).

Since the class "row" causes a margin of -15 on either side, this causes the entire row to overflow the k.content element which is the reason for the horizontal scrollbar.

This behavior is really easy to test, simply drop the following code as content into a kendo-tabstrip

<div class="row">
    ABC
</div>

 

Is this an error in the Default-theme and if so can we get this fixed?
Otherwise, is there any way to get consistent behavior with something like "row" and "col-" classes when using Kendo?

Best Regards

Dimitar
Telerik team
 answered on 15 Sep 2020
4 answers
969 views

 Hello,

is it possible to add a button to upload files inside the Form?

Is it possible to integrate this code

@(Html.Kendo().Upload()         
   .Name("files")           
   .HtmlAttributes(new { aria_label = "files" })
)

into this one

@(Html.Kendo().Form<TicketModel>()
    .Name("formExample")
    .HtmlAttributes(new { action = "TicketExpress", method = "POST" })
    .Items(items =>
    {
      items.Add()
        .Field(f => f.Description)
        .Label(l => l.Text("Description:"));
items.Add()
        .Field(f => f.Type)
        .Label(l => l.Text("Type:"))
        .Editor(e =>
        {
            e.Upload() ??????????
        }
})

Thank you

Mattia
Top achievements
Rank 2
 answered on 08 Sep 2020
4 answers
176 views

Hello,

we have a Grid that is bound to an IEnumerable Property of the ViewModel being supplied by the server as you can see in the following code snippet:

01.@(Html.Kendo().Grid<AktionsTracker.Pages.PromotionEditModel.ModelDTO>(Model.Promotion.Models)
02.    .Name(ModelGrid)
03.    .Columns(c =>
04.    {
05.        c.ForeignKey("ModelId", Model.Models, "ModelId", "ModelCode").Title("Modellcode").Width(100);
06.        c.ForeignKey("ModelId", Model.Models, "ModelId", "ModelName").Title("Modellbezeichnung").Width(200);
07.        c.Bound(m => m.Absolute).Width(150);
08.        c.Bound(m => m.Relative).Width(150);
09.        c.Command(c => c.Edit());
10.        c.Command(c => c.Destroy());
11.    })
12.    // more code
13.    .DataSource(c =>
14.    {
15.        c.Custom()
16.        .Schema(s =>
17.        {
18.            s.Model(m =>
19.            {
20.                m.Id("ModelId");
21.                m.Field("ModelId", typeof(int)).Editable(false);
22.                m.Field("Absolute", typeof(Decimal?));
23.                m.Field("Relative", typeof(Decimal?));
24.            });
25.        });
26.    })
27.)

We now want to programmatically insert a new record with a specific Id (guaranteed to be unique and have an entry in the ForeignKey-Collections) and directly put the Row into Edit-Mode.

At first, we tried to simply call grid.addRow() and handle the beforeEdit event to set the ModelId but this did not work out since the ModelId has to be non-Editable.

Therefore, we have resorted to a different approach where we execute the following code in a javascript function:

1.var grid = $("#@ModelGrid").data("kendoGrid");
2.grid.dataSource.add({ ModelId: value, Absolute: null, Relative: null });
3.grid.editRow($("#@ModelGrid tbody tr:last-of-type"));

i.e. we add the pre-filled record to the datasource of the grid and manually start the editing via the call to editRow.

The problem is the following:

  • Record is added and edit-mode is entered
  • We manually set the required properties and press the Update button
  • We press the Edit button on the same row
  • We press Cancel to end the editing without saving changes => as a result the row disappears even though it has been previously saved!

It does not matter how often we have update the record with valid data, as soon as we press Cancel the record will disappear every time.
I want to reiterate that it is fine and *intended* that the row disappears if Cancel is clicked directly after adding the row. However, having it disappear after multiple succesfull updates is not what we want at all.

How can we fix this behaviour?

Best Regards

Wolfgang Weilguny
Top achievements
Rank 1
Veteran
 answered on 08 Sep 2020
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?