Telerik Forums
UI for ASP.NET Core Forum
5 answers
594 views

The last example on this page breaks if you attempt to open it after a filtering and removing the filter.

the filter object is undefined

https://docs.telerik.com/kendo-ui/api/javascript/ui/combobox/events/filtering

After fixing this issue I get an unresponsive combobox the first time after the combobox is cleared and it loses focus.

I would like the combobox to only filter when at least 3 letters are entered, and open each time the user clicks regardless of if there is any data.

The combobox:

<kendo-combobox for="PersonId"
                                    filter="Kendo.Mvc.UI.FilterType.Contains"
                                    clear-button="true"
                                    placeholder="Search Name of Person"
                                    enforce-min-length="true"
                                    datatextfield="Name"
                                    datavaluefield="PrimaryId"
                                    min-length="3"
                                    suggest="true"
                                    class="w-100"
                                    on-filtering="CancelEmptyFilter"
                                    auto-bind="false">
                        <datasource type="Kendo.Mvc.UI.DataSourceTagHelperType.Ajax" server-paging="true" server-filtering="true" on-request-end="DataSourceError" page-size="100">
                            <transport>
                             </transport>
                        </datasource>
                    </kendo-combobox>

The JS function:

function CancelEmptyFilter(e) {
        console.log(e);
        if (!e.filter || !e.filter.value) {       
            e.preventDefault();
            return;
        }      
    }

Video Below

Petar
Telerik team
 answered on 17 Dec 2019
2 answers
162 views

I cannot find any examples / documentation on how to format the column filtering input for Core ASP.net.

For example I have a column which is called ID. It is filterable but I want it formatted so that :
1 - It does not have the spinner

2 - After entering a value it does not reformat it from Integer to Decimal with a thousands separator. For example 1234 become 1,234.00 The current code I have is:

@(Html.Kendo().Grid<CIPHRChecks.Models.Order>()
            .Name("Grid")
            .HtmlAttributes(new { @class = "ChecksGrid" })
            .Columns(columns =>
            {
                columns.Bound(o => o.Id).Title("ID").Format("{0}").Width(200).Filterable(f => f.Cell(cell => cell.ShowOperators(false)));
                columns.Bound(o => o.OrderDate).Title("Order Date").Format("{0:dd/MM/yyyy}").Width(80);
                columns.Bound(o => o.Source.Name).Title("Source").Width(80).Filterable(ftb => ftb.Multi(true).Search(true));

                columns.Bound(o => o.OrderStatus.Description).Title("Status").Width(200);
                columns.Bound(o => o.Service.Name).Title("Service").Width(200);
                columns.Bound(o => o.SourcePersonReference).Title("Reference").Width(120).Filterable(f => f.Multi(false).Cell(cell => cell.ShowOperators(false)));
                columns.Bound(o => o.SourcePersonDescriptor).Title("Descriptor").Width(200).Filterable(f => f.Multi(false).Cell(cell => cell.ShowOperators(false)));
            })
                .Pageable(p =>
            {
                p.PageSizes(new[] { 15, 25, 50 });
            })

            .Sortable(sortable => sortable
            .SortMode(GridSortMode.MultipleColumn))
            .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
            .Scrollable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .Read(read => read.Action("Read", "Home")
            )
                .PageSize(15)
            )
)

Simon
Top achievements
Rank 1
 answered on 17 Dec 2019
2 answers
1.5K+ views

Hello,

 

I have a grid and I'm disabled  the row that has the approved  FALSE, but when I check Select All it checks also the disabled row.

 

(Html.Kendo().Grid<WhereAbouts.ViewModels.LoginUserViewModel>
                                    ().
                                    Name("Team")
                                    .Columns
                                    (columns =>
                                    {
                                        columns.Select().Width(50);
                                        //columns.Bound(c=>c.InsertDate);
                                        columns.Bound(c => c.BadgeNumber).ClientFooterTemplate("<button onclick='getCheckedRows()'  class='k-button k-button-icontext k-grid'>Approve</button>");
                                        columns.Bound(c => c.FullName);
                                        columns.Bound(c => c.NumberOfHours).Filterable(false);
                                        columns.Bound(c => c.Approved).Filterable(false).Title("Status");
                                        columns.Bound(c => c.ApprovalManagerId).Hidden(true);
                                        columns.Bound(c => c.Id).Title(" ").ClientTemplate("<a role='button' class='k-button k-button-icontext k-grid' href='" + Url.Action("Overtime", "Overtimes") + "?=#=" + @ViewBag.PeriodIdForGrid + "#&loginId=#=Id" + "#" + "&DropDownPeriodWeek=#=" + @ViewBag.PeriodWeekIdForGrid + "#" + "'>View</a>").Filterable(false);
                                        columns.Bound(c => c.Id).Title(" ").ClientTemplate(
                                        "# if (NumberOfHours > 0) { #" +
                                        "<a role='button' class='k-button k-button-icontext k-grid' href='" + Url.Action("Export_Teams_Overtime", "Overtimes") + "/#=Id#?DropDownPeriod=#=" + @ViewBag.PeriodIdForGrid + "#" + "'>Export</a>" +
                                        "# } else { #" +
                                        "<a role='button' disabled class='k-button k-button-icontext k-grid' href='" + Url.Action("Export_Teams_Overtime", "Overtimes") + "/#=Id#?DropDownPeriod=#=" + @ViewBag.PeriodIdForGrid + "#" + "'>Export</a>" +
                                        "# } #").Filterable(false);
                                        columns.Bound(c => c.Id).Title(" ").ClientTemplate("# if (Approved == true ) { #" +
                                        "<a role='button' class='k-button k-button-icontext k-grid' href='" + Url.Action("ApproveTeamOvertime", "Overtimes") + "/#=" + @ViewBag.PeriodIdForGrid + "#?loginId=#=Id" + "#" + "' disabled>Approve</a>" +
                                        "# } else if(ApprovalManagerId ==" + @ViewBag.LoginUserId + "){ #" +
                                        "<a role='button' class='k-button k-button-icontext k-grid' href='" + Url.Action("ApproveTeamOvertime", "Overtimes") + "/#=" + @ViewBag.PeriodIdForGrid + "#?loginId=#=Id" + "#" + "'disabled>Approve</a>" +
                                        "# } else{ #" +
                                        "<a role='button' class='k-button k-button-icontext k-grid' href='" + Url.Action("ApproveTeamOvertime", "Overtimes") + "/#=" + @ViewBag.PeriodIdForGrid + "#?loginId=#=Id" + "#" + "'>Approve</a>" +
                                        "# } #").Filterable(false);
                                    })

                                        .HtmlAttributes(new { style = "height: auto;width:auto" })
                                        .Scrollable()
                                        .Pageable(pageable =>
                                        {
                                            pageable.Refresh(true);
                                            pageable.PageSizes(true);
                                        })
                                        .HtmlAttributes(new { style = "height: auto;width: auto" })
                                        .Scrollable()
                                        .Events(e=>e.DataBound("test"))
                                        .DataSource(dataSource => dataSource
                                        .Ajax()
                                        .Model(model =>
                                        {
                                            model.Id(c => c.Id);
                                        })
                                        .Read(read => read.Action("Read_Team_Test", "OverTimes", new { periodId = @ViewBag.PeriodIdForGrid, periodWeekId = @ViewBag.PeriodWeekIdForGrid, tab = 1 }))
                                        )

 

This is the JS

 

    function test(e) {
        var grid = this;
        this.tbody.find('tr').each(function () {
            var dataItem = grid.dataItem(this);
            if (dataItem.Approved === false) {
                $(this).addClass('disable-cells');

            }
        })
    }

 

I would like to select all rows except the disabled one.

 

Is it posible?

Also, might help if I can disable the Select All from header.

 

Thank you!

Simona
Top achievements
Rank 1
 answered on 16 Dec 2019
1 answer
140 views

Other than dependencies that a user/team would have to get a Kendo UI license, are there any issues with starting a opensource project based on asp.net core, but also include a dependency on the kendo ui library?

 

Missing User
 answered on 16 Dec 2019
2 answers
202 views

Hi,

I want to be able to toggle the expand/collapse state of a node but I can't see how to tell what it's current state is.

Basically, when a user clicks on a node, if that node has children and it's collapsed, expand it. If it's expanded, then collapse it.

Seems simple enough, but right now it's over my head.

Any help would be great!

Thanks … Ed

 

Ivan Danchev
Telerik team
 answered on 13 Dec 2019
1 answer
67 views

I followed all of the instructions to install Telerik into my existing ASP.NET Core 2.1 application and it all worked fine. The application compiled fine and came up in the browser, but when the Index page loaded the date picker did not work and was just a simple text box. I did not miss any of the steps from what I can see, so I'm not sure why this would not be working.

I'm using Visual Studio 17, and this is an ASP.NET Core 2.1 application.

I'm evaluating Telerik to see if it will be a fit for my needs. The controls look great, but I need to get them working to test this out.

Any help or advice would be greatly appreciated.

Ivan Danchev
Telerik team
 answered on 12 Dec 2019
6 answers
2.3K+ views

I have kendo grid, which has 1000+ records. I want to select row which is present in page 33.  I achieve this 

....
$scope.grid = $("#grid").data("kendoGrid");

var index = $scope.grid.dataSource.indexOf(rowData);
var page = Math.floor(index / $scope.grid.dataSource.pageSize());
$scope.grid.dataSource.page(++page);

var targetIndex = index - (page * $scope.grid.dataSource.pageSize());
var row = $("#grid").find("tr:eq(" + targetIndex + ")");
$scope.grid.select(row);
$scope.grid.content.scrollTop($(row).position().top);
...

The above code working perfectly. Then I'm trying to apply global search which is filters data, but nothing shown in the user interface.

function applyGlobalFilter(gridData, searchText) {
     gridData = $filter('filter')(gridData, searchText);
     $scope.grid.dataSource.data(gridData);
}

Thanks in advance

Georgi
Telerik team
 answered on 12 Dec 2019
2 answers
169 views

I'm trying to select which tab is active when the screen is loaded Here's the code I'm using but it doesn't work. Neither tab is selected when the tab strip is loaded.

<div class="col-sm-offset-3 col-md-offset-3">
    @(Html.Kendo().TabStrip()
    .Name("tabstrip")
    .TabPosition(TabStripTabPosition.Top)
    .Collapsible(true)
    .Navigatable(false)
    .Animation(animation =>
    {
        animation.Open(config =>
        {
            config.Fade(FadeDirection.In);
        });
    })
    .Items(items =>
    {
        items.Add().Text("Contact").LoadContentFrom("EditContact", "People", new { id = Model.person.Id }).Selected("@Model.tab" == "Contact");
        items.Add().Text("Address").LoadContentFrom("EditAddress", "People", new { id = Model.person.Id }).Selected("@Model.tab" == "Address");
    })
    .Events(e => e.Activate("onActivate"))
    )
</div>

Tom
Top achievements
Rank 1
 answered on 12 Dec 2019
1 answer
374 views

What's the syntax for this as this doesn't seem to work?

 

 <editable enabled="true" mode="popup" template="/Features/Shared/EditorTemplates/FileUploadForm.cshtml" />

Nikolay
Telerik team
 answered on 11 Dec 2019
3 answers
104 views

I am using an editor to save pieces of text in an application. With that editor i have a save and cancel button. When pressing the cancel button it checks for any changes between the editor and the loaded in value (this value is stored in an hidden input, gathered from the database). 

When I insert an image using the ImageBrowserController with the editor, it automatically adds the alt="" text to the image tag. In Chrome this tag is always placed at the end of the image tag, however in IE11 it seems that when using the editor, the tag is placed in the front of the image tag. This causes the two values to not be identical. It means that the loaded value has the alt text on the left but the editor the alt text is on the right of the image tag.

Is this a bug or is there something I can do about this?

 

In summary:

IE11 changes the way the image tag is loaded in the editor compared to Chrome. In Chrome the alt attribute is placed after the source and in IE11 it's placed before the source. When I save a piece of text with an image in Chrome and then open it in IE11 and press Cancel, it detects it as a change, even though I didn't change anything myself.

Veselin Tsvetanov
Telerik team
 answered on 10 Dec 2019
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?