Questions on UI for ASP.NET Core Forum

1 answer

302 views

Asp.Net core Stepper - Select event not triggered when page loads

I have this stepper that I am forcing the selection to index 2.

-- this is the script part

$(document).ready(function () {
var stepper = $("#meetingSessionStepper").data("kendoStepper");
stepper.select(2);

});

function onSelectStep(e) {

----- This is not triggered when the page loads

}

--- this is the control

@(Html.Kendo().Stepper()
.Name("meetingSessionStepper")
.Linear(false)
.Orientation(StepperOrientationType.Horizontal)
.Steps(s =>
{
s.Add().Label("Preparation");
s.Add().Label("Start Lesson");
s.Add().Label("Attendance");
s.Add().Label("Session Notes");
s.Add().Label("End Lesson");
})
.Events(events => events.Select("onSelectStep"))
)

But for some reason, my event method onSelectStep is not being triggered when the page loads. This method though is triggered when manually clicking the step from the stepper control.

Stepper

answered on 27 May 2020

8 answers

235 views

Document Processing Libraries support .Net Core 2.0

General Discussions

answered on 27 May 2020

7 answers

2.4K+ views

Make Bool Column CheckBox and Yes/No

Can you tell me how to template my IsActive column to a CheckBox column. I also want the option of having it show text Yes/No instead of True/False.

@(Html.Kendo().Grid<Person>()

.Name("grid")

.Columns(columns =>

{

columns.Command(command => command

.Custom("Detail")

.Click("goDetail"))

.Width(Glossary.Portal.ButtonWidth);

columns.Bound(p => p.FirstName)

.Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")

.ShowOperators(false)

.SuggestionOperator(FilterType.Contains)));

columns.Bound(p => p.LastName)

.Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")

.ShowOperators(false)

.SuggestionOperator(FilterType.Contains)));

columns.Bound(p => p.IsActive);

})

.Pageable()

.Sortable()

.Scrollable()

.Filterable(ftb => ftb.Mode(GridFilterMode.Row))

.HtmlAttributes(new { style = "height:550px;" })

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.Read(read => read.Action("IndexJson", "Users")

.Data("getData"))

))

<script type="text/javascript">

function getData() {

return @Html.Raw(Model.GetIndexData());

}

...

Grid

answered on 27 May 2020

7 answers

502 views

Edit List of Values in Inline Grid

I am using the grid to display some fields. one of the field is to display the List of usernames. I am able to display the List of user names using ClientTemplate. But Iam facing the issue while editing or adding new row. While displaying I bind the column with usenameList and pass the same in function used for ClientTemplate. While display it's working fine. but when I click on Edit/Add New it's throwing javascript error as usenameList is undefined. my requirement to to display the lit of users with option to delete them and a buuton add new user. I didn't find he option to crate a templete to sho while editing like ClientTemplate for dispaly.

.Columns(columns =>
    {
        columns.Bound(p => p.Name);
        columns.Bound(p => p.someId);
        columns.Bound(p => p.discontinue).
        columns.Bound(p => p.userList).Title("Approvers").ClientTemplate("#=userTemplate(userList)#").Sortable(false);
        columns.Command(command => { command.Edit().UpdateText("Save"); command.Destroy(); })
    })

function userTemplate(data) {
        this.approvers = "";
        data.forEach(element => {
            this.approvers += "<tr> <td style='width: 30 %; font-weight: bold'>" + element.userID+ "</td> <td>" + element.Display Name +</td></tr>";
        });
        return "<table>" + this.approvers + "</table>";
    }

The Edit Column in grid looks like the attched. Please let me know how to do it

Grid

answered on 27 May 2020

3 answers

2.1K+ views

Column.ClientTemplate iterate over collection?

I have found a couple solutions online if you want to use a detail view under a row in the grid control, but that is not exactly what I am looking for. I have a ASP.NET Core 2 solution and I want to be able to display "tags" that can be links in the column itself without having to do a detail drill-in. Nothing I have done to this point has worked.

The ArtcleViewModel has a List property of Tags. Is this impossible or am I missing something? Any help to create links per tag is appreciated without the use of a drill in detail view that the user would need to click to see.

@(Html.Kendo().Grid<MBIntranet.Web.ViewModel.ArticleViewModel>()

.Name("grid")

.Columns(columns =>

{

columns.Bound(c => c.Title).Title("Title");

columns.Bound(c => c.User.DisplayName).Title("Author");

columns.Bound(c => c)

.ClientTemplate("#= data.Tags[0].Name #")

.Title("Tags");

Grid

answered on 26 May 2020

1 answer

154 views

Custom command color class not effect

Hi to all,

I'm trying to set k-success into a custom command but it's not effect, qhy?

My definitions

columns.Command(command => command.Custom("Conforme").Visible("isCompleted").Click("validContact")).HtmlAttributes(new { @class = "k-success" });columns.Command(command => command.Custom("Non Conforme").Visible("isCompleted").Click("notValidContact")).HtmlAttributes(new { @class = "k-danger" });

I attach the effect

Grid

answered on 26 May 2020

1 answer

111 views

Hide dinamically button

Hi to all,

I need to hide a button base a model's view.

But I can't do this.

hide() and show() methods seems wrong.

Button

answered on 26 May 2020

1 answer

655 views

Icon only Update/Cancel commands for inline editing

Hi,

I am using .net core tag helpers to display a grid with inline editing.

I am able to display Icon only commands for Edit and Delete. But I am struggling to find any documentation to customize the same behaviour for Update/Cancel

<kendo-grid name="grid" height="550" resizable="true">

<datasource page-size="100" type="DataSourceTagHelperType.Ajax" server-operation="true" name="dataSource" batch="true">

<transport>

<read url="/Test/read" type="post" />

<update url="/Test/create" />

<destroy url="/Test/delete" />

<create url="/Test/create" />

</transport>

<schema>

<model id="Id">

<fields>

<field name="FirstName">

<validation required="true" />

</field>

<field name="LastName"></field>

<field name="Email"></field>

</fields>

</model>

</schema>

</datasource>

<sortable enabled="true" />

<filterable enabled="true" extra="false">

<operators>

<string eq="Is equal to" contains="Contains" startswith="Starts with" neq="Is not equal to" />

</operators>

</filterable>

<pageable button-count="5" refresh="true" page-sizes="new int[] { 10,20 }" />

<editable mode="inline" />

<columns>

<column width="75">

<commands>

<column-command name="edit" template="#=edittemplate(data)#">

</column-command>

<column-command name="destroy" template="#=deletetemplate(data)#"></column-command>

</commands>

</column>

<column field="FirstName" title="FirstName" width="50"></column>

<column field="LastName" title="LastName" width="50"></column>

<column field="Email" title="Email" width="75"></column>

</columns>

</kendo-grid>

edittemplate = function (data) {

var template = '<button type="button" class="k-button k-button-icon"><span class="k-icon k-i-update"></span></button>';

return template;

};

Grid

answered on 25 May 2020

2 answers

249 views

Trouble installing ASP.Net Core 3.1

Hi,

Im trying to setup Kendo with an existing application in order to do a demo for a Client

I followed this guide
https://docs.telerik.com/aspnet-core/getting-started/first-steps#configuration

Everything is added but Im getting a runtime error whenever I try to start the application

Here is some information

The application is on Core 3.1
http://i.imgur.com/2b4ppyf.png

The version nuget is getting is

<PackageReference Include="Telerik.UI.for.AspNet.Core" Version="2016.3.914" />

The application is compiling but as soon it tries to had the Kendo to the container Im getting this issue

http://i.imgur.com/K7j2NGM.png

I'm using VSCode on linux
http://i.imgur.com/M7Am1Fi.png

I saw some post about trial version not being compatible with 3.1 but I am not on trial.

Let me know what we are doing wrong.

Cheers

Installer and VS Extensions

answered on 22 May 2020

1 answer

224 views

Data is too long in bar chart and pie chart.

Hello Support,

I have facing some issue in bar chart. Actually data is too long in chart so i have assign category axis maximum showing 10 records but each record exits on many data so my graph is not open in zoom mode.

Can you please suggest how i can solved this problem? we are using asp.net core not jquery.I have attached some screenshots

Another requirement, how to add feature zoom in zoom out on button click not mouse scrolling of google chrome zoom in zoom out using.

Please respond ASAP.

Chart

answered on 22 May 2020