Telerik Forums
UI for ASP.NET Core Forum
0 answers
20 views

In our UI for ASP.NET Core R3 2020 (2020.3.915) release, the Column menu message of unsticking a column is "null".

This bug will be resolved in our next official release.

In the meantime, as a workaround, manually set the Unstick Column menu message:

.ColumnMenu(c => c.Messages(m => m.Unstick("Unstick Column")))
Kendo UI
Top achievements
Rank 1
 asked on 16 Sep 2020
0 answers
135 views

Installer and VS Extensions for ASP.NET Core

Visual Studio Integration Overview
A new article on how to enhance your experience in developing web applications with ASP.NET Core.

Downloading New Versions
A new article on how to keep your projects updated when using Telerik UI for ASP.NET Core.

Creating Projects
A new article on how to create a new Telerik UI for ASP.NET Core application.

Kendo UI
Top achievements
Rank 1
 asked on 20 Jan 2017
0 answers
2 views

In asp.net core I would like to refresh a grid form combobox.

 

Here my code but not working

 

<div class="k-content">
    @(Html.Kendo().ComboBox()
              .Name("periods")
              .HtmlAttributes(new { style = "width:100%;" })
              .DataTextField("Description")
              .DataValueField("NoPeriod")
              .Placeholder("Choisir une période")
              .Filter(FilterType.Contains)
              .SelectedIndex(0)
              .DataSource(source =>
              {
                  source.Read(read =>
                  {
                      read.Action("PeriodList_Read", "TimeSheet");
                  });
              })
            .Events(e =>
            {
                e.Change("onAssigneeChange");
            })
        )
</div>

<div class="k-content">

    @(Html.Kendo().Grid<ProKontrolTimeSheet.Models.TimeSheetItemVIEW>()
        .Name("TimeSheetGrid")
        .Reorderable(reorder => reorder.Columns(true))
        .Mobile()
        .Columns(columns =>
        {
            //columns.Select().Width(50);
            columns.Bound(p => p.NoTimeSheet).HtmlAttributes(new { id = "NoTimeSheet", style = "display : none" });
            columns.Bound(p => p.Journee).Width(125).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Debut);
            columns.Bound(p => p.Fin).Width(150).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Contract).Width(150).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Project).Width(150).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Category).Width(150).HtmlAttributes(new { style = "text-align:center" });
            columns.Bound(p => p.Emplacement).Width(150).HtmlAttributes(new { style = "text-align:center" });

        })
        .Scrollable(s=> s.Virtual(true))
        .HtmlAttributes(new { style = "height:750px;"})
         .Sortable(sortable => sortable
          .AllowUnsort(true)
          .SortMode(GridSortMode.MultipleColumn)
          .ShowIndexes(true))
        .DataSource(dataSource => dataSource
            .Ajax()
            .GroupPaging(false)
            .PageSize(50)
            .Batch(true)
            .AutoSync(true)
            .ServerOperation(false)
            .Read(read => read.Action("TimeSheetPeriod_Read", "TimeSheet").Data("additionalInfo")
            )
         )
    )
</div>
<script>
    var NoPeriod = 0
    function onAssigneeChange(e) {
        NoPeriod = e.sender.value();
        $("#TimeSheetGrid").dataSource.Data("additionalInfo").read();
    }


    function additionalInfo() {
        return {
            PeriodId: NoPeriod
        }
    }
</script>
Robert
Top achievements
Rank 1
 asked on 06 May 2021
0 answers
3 views

I have created a ViewComponet that contains a Kendo textbox.

		public async Task<IViewComponentResult> InvokeAsync(ModelExpression aspFor)
		{
			return View("MyView", new MyModel(){AspFor = aspFor ... });
		}

My AspFor when it gets to the view is an instance of a ModelExpression, but the Kendo controls are expecting a string for the "Expression()" method.

How do I bind this Kendo control to the instance of the ModelExpression?

The TextBoxFor isn't happy and attempting to convert the ModelExpression instance back to its string doesn't result in HTML that contains all of the proper attributes on it.

Thanks

-Cam

A
Top achievements
Rank 1
Iron
 asked on 05 May 2021
1 answer
7 views

I try to use the number format #.### that should display

7 as 7

7.123678 as 7.124

7.4 as 7.4

, however is not the case...

cells.Add()
.VerticalAlign(SpreadsheetVerticalAlign.Center)
.Format("#.###");
displays 7. for 7, is there a way to fix the Excel bug and remove the dot, when there are any decimal ?

 

Ivan Danchev
Telerik team
 answered on 05 May 2021
1 answer
10 views

I have the following Grid configuratrion


                    @(Html.Kendo()
        .Grid<CoucheSondageDTO>()
        .Name("CoucheSondages")
        .Columns(columns =>
        {
            columns.Bound(c => c.CoucheDescription).Width(190).ClientTemplate("<div style='background: #=CoucheCouleur#'>#=CoucheDescription#</div>"); ;
            columns.Bound(c => c.ToitTN).Width(120);
            columns.Bound(c => c.BaseTN).Width(120);
            columns.Bound(c => c.Description).Width(120);
            columns.Command(command => { command.Destroy(); }).Width(150);
        })

it gives me this:

 

Is there a way to color the ful row , or the whole cell content?

Ivan Zhekov
Telerik team
 answered on 05 May 2021
1 answer
11 views

The controller is definitely being hit and it is returning data in the format I was expecting. I have javascript in the "RequestEnd" and I am seeing data there. There are no errors or warnings (that pertain to the listview) in the browser's developer console. The pager shows up but says there are zero records. I have been tossing code at this for waaaaay too long.

Any suggestions? Please.....

 

Controller:

[HttpPost] [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)] public async Task<IActionResult> UserProfiles_Search([DataSourceRequest] DataSourceRequest request) { Logger.LogInformation("In UserProfiles_Search");

// dummy data var data = new List < UserProfile >(){ new UserProfile() { Title = "Mrs", FirstName = "Joanne", LastName = "Welch", EmailAddress = "joanne.welch@example.com", Id = Guid.Parse("3c7b201d-9744-4807-bd53-192251fb6e60") }, new UserProfile() { Title = "Miss", FirstName = "Florence", LastName = "Lawrence", EmailAddress = "florence.lawrence@example.com", Id = Guid.Parse("6691697e-faa5-41ec-89b0-b6a040be8d2d") }, new UserProfile() { Title = "Mrs", FirstName = "Stella", LastName = "Laurent", EmailAddress = "stella.laurent@example.com", Id = Guid.Parse("87cf6fef-0d9e-4fea-bbca-b48d9f478c61") }, new UserProfile() { Title = "Ms", FirstName = "Sharida", LastName = "Broeren", EmailAddress = "sharida.broeren@example.com", Id = Guid.Parse("d58fcf47-88ac-4753-8d08-3cbf0318c13d") }, new UserProfile() { Title = "Mr", FirstName = "William", LastName = "Liu", EmailAddress = "william.liu@example.com", Id = Guid.Parse("688fff10-e522-4267-a061-5553c627689e") }, new UserProfile() { Title = "Ms", FirstName = "Brielle", LastName = "Clark", EmailAddress = "brielle.clark@example.com", Id = Guid.Parse("00fa0fa0-494f-44e5-9bb2-5fbcea156eb7") }, new UserProfile() { Title = "Miss", FirstName = "تارا", LastName = "زارعی", EmailAddress = "tr.zraay@example.com", Id = Guid.Parse("3a7ddd17-33a3-489a-91b9-48055eefb55e") }, new UserProfile() { Title = "Mr", FirstName = "Necati", LastName = "Karadaş", EmailAddress = "necati.karadas@example.com", Id = Guid.Parse("33c54e50-7297-4af0-914c-484f182d0e52") }, new UserProfile() { Title = "Ms", FirstName = "Elizabeth", LastName = "Craig", EmailAddress = "elizabeth.craig@example.com", Id = Guid.Parse("6841bcec-6662-473e-9b1a-d5f533ab01d8") }, new UserProfile() { Title = "Mr", FirstName = "Karl", LastName = "Gordon", EmailAddress = "karl.gordon@example.com", Id = Guid.Parse("43ec6d51-5b3e-4e6d-ae78-4394234950b4") }, new UserProfile() { Title = "Mrs", FirstName = "Gretel", LastName = "Bender", EmailAddress = "gretel.bender@example.com", Id = Guid.Parse("54dab09c-1d6f-4544-aa23-0fb74f3f12c9") }, new UserProfile() { Title = "Mrs", FirstName = "Francelina", LastName = "Nunes", EmailAddress = "francelina.nunes@example.com", Id = Guid.Parse("3c62214b-c797-4cdb-9623-cbc51ec8a86f") }, new UserProfile() { Title = "Monsieur", FirstName = "Oskar", LastName = "Berger", EmailAddress = "oskar.berger@example.com", Id = Guid.Parse("4687147c-8630-4018-afb8-52cdb0e1937a") }, new UserProfile() { Title = "Miss", FirstName = "Emilie", LastName = "Carpentier", EmailAddress = "emilie.carpentier@example.com", Id = Guid.Parse("8b11fb43-93da-470c-bc1a-eddce87a3ecc") }, new UserProfile() { Title = "Mrs", FirstName = "Florence", LastName = "King", EmailAddress = "florence.king@example.com", Id = Guid.Parse("f203e0b7-ebe3-4a72-b82e-c910b9daa3fd") } }; var resultData = await data.ToDataSourceResultAsync(request); return Json(resultData); }

 

Index.cshtml

@using SaskPower.DSS.CSRTools.Models.Models
@using SaskPower.DSS.CSRTools.Models.ViewModels
@model ProfileSearchViewModel
@{
	Layout = "";
}
<html>
<head>
	<title>Test page</title>

	<link rel="stylesheet" href="~/lib/kendo/styles/kendo.common.min.css" />
	<link rel="stylesheet" href="~/lib/kendo/styles/kendo.bootstrap.min.css" />
	<link rel="stylesheet" href="~/lib/kendo/styles/kendo.bootstrap-v4.css" />

	<script language="javascript" type="text/ecmascript" src="~/lib/kendo/scripts/jquery.min.js"></script>
	<script language="javascript" type="text/ecmascript" src="~/lib/kendo/scripts/jszip.min.js"></script>
	<script language="javascript" type="text/ecmascript" src="~/lib/kendo/scripts/kendo.all.min.js"></script>
	<script language="javascript" type="text/ecmascript" src="~/lib/kendo/scripts/kendo.aspnetmvc.min.js"></script>
	<script language="javascript" type="text/ecmascript" src="~/lib/kendo/scripts/cultures/kendo.culture.en-CA.min.js"></script>
	<script language="javascript" type="text/ecmascript" src="~/lib/kendo/scripts/messages/kendo.messages.en-CA.min.js"></script>
	<script language="javascript" type="text/ecmascript" src="~/lib/bootstrap/dist/js/bootstrap.min.js"></script>
</head>
<body>
	<script type="text/x-kendo-tmpl" id="userProfileSearchResultItem">
		<div class="userProfileSingleResult">
			<div class="name">#:firstName# #:lastName#</div>
			<div class="email">#:emailAddress#</div>
			<div class="id">#:id#</div>
		</div>
	</script>
	<div class="profile-search">
		<div class="result-count"></div>
		<div class="results">
			@(Html.Kendo().ListView<UserProfile>()
				.Name("userProfileSearchResults")
				.TagName("div")
				.ClientTemplateId("userProfileSearchResultItem")
				.DataSource(dataSource => dataSource
					.Ajax()
					.Model(m => m.Id(p => p.Id))
					.PageSize(25)
					.Read(read=>read.Action("UserProfiles_Search", "Home"))
					.ServerOperation(false)
					.Events(evt => evt
						.RequestEnd("userProfileRequestEnd")
					)
				)
				.AutoBind(true)
				.Pageable(pager => pager
				.ButtonCount(10)
				.Numeric(true)
				.Enabled(true)
			)
		)
</div>
	</div>
	<script type="text/javascript" language="javascript">
		function userProfileRequestEnd(event) {
			console.log("in userProfileRequestEnd");
			$(".profile-search .result-count").html("" + event.response.data.length + " profiles found");
		}
	</script>
</body>
</html>

 

Model:

	public class UserProfile
	{
		public Guid Id { get; set; }
		public string Title { get; set; }
		public string FirstName { get; set; }
		public string LastName { get; set; }
		public string EmailAddress { get; set; }
	}

 

Thanks

-Cam

A
Top achievements
Rank 1
Iron
 answered on 04 May 2021
1 answer
4 views

We are setting up a new razor page using ListView following this sample (https://docs.telerik.com/aspnet-core/html-helpers/data-management/listview/binding/razor-page), with onChange event and all is working as expected.

We wanted to incorporate Grouping as well (https://demos.telerik.com/aspnet-core/listview/grouping) bringing in the grouping jQuery, .AutoBind(false), template, and css. When selecting a card, it selects the outside group, not the individual cards. Does anyone know if grouping and selecting individual cards are supported in Razor? If so, can someone provide some insight?


    $(function () {
        var groupDetails = {
            field: 'RoomDescription',
            dir: 'desc',
            compare: function (a, b) {
                if (a.items.length === b.items.length) {
                    return 0;
                } else if (a.items.length > b.items.length) {
                    return 1;
                } else {
                    return -1;
                }
            }
        }
        var listView = $("#listview").data("kendoListView");
        //var listView = $("#listView").data().kendoListView;
        var dataSource = listView.dataSource;
        dataSource.group(groupDetails);
    });

@(Html.Kendo().ListView<spRoomAvailabilityResult>()
    .Name("listview")
    .TagName("div")
    .ClientTemplateId("template")
    .Selectable(ListViewSelectionMode.Single)
    .Events(events => events.Change("onChange").DataBound("onDataBound"))
    .AutoBind(false)
    .DataSource(ds => ds
        .Ajax()
        .Model(model => {
            model.Id(p => p.ROOMID);
        })
        .Read(read => read.Url("/MyWebPage?handler=Read").Data("forgeryToken"))
    )
)

<script>
    function forgeryToken() {
        return kendo.antiForgeryTokens();
    }

    $(document).ready(function () {
        var listView = $("#listview").data("kendoListView");

        $(".k-add-button").click(function (e) {
            listView.add();
            e.preventDefault();
        });
    });
</script>
<script>
    function onChange(arg) {

        var selected = $.map(this.select(), function (item) {
            return $(item).text();
        });

        alert(selected);
    }
</script>


<script type="text/x-kendo-template" id="template">
    <div class="k-listview-item">
        <h4 class="k-group-title">#= data.value #</h4>
        <div class="cards">
            # for (var i = 0; i < data.items.length; i++) { #
            <div class="k-card" style="width: 15em; margin:2%">
            <div class="k-card-body">
                    <h4 class="k-card-title">#= data.items[i].ROOMNUMBER #</h4>
                    <h5 class="k-card-subtitle">Capacity: #= data.items[i].CAPACITY #</h5>
                </div>
            </div>
            # } #
        </div>
    </div>
</script>
Any insight would be appreciated. Thank you!

Tsvetomir
Telerik team
 answered on 04 May 2021
2 answers
12 views

Hi there,

I have a custom command column in my grid, as follows...

.Columns(columns =>
{
    columns.Bound(b => b.Created_DisplayString);
    columns.Bound(b => b.Closed_DisplayString);
    columns.Command(command => command.Custom("Close or ReOpen").Click("onCloseReOpen"));
})

 

My viewmodel has a (readonly) property that returns either "Close" or "ReOpen" (as appropriate)

public string CloseOrReOpen
{
    get
    {
        return (Closed_DateTime.HasValue ? "ReOpen" : "Close");
    }
}

 

How can I bind the text of the Command button to this property pls. (instead of the current "Close or ReOpen")?

Thx,

Erik

Aleksandar
Telerik team
 answered on 03 May 2021
1 answer
8 views

Hi,

I am struggling to use core UI wizard with respect to my requirement. What I need from wizard control is to provide navigation (Next, Previous), load partial views and submit data to a form. Following is an example;

 

<form>

Step 1

Partial View 1

Step 2

Partial View 2

Finish (Form submission)

 

 

 

Ivan Danchev
Telerik team
 answered on 03 May 2021