Telerik Forums
UI for ASP.NET MVC Forum
1 answer
13 views
Doesn't look like Exportable is available in GridColumnSettings. I'm using the LoadSettings feature on a Grid and I want to set some columns to not be exported to Excel. Exportable is a setting when using the column binding but I don't see it in the GridColumnSettings class.
Yanislav
Telerik team
 answered on 08 Jun 2022
0 answers
18 views

I have a problem with kendo DateTimePicker when setting component type to modern. The control has a weird behavior and does not have an exact pattern to reproduce the problem, only that sometimes when making the transition from the date view to the time view or vice versa, the time view gets stuck and loses buttons.

You could replicate the issue on the telerik demo page, https://demos.telerik.com/aspnet-mvc/datetimepicker/component-type

Kendo version: 2022.2.510
Jquery version: 3.6.0

Please advise.
Thank you.
Joseph
Top achievements
Rank 1
 asked on 06 Jun 2022
1 answer
14 views

I am trying to customize the Marker of a ScatterLine chart. If the data is of type A then show ChartMarkerShape.Triangle otherwise show ChartMarkerShape.Circle? 

This is my current code 

                        

@(Html.Kendo().Chart(Model.DosageUnitsOfInsulin)
                        .Name("DosageTotal")
                        .Title("Total Series")
                        .Series(series => {

                            series.ScatterLine(model => model.DosageDate, model => model.DosageTotal).Width(4).ColorHandler("getColor");
                        })
                        .SeriesDefaults(seriesDefaults => seriesDefaults
                            .ScatterLine().Markers(markers => markers.Size(20).Type(ChartMarkerShape.Circle)).Color("#47AADF")
                        )

                        .XAxis(x => x
                            .Date()
                            .BaseUnit(ChartAxisBaseUnit.Days)
                            .Title(title => title.Text(""))
                            .Labels(m => m.DateFormats(v => v.Days("M/d/yyyy") ))
                            .Min(new DateTime(2021,2,7))
                            .Max(new DateTime(2021, 9, 28))
                            .MinorGridLines(m => m.Visible(true))
                            .MajorGridLines(m => m.Visible(true))
                        )
                        .YAxis(y => y
                            .Numeric()
                            .Title(title => title.Text("Units of Insulin"))
                            .Min(65)
                            .Max(110)
                            .AxisCrossingValue(-5)

                        )
                        .Theme("sass").Legend(leg => {
                            leg.Position(ChartLegendPosition.Bottom);
                        })
                        .Tooltip(tooltip => tooltip
                            .Format("{0:d}, {1}")
                            .Visible(true)
                        )
                        .Events(events => events.Render("onRender"))
                        .Zoomable()
                        .Pannable()
                    )

 

Is it possible to dynamically change the marker when the chart is rendered? I have subscribed to the Visual event like the Custom Visual example. However, I just want the standard Telerik circle and sometimes triangle visual not a custom image.

 

Thanks,

 

Tim

 

Anton Mironov
Telerik team
 answered on 06 Jun 2022
0 answers
12 views

Hello,

We have a specific scenario reported from our client with the "Clean Formatting" tool in the editor button.

Copy the Strikethrough text from MS word & paste it in Editor.

Expectation here is clean formatting tool should remove the Strikethrough & text should become normal. It works fine when we copy the text from "Google Doc".

I know that "clean formatting" tool removes all the styles associated.

When the text is copied from "Google Doc", it will have the "Span" element with the css associated. hence the clean formatting option will be able to remove the css & make it as normal text.

Strikethrough

When the text is copied from "MS Word", it will have the "<s>" element without any css associated. hence the clean formatting option will NOT be able to make the text normal since there are no associated css.

Strikethrough

Please let me know if you have any idea to achieve this functionality ?

Thanks & Regards, Puru

Purushothama
Top achievements
Rank 1
 asked on 03 Jun 2022
0 answers
12 views

We are updating Kendo from v2012.3.1210 to v2022.1.412, and currently using a trial version of v2022.1.412. The following code used to work, but now there is issues with the kendoGrid.dataSource.options.schema.model.fields being undefined.

This is in the .cshtml file defining the grid

<div id="deploymentsGrid" class="collapsible">
            <h2>@DeploymentResources.DeploymentGridDeployments <span class="expandhint">&nbsp;</span></h2>
            <div>
                @Html.Partial("_ButtonGroup", Model.DeploymentButtons)
                <div class="gridWrapper">
                    @(Html.Kendo().Grid<vw_PackageDeploymentGrid>()
                    .Name("DeploymentGrid")
                    .DataSource(dataSource =>
                    {
                        dataSource.Ajax()
                            .PageSize(DeploymentIndexViewModel.DeploymentPageSize)
                            .Model(model =>
                            {
                                model.Id(pdg => pdg.PackageDeploymentId);
                                model.Field(pdg => pdg.PackageDeploymentId).Editable(false);
                            })
                            .ServerOperation(true)
                            .Read(read => read.Action("SelectAjaxPackageDeployments", "Deployment").Type(HttpVerbs.Post))
                            .Sort(sort =>
                            {
                                sort.Add(pdg => pdg.IsActive).Descending();
                            })
                            .Events(events =>
                            {
                                events.Error("onError(\"DeploymentGrid\")");
                                events.RequestEnd("onRequestEnd(\"DeploymentGrid\")");
                            })
                            .Filter(filters => filters.Add(pdg => pdg.IsHidden).IsEqualTo(false));
                    })
                    .Columns(columns =>
                    {
                        columns.BindButtonColumn(pdg => pdg.PackageDeploymentId, new ButtonColumn()
                        {
                            RequestContext = ViewContext.RequestContext,
                            ButtonId = "viewStopDeployment",
                            JavaScriptFunction = "openPackageDeployment",
                            Action = "GetPackageDetailsViewStop",
                            Controller = "Deployment",
                            Value = "#= data.PackageDeploymentId #",
                            HtmlAttributes = new RouteValueDictionary(new {@class = "centeredColumn"}),
                        });
                        //if user can deploy, delete or create a deployment then they can hide
                        if(DeploymentIndexViewModel.CanDeletePackageDeployment || DeploymentIndexViewModel.CanCreatePackageDeployment)
                        {
                            columns.BindButtonColumn(pdg => pdg.PackageDeploymentId, new ButtonColumn()
                            {
                                RequestContext = ViewContext.RequestContext,
                                ButtonId = "showHideDeployment",
                                JavaScriptFunction = "showHidePackageDeployment",
                                Action = "UpdatePackageDeploymentHiddenState",
                                Controller = "Deployment",
                                Value = "#= data.PackageDeploymentId #",
                                HtmlAttributes = new RouteValueDictionary(new {@class = "centeredColumn"}),
                            });
                        }

                        columns.Bound(p => p.PackageDeploymentName).Title(DeploymentResources.DeploymentGridDeploymentsColDeploymentName);
                        columns.Bound(p => p.DeviceModelName).Title(DeploymentResources.DeploymentGridDeploymentsColDeviceType);
                        columns.Bound(p => p.DeviceGroupName).Title(DeploymentResources.DeploymentGridDeploymentsColGroup);
                        columns.Bound(p => p.PackageTypeName).Title(DeploymentResources.DeploymentGridDeploymentsColPackageType);
                        columns.Bound(p => p.IsActive).Title(DeploymentResources.DeploymentGridDeploymentsColStatus)
                            .ClientTemplate("<span class=\"hidden\" id=\"canDeleteDeployment\">" + DeploymentIndexViewModel.CanDeletePackageDeployment + "</span>#= data.IsActive ? '" + DeploymentResources.DeploymentOptActive + "' : '" + DeploymentResources.DeploymentOptStopped + "' #");
                        columns.Bound(p => p.UserName).Title(DeploymentResources.DeploymentGridDeploymentsColUsername);
                        columns.Bound(p => p.PackageDeploymentStartDate).Format(ApplicationSettings.GridDateTimeFormat).Title(DeploymentResources.DeploymentGridDeploymentsColStartDate);
                        columns.Bound(p => p.PackageDeploymentId)
                            .Title(String.Empty)
                            .ClientTemplate("&nbsp;")
                            .Width(35);
                        columns.Bound(p => p.IsHidden)
                            .Title(String.Empty)
                            .Hidden(true);
                    })
                    .Filterable()
                    .Sortable(sortable => sortable.AllowUnsort(false))
                    .Pageable(paging => paging.BasicPagerSetup()
                        .Messages(m => m.Display(Resources.Messages.Pager_Display)
                            .Empty(Resources.Messages.Pager_Empty)
                            .First(Resources.Messages.Pager_First)
                            .ItemsPerPage(Resources.Messages.Pager_ItemsPerPage)
                            .Last(Resources.Messages.Pager_Last)
                            .Next(Resources.Messages.Pager_Next)
                            .Of(Resources.Messages.Pager_Of)
                            .Page(Resources.Messages.Pager_Page)
                            .Previous(Resources.Messages.Pager_Previous)
                            .Refresh(Resources.Messages.Pager_Refresh))
                    )
                    .Events(events => events.BasicGridEvents())
                    )
                </div>
            </div>
        </div>

This is in the .js file and the line 'fields = kendoGrid.dataSource.options.schema.model.fields' is erroring with

grid.customizations.js?cdv=1:1139 Uncaught TypeError: Cannot read properties of undefined (reading 'fields')
    at Grid.buildFilterBoxes (grid.customizations.js?cdv=1:1139:54)
    at Grid.onLoad (grid.customizations.js?cdv=1:1381:7)
    at HTMLDivElement.<anonymous> (grid.customizations.js?cdv=1:2139:22)
    at Function.each (jquery-3.6.0.js:385:19)
    at jQuery.fn.init.each (jquery-3.6.0.js:207:17)
    at initGrid (grid.customizations.js?cdv=1:2097:15)
    at grid.customizations.js?cdv=1:2184:2
    at dispatch (jquery-3.6.0.js:5430:27)
    at elemData.handle (jquery-3.6.0.js:5234:28)

,

Grid.prototype.buildFilterBoxes = function (removeFirstColumn) {
var gridId = this.gridId,
gridSelector = this.gridSelector,
kendoGrid = this.kendoGrid,
fields = kendoGrid.dataSource.options.schema.model.fields,
modelId = kendoGrid.dataSource.options.schema.model.id,
columns = kendoGrid.columns,
columnIndex,
selector,
column,
title,
field,
html = '';

// For each column in the grid.
for (columnIndex in columns) {
if (columns.hasOwnProperty(columnIndex)) {
column = columns[columnIndex];
title = column.field;
field = fields[column.field];

if (column.field !== undefined && column.field !== modelId) {
// Determine the type of the column and generate 
//      the filter control based on that.
if (column.values !== undefined) {
html = Grid.getDropDownHtml(column.field, gridId, columnIndex,
column.values);
} else if (field.type === 'string') {
html = Grid.getTextBoxHtml(gridId, columnIndex);
} else if (field.type === 'number') {
html = Grid.getNumericHtml(gridId, columnIndex);
} else if (field.type === 'boolean') {
html = Grid.getBooleanHtml(column.field, gridId, columnIndex);
} else if (field.type === 'date') {
html = Grid.getDateHtml(gridId, columnIndex);
}
if (title !== '' && title !== undefined) {
selector = gridSelector + ' a.k-link:eq(' + columnIndex + ')';
$(html).insertAfter(selector);
}
}

html = '';
}
}

// Attach events for the text box filters.
$('.FilterTextBox').on('blur', Grid.addFilterImage);
$('.FilterTextBox').on('focus', Grid.removeFilterImage);
$('.FilterTextBox').on('click', function (e) { e.stopImmediatePropagation(); });
$('.FilterTextBox').on('mouseup', this.doTextChange);
$('.FilterTextBox').on('keyup', this.doTextChange);
$('.FilterTextBox').on('cut', this.doTextChange);
$('.FilterTextBox').on('copy', this.doTextChange);
$('.FilterTextBox').on('paste', this.doTextChange);

// Attach events for the date time filter text boxes.
$('.FilterDateBox').on('blur', Grid.addFilterImage);
$('.FilterDateBox').on('focus', Grid.removeFilterImage);
$('.FilterDateBox').on('click', function (e) { e.stopImmediatePropagation(); });
$('.FilterDateBox').on('mouseup', this.doDateChange);
$('.FilterDateBox').on('keyup', this.doDateChange);
$('.FilterDateBox').on('cut', this.doDateChange);
$('.FilterDateBox').on('copy', this.doDateChange);
$('.FilterDateBox').on('paste', this.doDateChange);

// Attach events for the drop down filter boxes.
$('.FilterDropDown').on('change', this.doDropDownChange);
$('.FilterDropDown').on('click', function (e) { e.stopImmediatePropagation(); });

$('.FilterDropDown').multiselect({
multiple: false,
selectedList: 1,
height: 'auto',
position: { my: 'left top', at: 'left bottom', collision: 'flipfit' },
header: false
});
$('.ui-multiselect-menu').css({ width: 'auto', minWidth: 50 });
$('.ui-multiselect-menu .ui-multiselect-checkboxes').css({ overflowY: 'auto' });
$('button.ui-multiselect').css({ 'white-space': 'nowrap' });

// Remove the default telerik filtering controls to save space.
$('.k-grid-filter').remove();
};
Christa
Top achievements
Rank 1
 asked on 31 May 2022
1 answer
17 views

This is kendo ui for asp.net mvc.  In the past I have used float:right to move menu items and gridtoolbar items to the right side, but that no longer works.  For example:

.ToolBar(toolbar =>
{
   toolbar.Search();
   toolbar.Custom()
      .Text("Clear Filters/View All")
      .Url("#")
      .HtmlAttributes(new { id = "btnClearFilters", @class="btn btn-link", onclick = "btnClearFiltersClick()" });
   toolbar.Custom()
      .Text("New Order")
      .Url("#")
      .IconClass("k-icon k-i-add")
      .HtmlAttributes(new { id = "btnNew", style = "float:right;", onclick = "btnNewClick()" });
   toolbar.Custom()
      .Text("Copy Order")
      .Url("#")
      .IconClass("k-icon k-i-copy")
      .HtmlAttributes(new { id = "btnCopy", style = "float:right;margin-right:20px;", onclick = "btnCopyClick()", disabled = "disabled" });
})
The "New Order" and "Copy Order" buttons should be on the far right of the toolbar, but all of the toolbar items appear on the left side.  Is there a new way to right align items?
Yanislav
Telerik team
 answered on 27 May 2022
1 answer
17 views

Here's the definition of the two items that are linked by the CascadeFrom:
                      items.Add().Field(f => f.Country)
                                 .ColSpan(1)
                                 .Name("cmbCountry")
                                 .Editor(e => e.ComboBox()
                                               .AutoWidth(false)
                                               .DataTextField("name")
                                               .DataValueField("id")
                                               .BindTo(@CountryModel.Countries)
                                               .Placeholder("--- Select or Type Country"));
                      items.Add().Field(f => f.StateProvince)
                                 .ColSpan(1)
                                 .Name("cmbStatesProvinces")
                                 .Editor(e => e.ComboBox()
                                               .AutoWidth(false)
                                               .AutoBind(false)
                                               .Placeholder("--- Select State/Province ---")
                                               .DataTextField("name")
                                               .DataValueField("id")
                                               .DataSource(dS => dS.Read(read => read.Action("GetStateList", "Address").Data("filterState")).ServerFiltering(true))
                                               .CascadeFrom("cmbCountry")
                                               @*.BindTo(@StatesProvinces.StateProvince)*@
                                               );

Here's the AddressController.GetStateList:

        public JsonResult GetStateList(string? Country)
        {
            JsonResult? retval = null;
            if (!string.IsNullOrEmpty(Country))
            {   var Country_ID = CountryModel.Countries.Where(s => s.name == Country).ToList()[0].code;
                var State = StatesProvinces.StateProvince.Where(s => s.countryCode == Country_ID);
                retval = Json(State.Select(s => new { id = s.id, name = s.name }).ToList());
            }
            else
                retval = Json(StatesProvinces.StateProvince);
            
            return retval;
        }

 

This works for the first Country that is selected...  afterwards - if the Country is changed, the GetStateList is not called again to refresh the related/CascadeFrom Combobox.

Yanislav
Telerik team
 answered on 26 May 2022
1 answer
18 views

I have a dashboard page made up of several different sections.  Each section is rendered via a Html.Action call.

Is it possible to rearrange these into kendo scripts so the whole page can leverage the TileLayout wrapper? 

I tried below, but it's throwing all sorts of console errors.  The child actions do contain their own javascript scripts which may be the problem perhaps?


    <script id="views-corporatedocuments-template" type="text/x-kendo-template">
        @Html.Action("CorporateDocuments")
    </script>

    <script id="views-lowmargin-template" type="text/x-kendo-template">
        @Html.Action("LowMarginOrders")
    </script>

    <script id="views-lateshipments-template" type="text/x-kendo-template">
        @Html.Action("LateShipments")
    </script>

Eyup
Telerik team
 answered on 25 May 2022
1 answer
18 views

Hello, We are trying to use the Grid Filter & Sort in ASP.NET MVC5.

When we click on filter icon nothing happens "No drop down list to make filter choice " The sorting & paging seems to work fine. Attachments are View markup, Controller code and UI screen.


Srinu
Top achievements
Rank 1
Iron
 answered on 23 May 2022
0 answers
21 views

Hello, We are trying to play with MVC5 samples and in Visual Studio 2019. The web application is working but the data is not loadind and it is just spinning with "Loading Demo". FYI, We have not changed anything in the sample.

 

Would be able to guide me in the right direction so we can maker sure whatever is missing in our dev environment is installed.

Srinu
Top achievements
Rank 1
Iron
 updated question on 23 May 2022
Narrow your results
Selected tags
Tags
+? more
Top users last month
sun
Top achievements
Rank 2
Iron
Iron
Iron
Alan
Top achievements
Rank 2
Iron
Iron
Paul
Top achievements
Rank 2
Iron
Veteran
Iron
Ohad
Top achievements
Rank 2
Iron
Iron
Iron
arkan
Top achievements
Rank 2
Want to show your ninja superpower to fellow developers?
Top users last month
sun
Top achievements
Rank 2
Iron
Iron
Iron
Alan
Top achievements
Rank 2
Iron
Iron
Paul
Top achievements
Rank 2
Iron
Veteran
Iron
Ohad
Top achievements
Rank 2
Iron
Iron
Iron
arkan
Top achievements
Rank 2
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?