This is my code.

@using apexanalytix.app
@using apexanalytix.app.HtmlHelperExtensions
@using FirstStrike.VendorPortal.SharedDataContracts.VendorProfile
@using Kendo.Mvc.UI
@using Portal.BusinessObjects.Common;
@inject VendorProfileHelper vendorProfileHelper
@inject SysSettingHelper sysSettingHelper

@{
    var currentCulture = System.Globalization.CultureInfo.CurrentCulture.ToString();
}
<script>
    $(function () {

        kendo.culture("en-US");
    });
</script>
<style>
    .rowHighlighter {
        background-color: #ff0000;
        color: #fff !important;
    }
        .rowHighlighter:hover {
            background-color: #e95652 !important;
            color: #fff !important;
        }
    .rowHighlighter.k-state-selected {
            background-color: #009ec9 !important;
        }
     .rowHighlighter.k-state-selected td{
            background-color: #009ec9 !important;
        }
        .rowHighlighter td a {
            color: #fff !important;
        }
    .k-filter-row label > input[type=radio] {
        vertical-align: middle;
        position: relative;
        bottom: 2px;
        margin-left: 3px;
        margin-right: 10px;
    }

    .k-dropdown-wrap {
        max-height: 27px;
    }

    .k-grid td {
        line-height: 1em;
    }

    .k-grid .k-grid-header .k-header .k-link {
        height: auto;
    }

    .k-grid .k-grid-header .k-header {
        white-space: normal;
    }

    .vendor-controls {
        cursor: pointer;
        margin: 0 auto;
        width: 20px;
        height: 1.2em;
        max-height: 1.2em;
        padding: 6px;
    }
</style>
<div style="display:none">
    <ul id="vendor-search-grid-context-menu">
        <li id="copyText">@Html.Raw("Copy Text".Translate())</li>
    </ul>
</div>
@{
    var excludedFieldSet = ViewBag.ExcludedFields as HashSet<string> ?? Enumerable.Empty<string>();
    var choosenColumns = ViewBag.ChoosenColumns as HashSet<string> ?? Enumerable.Empty<string>();
    var availableStatus = (System.Collections.IEnumerable)ViewBag.AvailableStatus;
    var moduleName = ViewBag.ModuleName;
    var registrationType = (System.Collections.IEnumerable)ViewBag.RegistrationType;

    int defaultGridSize = int.TryParse(ViewData["DefaultGridSize"]?.ToString(), out int gridSize) ? gridSize : 20;
    var partialViewPath = "~/Areas/Registration/Views/PartialViews/VenderProfilesAction.cshtml";

    var multipleEditWindowErrorMessage = "Cannot save vendor data with multiple windows open. Please edit one vendor at a time".Translate();
}
<div class="k-grouping-header" style="padding-top: 10px; border-color: var(--button-border-color); border-width: 1px; border-style: solid; border-radius: 3px;width: calc(100% - 50px)">
    @await Html.PartialAsync(partialViewPath)
</div>
@(Html.DataGrid<VendorSearchResult>(false)
    .Name("vendorProfileGrid")
    .HtmlAttributes(new { @style = "height: 500px;width: calc(100% - 50px)" })
    .Reorderable(r => r.Columns(true))
    .Selectable(selectable => selectable
        .Mode(GridSelectionMode.Multiple)
        .Type(GridSelectionType.Row))
    .Resizable(r => r.Columns(true))
    .Pageable(p =>
    {
        p.Refresh(true);
        p.PageSizes([25, 50, 75, 100, 1000, 5000, 10000]);
    })
    .Events(_ => { })
    .Columns(columns =>
    {
        columns.Bound(v => v.VR_Id).Title("VR ID".Translate()).ClientTemplate("#= VR_Id === 0 ? '' : VR_Id #").Width(180).Lockable(false).Locked(true).Filterable(f => f.Cell(cell => cell.Template("VendorProfile.decimalToIntFilter"))).Visible(vendorProfileHelper.IsVrIdDisplayInGrid && choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.VR_Id), StringComparison.OrdinalIgnoreCase))).HeaderHtmlAttributes(new { @class = "NumericHeaderAlign" }).HtmlAttributes(new { @class = "NumericRowAlign" });
        columns.Bound(v => v.VendorId).Title("Vendor Number".Translate()).ClientTemplate("#= VR_Id === 0 ? '' : (VendorId || '') #").Lockable(false).Locked(true).Width(150).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.VendorId), StringComparison.OrdinalIgnoreCase))).HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.CompanyName).Title("Company Name".Translate()).Width(220).Lockable(false).Locked(true).ClientTemplate("#=  VR_Id === 0 ? CompanyName : VendorProfile.buildCompanyNameLink(CompanyName, '" + @Url.Action("GetCompanyUrl") + "')#").Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.CompanyName), StringComparison.OrdinalIgnoreCase))).HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.CompanyNameDBA).Title("Company Name DBA".Translate()).Width(220).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.CompanyNameDBA), StringComparison.OrdinalIgnoreCase))).HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.VendorControls).Title("Vendor Controls".Translate()).Width(140)
            .ClientTemplate("#=  VendorControls ? '<div onclick=\"VendorProfile.openValidationResultDialogWindow(this)\"><span class=\"fal fa-check-circle validation-pass-icon-grid\"></span></div>':'<div onclick=\"VendorProfile.openValidationResultDialogWindow(this)\"><span class=\"fal fa-times-circle validation-fail-icon-grid\"></span></div>'  #")
            .Filterable(filterable => filterable.Messages(m => m.IsFalse("Fail".Translate()))
                .Messages(m => m.IsTrue("Pass".Translate()))).Visible((ViewBag.IsDisplayVendorControlInGrid ?? true) && choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.VendorControls), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "IconHeaderAlign" })
            .HtmlAttributes(new { @class = "IconRowAlign" });
        columns.ForeignKey(v => v.Status, availableStatus, "Value", "Name")
            .Title("Status".Translate())
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" })
            .ClientTemplate("#= VR_Id === 0 ? 'DISCOVERY' : VendorProfile.getGridTextByValue(Status,'Status') #")
            .Width(180)
            .Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.Status), StringComparison.OrdinalIgnoreCase)))
            .HtmlAttributes(new { @data_displayToolTip = "True", @data_column_name = nameof(VendorSearchResult.Status), @class = "StringRowAlign" });
        columns.Bound(x => x.Status_Desc).Title("Status".Translate()).ClientTemplate("#= VR_Id === 0 ? 'DISCOVERY' : Status_Desc #").Hidden(true).IncludeInMenu(false).HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(x => x.RegistrationType_Desc).ClientTemplate("#= RegistrationType_Desc == null ? '' : RegistrationType_Desc.toUpperCase() #").Title("Registration Type".Translate()).Hidden(true).IncludeInMenu(false);
        columns.ForeignKey(v => v.SubStatus, availableStatus, "Value", "Name").ClientTemplate("#= SubStatus == null ? '' : VendorProfile.getGridTextByValue(SubStatus,'SubStatus') #").Title("Sub Status".Translate()).Width(140).Visible((ViewBag.IsDisplaySubStatusColumnInGrid ?? false) && choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.SubStatus), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.ForeignKey(v => v.RegistrationType, registrationType, "Value", "Name").ClientTemplate("#= RegistrationType == null ? '' : VendorProfile.getGridTextByValue(RegistrationType,'RegistrationType').toLocaleUpperCase() #").Title("Registration Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.RegistrationType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.SupplierType).Title("Supplier Type".Translate()).Width(200).Visible( choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.SupplierType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.SupplierSubType).Title("Vendor Category".Translate()).Width(140).Visible( choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.SupplierSubType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.SupplierSubType).Title("Vendor Category".Translate()).Width(140).Visible( choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.SupplierSubType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.BusinessUnit).Title("Business Unit".Translate()).Width(140).Visible( choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.BusinessUnit), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.ProjectCode).Title("Project Code".Translate()).Width(140).Visible(sysSettingHelper.IsProjectCodeDrivenWorkflowEnabled && choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.ProjectCode), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.AddressTypeDescription).Title("Address Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.AddressTypeDescription), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.PayeeName).Title("Payee Name".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.PayeeName), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.PayeeDBA).Title("Payee DBA".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.PayeeDBA), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.InvitedBy).Title("Invited By".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.InvitedBy), StringComparison.OrdinalIgnoreCase)))
            .HtmlAttributes(new { @data_displayToolTip = vendorProfileHelper.IsUpdatedByToolTipToShowName, @data_column_name = nameof(VendorSearchResult.InvitedBy), @class = "StringRowAlign invited-by-tooltip" }).HeaderHtmlAttributes(new { @class = "StringHeaderAlign" });
        columns.Bound(v => v.CreatedDate).Format("{0:G}").Title("Date Registered".Translate()).Width(180).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.CreatedDate), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "DateHeaderAlign" }).HtmlAttributes(new { @class = "DateRowAlign" });
        columns.Bound(v => v.UpdatedBy).Title("Updated By".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.UpdatedBy), StringComparison.OrdinalIgnoreCase)))
            .HtmlAttributes(new { @data_displayToolTip = vendorProfileHelper.IsUpdatedByToolTipToShowName, @data_column_name = nameof(VendorSearchResult.UpdatedBy), @class = "StringRowAlign" })
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" });
        columns.Bound(v => v.UpdatedDate).Format("{0:G}").Title("Last Update".Translate()).Width(180).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.UpdatedDate), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "DateHeaderAlign" }).HtmlAttributes(new { @class = "DateRowAlign" });
        columns.Bound(v => v.ProfileType).Title("Profile Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.ProfileType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.IndividualType).Title("Individual Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.IndividualType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.GlobalSmartVMNumber).Title("Global SmartVM Number".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.GlobalSmartVMNumber), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.ParentSmartVMNumber).Title("Parent SmartVM Number".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.ParentSmartVMNumber), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.SmartVMBusinessEntityType).Title("SmartVM Business Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.SmartVMBusinessEntityType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.SmartVMBusinessEntitySubType).Title("SmartVM Business Subtype".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.SmartVMBusinessEntitySubType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.BusinessEntityType).Title("Business Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.BusinessEntityType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.TaxClassification).Title("Tax Classification".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.TaxClassification), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.IncomeType).Title("Income Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.IncomeType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.BusinessOwnershipType).Title("Business Ownership Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.BusinessOwnershipType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.VendorRequestType).Title("Vendor Request Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.VendorRequestType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.LocalLanguageCompanyCountry).Title("Local Language Company Country".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.LocalLanguageCompanyCountry), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.LocalLanguageCompanyName).Title("Local Language Company Name".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.LocalLanguageCompanyName), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.LocalLanguageCompanyNameDBA).Title("Local Language Company NameDBA".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.LocalLanguageCompanyNameDBA), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.AddressInfo).Title("Address Info".Translate()).Width(240).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.AddressInfo), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.BankName).Title("Bank Name".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.BankName), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.BankAddress).Title("Bank Address".Translate()).Width(240).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.BankAddress), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.PersonName).Title("Person Name".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.PersonName), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.ContactType).Title("Contact Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.ContactType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.Email).Title("Email".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.Email), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.PhoneInfo).Title("Phone Info".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.PhoneInfo), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.TaxType).Title("Tax Type".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.TaxType), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Bound(v => v.TaxIdNumber).Title("Tax Id Number".Translate()).Width(140).Visible(choosenColumns.Any(x => string.Equals(x, nameof(VendorSearchResult.TaxIdNumber), StringComparison.OrdinalIgnoreCase)))
            .HeaderHtmlAttributes(new { @class = "StringHeaderAlign" }).HtmlAttributes(new { @class = "StringRowAlign" });
        columns.Command(command => { command.Custom("Delete").Visible("VendorProfile.deleteVendorProfileRowVisible").Text("Delete".Translate()).Click("VendorProfile.deleteVendorProfile"); }).Width(200).Visible((ViewBag.IsDisplayDeleteColumnInGrid ?? false) && !excludedFieldSet.Contains(nameof(VendorSearchResult.IsDeleteAllowed)))
            .HeaderHtmlAttributes(new { @class = "IconHeaderAlign" }).HtmlAttributes(new { @class = "IconRowAlign" });
    })
    .Sortable()
    .Events(e => { e.DataBound("VendorProfile.vendorProfileGridDataBound").Change("VendorProfile.onVendorProfileGridChange").ExcelExport("VendorProfile.vendorProfileGridDataExcelExport"); })
    .AutoBind(true)
    .Editable(e => { e.Enabled(false); })
    .DataSource(datasource => datasource
        .Custom()
        .Type("aspnetmvc-ajax")
        .PageSize(defaultGridSize)
        .Transport(t => { t.Read(r => r.Url(Url.Action("ReadVendorProfiles", new { ModuleName = moduleName })).Data("VendorProfile.getVendorProfileAdditionalData")); }
        )
        .Schema(s => s
            .Model(model => { model.Id(request => request.VendorSearchResultId); })
            .Data("Data")
            .Total("Total")
        )       
        .ServerSorting(true) // as we are pulling 2000 records at a time from service, don't use server side sorting, paging, filtering
        .ServerPaging(true) // Once moved to odata service, we can turn it on
        .ServerFiltering(true)
        .ServerGrouping(false)
        .ServerAggregates(false)
        .Events(events => events.Error("VendorProfile.onGridError")
            .RequestEnd("VendorProfile.onGridRequestEnd")
            .RequestStart("VendorProfile.onGridRequestStart")
            .Change("VendorProfile.onVendorProfileGridChange"))
    )
)


<script>
    window.multipleEditWindowErrorMessage = '@multipleEditWindowErrorMessage';
</script>

this is my Layoutm Code

@using System.Threading
@using apexanalytix.app.HtmlHelperExtensions
@using apexanalytix.app.ViewComponents
@using apexportal.Services.Abstractions
@using Microsoft.AspNetCore.Mvc.Localization
@using Portal.BusinessObjects.Common
@model Portal.Models.MvcProfilePageModel
@inject SysSettings SysSettings
@inject IViewLocalizer Localizer

<!DOCTYPE html>
<html lang="@Thread.CurrentThread.CurrentUICulture.TwoLetterISOLanguageName">
<head id="Head1">
    <meta http-equiv="X-UA-Compatible" content="IE=EDGE" charset="utf-8"/>
    <style>
        body {
            min-width: 850px;
            width: 100%;
        }

        .field-validation-valid {
            padding: 0 !important;
            margin: 0 !important;
            display: none !important;
        }

        /* Int, Long, Percentage */
        .NumericHeaderAlign {
            text-align: center !important;
        }

        /* Int, Long, Percentage */
        .NumericRowAlign {
            text-align: right;
        }

        /* Date and Date + Time */
        .DateHeaderAlign {
            text-align: center !important;
        }

        /* Date and Date + Time */
        .DateRowAlign {
            text-align: center;
        }

        /* Alpha Numeric */
        .StringHeaderAlign {
            text-align: left !important;
        }

        /* Alpha Numeric */
        .StringRowAlign {
            text-align: left;
        }

        /* Images, Icons */
        .IconHeaderAlign {
            text-align: center !important;
            text-overflow: clip !important;
        }

        /* Images, Icons */
        .IconRowAlign {
            text-align: center !important;
            text-overflow: clip !important;
        }
    </style>

    <link href="/Content/Themes/uilightness/jqueryui" rel="stylesheet" type="text/css"/>
    <link href="/Content/VendorRegistrationMaster" rel="stylesheet" type="text/css"/>

    <script src="/Styles/fa-pro-5_15_1/js/all.min.js"></script>
    @{
        var englishPageTitle = SysSettings.SiteContent[ValueName.PageTitleBase];
        var pageTitle = Localizer[englishPageTitle.Value ?? string.Empty].Value + " - " + ViewBag.Title;
    }

    <title id="Title1">@pageTitle</title>
</head>

<body style="width: 100%">

<!-- menu popup-->

<div class="modelbg" style="display: none;"></div>
<div id="cloneMenu" style="display: none;">
    <div id="cloneContent"></div>
</div>
<div id="fadeSection">
    <div id="coreDialog" style="display: none">
    </div>
</div>
<input type="hidden" id="hdnThemeMode"/>
@{
    var enableAutoComplete  = SysSettings.Display[ValueName.EnableBrowserAuto_complete].GetValue<bool>();
    var cultureCode = HtmlExtensions.GetFullCultureCode();
}
<form id="Form1" autocomplete="@(enableAutoComplete ? "on" : "off")">
    <script src="/bundles/MsAjaxJs"></script>
    <script src="/bundles/jquery"></script>
    <script src="/bundles/jqueryui"></script>
    <script src="/Scripts/kendo/2024.3.1015/kendo"></script>
    <script src="/bundles/WebFormsJs"></script>

    <script src="/bundles/PortalMaster"></script>
    <script src="/bundles/jqueryval"></script>
    <script src="/bundles/KendoWindowManager"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"
            type="text/javascript"></script>
    <script src="/Scripts/kendo/2024.3.1015/messages/kendo"></script>
    <script src="/Scripts/kendo/2024.3.1015/cultures/kendo"></script>
    <script src="~/Scripts/kendo/2024.3.1015/cultures/kendo.culture.@(cultureCode).min.js" type="text/javascript"></script>
    <script src="~/Scripts/kendo/2024.3.1015/messages/kendo.messages.@(cultureCode).min.js" type="text/javascript"></script>
    <script>
        kendo.culture("@(cultureCode)");
    </script>


    <div id="body">

        @{ await Html.RenderPartialAsync("~/Views/Shared/_Header.cshtml", ViewData); }
        @{ await Html.RenderPartialAsync("~/Views/Shared/_ThemeMode.cshtml", ViewData); }
        @{ await Html.RenderPartialAsync("~/Views/Shared/_GridRowDeleteDialog.cshtml", null); }
        @{ await Html.RenderPartialAsync("~/Views/Shared/_popupDialog.cshtml", null); }

        <div class="container-fluid landing-container">
            <div class="sidebar border-right bg-body-tertiary">
                <div class="sideMenubtm">
                    @{
                        await Html.RenderPartialAsync("~/Views/Shared/_MainMenu.cshtml", ViewData);
                    }
                </div>

            </div>
            <div class="main-content-section">
                <div id="bodytitle">
                    @{ await Html.RenderPartialAsync("~/Views/Shared/_Breadcrumb.cshtml", ViewData); }
                </div>
                <div id="bodynews">
                    @if (false)
                    {
                        await Component.RenderActionAsync("GetWelcomeBanner", "Dashboard");
                    }
                </div>
                <div style="padding: 0 24px; margin-bottom: 100px">
                    @RenderBody()
                    @await Component.ExtendKendoValidationsAsync()
                    <script type="text/javascript">
                        $(document).ajaxError(function (xhr, props) {
                            if (props.status === 401) {
                                location.reload();
                            }
                        });
                    </script>
                </div>
                @if (ViewBag.StartSessionExpire != false)
                {
                    await Html.RenderPartialAsync("~/Views/Shared/_SessionExpireNotification.cshtml", ViewData);
                }
            </div>
        </div>
        @{
            if (SysSettings.HomePage[ValueName.DisplayFooter].GetValue<bool>() && !(Model?.HideFooter ?? false))
            {
                <partial name="~/Views/Shared/_Footer.cshtml"/>
            }
        }
    </div>

</form>

<script type="text/javascript">

    var commonBaseUrl = '@Url.Content("~/")';

    function Translate(error) {
        try {

            let url = '/Registration/Common/TranslateJSStrings';
            $.ajax({
                type: "POST",
                async: false,
                url: url,
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({
                    Message: error
                }),
                success: function (result) {
                    error = result.d;
                }
            });

            return error;

        } catch (ex) {
        }
    }

</script>

@Html.RenderUnobtrusiveAjaxScript()

@await Component.GoogleAnalyticsAsync(SysSettings.SiteConfiguration[ValueName.AnalyticsId].GetValue<string>(), Context.User.Identity?.GetUserId())

</body>
</html>

this is my Error.

Hi,

I have a Kendo Grid and its first column is a Datetime and Its a Kendo DatePicker.

When the user click on Add new record button then the 1st cell which is a date picker should be auto focus.

Note: When the user click on Add new record button then we are sorting the grid in ascending order so that the new row should appear on the top, which is working fine but the 1st cell of the newly created row a Kendo Date picker in not in focus.

But when the user click on the first cell of the newly created row, then it opens the datepicker to allow user to select a date.

My requirement is when i am clicking the Add new record button then 
1. It should sort in ascending order (Which is working now)

2. The 1st cell of the Kendo Datepicker should auto focus like the above screenshot.

Hi,

I have a requirement in the Kendo grid

1. When the user click on cross icon in each row in the action column then the row should be deleted.

2. In the last available row, a + icon should display and when the user clicks the + icon then it should create new row in the grid 

instead of normal Add new record button.

Hi,

I want to load a kendo grid, after load the grid should add a new row at the bottom of the grid.

When the Kendo grid loads then, it is creating the new row, but after that it will load the records from the database and then refresh the screen and the new row is removing.

Hi,

I have a kendo grid, where i am creating a new empty row while loading the grid.

The grid has a Boolean filed which is a mandatory field. so when we want to enter the row values then it should call the CheckIsPublicFund(data) method and if the user is not selecting the Boolean field then it should add that value to false.

The problem is when selecting the Boolean value then its not firing the CheckIsPublicFund(data)  method.

Hi,

I am working on a kendo grid, where user can copy records from the excel and paste in the kendo grid.

But when we copy more than 50 records from the excel and paste in the kendo grid then it is taking some time.

Can we increase the performance while pasting in to the Kendo grid or is it possible we can provide a progress bar or something to show to the user when the user paste more than 50 record.

Hello,

I created new project using Telerik wizard. I am trying to populate a grid with data-source using ajax but I am failing at using ToDataSourceResult. I am getting error 

'IEnumerable<Person>' does not contain a definition for 'ToDataSourceResult' and the best extension method overload 'QueryableExtensions.ToDataSourceResult(DataTable, DataSourceRequest)' requires a receiver of type 'System.Data.DataTable'

I compared it with project created by Telerik wizard for page with grid and still don't see why this error occurs.

Please see attached figure. It is screenshot taken from HomeController where I am trying to get data-source from IEnumerable. 

Hi,

I'm trying to figure out how to transpose columns in a Kendo Grid using the Html helper. 

I see that there's this small piece of documentation for jQuery (https://docs.telerik.com/kendo-ui/knowledge-base/transposed-grid), but would ideally like to do it on the helper itself.

Is anyone aware of how to do this? 

Any help is much appreciated!

Hi,

We are using Kendo controls for MVC. There was a security scan done in our application, it capture few of the security issues.

We are able to fix all of the security issues except one.

CWE 829 - The application contains unsafe Content-Security-Policy (CSP) directives that could allow malicious script code to be included on the page.

So, as a result we have removed all the custom inline javascript and css to an external files and refer those external .js and .css files in our .cshtml page.

But when we use any of the Kendo controls like Kendo grid or Kendo calendar then in the runtime it create some inline scripts and we are getting application contains unsafe Content-Security-Policy (CSP) directives.

How to bypass those runtime inline scripts created by Kendo controls so that we don't get unsafe Content-Security-Policy (CSP) directives

during the security scan of the application.

Please let me know if you need any more information on this.