Telerik Forums
UI for ASP.NET Core Forum
1 answer
903 views
I have a combobox separate from my grid and I want to use the comboBox selected value to filter the grid results.  Do I need to do this in Java script? What is the best way to do this?
   @(Html.Kendo().ComboBox()
                .Name("comboBox")
                .Size(ComponentSize.Small)
                .DataTextField("Text")
                .DataValueField("Value")
                .Filter(DateTime.Today.Year.ToString())
                .HtmlAttributes(new { style = "width:100%;" })
                .BindTo(new List<SelectListItem>()
                {
                    new SelectListItem() {
                        Text = "2018", Value = "2018"
                    },
                    new SelectListItem() {
                        Text = "2019", Value = "2019"
                    },
                    new SelectListItem() {
                        Text = "2020", Value = "2020"
                    },
                      new SelectListItem() {
                        Text = "2021", Value = "2021"
                    },
                      new SelectListItem() {
                        Text = "2022", Value = "2022"
                    },
                      new SelectListItem() {
                        Text = "2023", Value = "2023"
                    },
                      new SelectListItem() {
                        Text = "2024", Value = "2024"
                    }
                })
         )

@(Html.Kendo().Grid<Golf.DataAccess.Models.GoodGolfSchool>()
    .Name("grid")
    .Filterable()
    .Columns(columns => {
        columns.Bound(pkey => pkey.Id).Hidden(true);
        columns.Bound(c => c.FirstName).Filterable(false);
        columns.Bound(c => c.LastName);
        columns.Bound(c => c.Email);
        columns.Bound(c => c.VillageId).Width(100);
        columns.Bound(c => c.ClassDateView).ClientTemplate("#=ClassDateView#")
               .Filterable(f => f.Multi(true).CheckAll(false));
        columns.Bound(c => c.Phone);
        columns.Bound(c => c.EntryDate).Hidden();
        columns.Command(cmd =>
        {
            cmd.Edit();
            cmd.Destroy();
        });
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .ServerOperation(true)
        .Read(read => read.Action("GolfSchoolRoster_Read", "GoodGolfSchools"))
        .Update(update => update.Action("Student_Edit", "GoodGolfSchools"))
        .Destroy(delete => delete.Action("Student_Distroy", "GoodGolfSchools"))
        .Model(model =>
        {
            model.Id(p => p.Id);
            model.Field(p => p.Id).Editable(false);
            model.Field(p => p.EntryDate).Editable(false);
            model.Field(p => p.ClassDateView).DefaultValue(
                ViewData["ScheduleDates"] as Golf.DataAccess.Models.ClassDateViewModel);
        })
        .Filter(filters => {
            filters.Add(model => model.ClassDate.Year).IsEqualTo([SELECTED VALUE FROM COMBOBOX ABOVE] );
        })
    )
    .ToolBar(tools =>
    {
        tools.Excel().Text("Export To Excel");
    })
    .Excel(excel =>
    {
        excel.FileName("GoodGolfSchool.xlsx");
        excel.AllPages(true);
       
    })
    .Pageable()
    .Sortable()
    .AutoBind(true)
    .Editable(edit => edit.Mode(GridEditMode.InLine))
)

Jay
Top achievements
Rank 1
Iron
Iron
 updated answer on 06 Jun 2022
1 answer
506 views

Hi Guys,

maybe i'm missing something, but could someone help me how i could define a ClientHeaderTemplate / HeaderTemplate for a Grid Column with the TagHelper?

<columns>
   <column field="Alert" title="" ***/>
</columns>

Thanks for your help!

Best wishes
Patrick

Alexander
Telerik team
 answered on 03 Jun 2022
1 answer
281 views

I have the same data structure as the original poster here (https://www.telerik.com/forums/set-color-for-each-category-in-single-series-chart#1405418), except I need to use a linear gradient as color for each category. How do I define a linear gradient as color for each category in asp.net core? I have a ColorFrom and ColorTo (hex, string) in my data model, and this is the sample chart I am trying to create:

Mihaela
Telerik team
 answered on 02 Jun 2022
1 answer
132 views
  I am unable to get the href to work in the asp .net core treeview control (Razor).   Am I doing something wrong? 

 

                           <kendo-treeview name="treeView">
                                <items>
                                    <treeview-item text=Test expanded="true">
                                        <items>           
                                            <treeview-item text="Google" href="http://www.google.com" />   
                                        </items>
                                    </treeview-item>
                                </items>
                            </kendo-treeview>

Mihaela
Telerik team
 answered on 01 Jun 2022
1 answer
681 views

In Core 6 project setting following global JSON option to maintain property case (such as required for returning JSON result for Kendo Grids), since the Telerik upgrade, you now have to manually add Microsoft.AspNetCore.Mvc.NewtonsoftJson nuget package

builder.Services.AddRazorPages().AddNewtonsoftJson(options => options.SerializerSettings.ContractResolver = new DefaultContractResolver());

or change to use System.Text.Json

builder.Services.AddRazorPages().AddJsonOptions(options => options.JsonSerializerOptions.PropertyNamingPolicy = null);

 

 

Mihaela
Telerik team
 answered on 01 Jun 2022
1 answer
289 views

Hello,

I am trying to reload the content of one of my Tabs in different scenarios. I have different grids and other tabs that when their content changes I need to reload my checklist tab. However, when I call tabStrip.reload("li:first"); I get reload undefined.

Here is my TabStrip:


                  @(
                        Html.Kendo().TabStrip()
                        .Name("CaseTabStrip")
                        .TabPosition(TabStripTabPosition.Left)
                        .Animation(animation => animation.Open(effect => effect.Fade(FadeDirection.In).Duration(5)))
                        .Events(events => events.ContentLoad("onContentLoad"))
                        .Items(items =>
                        {
                            items.Add().Text("Checklist")
                                .Selected(true)
                                .LoadContentFrom(Url.Action("Checklist", "Cases", new { caseId = Model.Id }));
                           
// Extra tabs removed for brevity

                            items.Add().Text("Documents")
                                .LoadContentFrom(Url.Action("Index", "Documents", new { caseId = Model.Id }));
                        })
                        .HtmlAttributes(new { @class = "mt-5" })
                    )

And, this is how I am implementing the reload of the Checklist tab.


        var ReloadChecklist = () => {
            var tabStrip = $("#CaseTabStrip").data("kendoTabStrip");
            tabStrip.reload("li:first"); // No console error, but stepping through code shows "reload undefined"
        }

        function DocTypeRequestEnd(e) {
            var grid = $("#Documents").data("kendoGrid");
            if (grid) {
                grid.dataSource.read();
            }
            ReloadChecklist();
            GridRequestEnd(e);
        }
Where I call tabStrip.reload() I don't get a console error but the debugger show "reload undefined." It's odd because I can inspect the tabStrip variable and see my items. I can also see reload as an option under <prototype>
Aleksandar
Telerik team
 answered on 01 Jun 2022
1 answer
108 views

Hi,

I'm struggling to change the mouse pointer when selecting a value inside MultiColumnComboBox.  Before opening, the mouse pointer looks correct, but then it opens and the cursor attribute doesn't seem to apply.

I tried .HtmlAttributes(new { style = "cursor:pointer;"})

Thoughts or ideas?

Thanks,

Sam

 

 

Petar
Telerik team
 answered on 31 May 2022
1 answer
260 views

Hello I use in my form grid where I want to have checkbox selection.

I'm still lost how to bind selected row to model property "bool PrintOP"

Here is my .cshtml

div class="table-responsive">
                @(Html.Kendo().Grid(Model.ProdOrderLines)
                .Name("#grid")
                .Editable(editable => {
                    editable.Mode(GridEditMode.InCell);
                })
                .DataSource(dataSource => dataSource
                .Ajax()
                .Batch(true)
                .Model(m =>{
                    m.Id(id=>id.ProdOrderLineId);
                    m.Field(id=>id.PrintOP);
                    m.Field(id=>id.OperationNumber).Editable(false);
                    m.Field(id=>id.OperationName).Editable(false);
                    m.Field(id=>id.Machine).Editable(false);
                    m.Field(id=>id.Recipe1).Editable(false);
                    m.Field(id=>id.Recipe1C).Editable(false);
                    m.Field(id=>id.Recipe2).Editable(false);
                    m.Field(id=>id.Recipe2C).Editable(false);
                    m.Field(id=>id.Recipe3).Editable(false);
                    m.Field(id=>id.Recipe3C).Editable(false);
                    
                }))
                .Columns(c=>{
                    c.Bound(c=>c.ProdOrderLineId).Hidden(true)
                        .ClientTemplate("#= ProdOrderLineId # <input type='hidden' name='ProdOrderLines[#=index(data)#].ProdOrderLineId' value='#= ProdOrderLineId #' />");
                    c.Select().Width(50);
                    c.Bound(c=>c.OperationNumber).Width(50);
                    c.Bound(c=>c.OperationName).Width(100);
                    c.Bound(c=>c.Machine).Width(100);   
                    c.Bound(c=>c.Recipe1).Width(100);
                    c.Bound(c=>c.Recipe1C).Width(100);
                    c.Bound(c=>c.Recipe2).Width(100);
                    c.Bound(c=>c.Recipe2C).Width(100);
                    c.Bound(c=>c.Recipe3).Width(100);
                    c.Bound(c=>c.Recipe3C).Width(100);
                })
                .Editable(ed => ed.Mode(GridEditMode.InCell)))
              <br />
              <br />
            </div>

What I would like to have is when user select row  change model property "PrintOP" to true or false for corresponding ProductLine[x]

I hope there is some solution?

Here is also model used in Form

public classOrderDetailViewModel
    {
        public string OrderID { get; set; }    
        public string  ProductName { get; set; }
        public float OrderLength { get; set; }
        public int COL { get; set; }=0;      
        public float CalcLength { get; set; }=0;
        public float RemainingPaste { get; set; }=0;
        public List<ProdOrderLineViewModel> ProdOrderLines {get;set;}
    }

 public classProdOrderLineViewModel
    {
        public int ProdOrderLineId { get; set; }
        public int OperationNumber { get; set; }
        public string OperationName { get; set; }
        public string Machine { get; set; }
        public string Recipe1 { get; set; }="";
        public string Recipe1C { get; set; }="";
        public string Recipe2 { get; set; }
        public string Recipe2C { get; set; }
        public string Recipe3 { get; set; }
        public string Recipe3C { get; set; }

        public bool PrintOP { get; set; }=false;

    } 

Many THX in advance for your help.

BR Mirek

Alexander
Telerik team
 answered on 30 May 2022
1 answer
96 views

Is there a way for ASP.NET Core grid to mark a column as NOT resizable? I mean, no way to resize that column, even if others are able to resize?

Please see this thread on SO.

The proposed solution should work does not matter is that column bound to a data or not, is the column last or first or not. Especially the case when the column is the last one and is a command column. Often such columns are of fixed length, cause buttons or commands are fixed. The actions column should not be moved or resized. However, if the column is pushed by others, the column could go out of the visible view. 

Aleksandar
Telerik team
 answered on 30 May 2022
1 answer
1.3K+ views

Hi, I am new to kendo grid and over all telerik, I am having issues populating the data.  

please check the code below. This is the simplest form.  

 

//cshtml view

 

@using Kendo.Mvc
@using Kendo.Mvc.UI
@model IEnumerable<Database.Station>
@{
    ViewBag.Title = "Records";
//    foreach(var v in Model)
//    {
//      var i=  v.Componenet;
//    }
}

@ViewBag.heading
<hr />


<hr />



@if (Model.Any())
{
    <div>

          @(Html.Kendo().Grid(Model) 
    .Name("grid")
    .Columns(columns => {
        columns.Bound(p =>p.ATA).Width(100);
        columns.Bound(p => p.Componenet).Width(100);
        columns.Bound(p => p.Description).Width(140);
        columns.Bound(p => p.DiskNumber);
        columns.Bound(p => p.SoftwareNumber).Width(150);
    })

    .HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
        .Ajax()

        .Read(read => read.Action("Main", "Station"))
     )
)
    </div>
    }

 

//controller

  public IActionResult Main()
        {
            var stationList = new List<Station>();
            var station = new Station
            {
                ATA = "22",
                SoftwareNumber = "check",
                DiskNumber = "1234",
                Componenet = "AC",
                Description = "Description"
            };
            stationList.Add(station);

            var station2 = new Station
            {
                ATA = "29",
                SoftwareNumber = "check2",
                DiskNumber = "1235",
                Componenet = "Bike",
                Description = "Description"
            };
            stationList.Add(station2);
            return Json(stationList);

        }
    }

 

I also noticed following the instruction. it does not tell me to include any css or javascript or any javascript code in script section. so nothing of that natrure is included.  Below is the outcome of the nuget.  I have no css or other js file from kendo. 

 

And this is what i get

                  
Alexander
Telerik team
 answered on 27 May 2022
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?