Telerik Forums
UI for ASP.NET MVC Forum
1 answer
48 views

I am working with a Kendo grid on my MVC webapp.  The grid is bound by data passed to the View.  An event currently exists to load another grid when a row is selected/clicked on.  I have been tasked with adding a column that contains a checkbox based on a boolean value from the record in the dataset.  Until this point, everything is working.

My question is, how can I add an event to whenever the checkbox is checked and unchecked while keeping the event fro when a row is selected?  That is, if the user clicks on the row, I still want it to load the other grid based on the selected row, but if the user clicks on the checkbox in the row, I want it call a function to toggle the value and update the database (essentially call function changeFlag).  As a test, I put an alert() call in the function which runs when a row is selected, but the function never fires if I check/uncheck the checkbox.

I have some exposure to MVC, but Telerick/Kendo are completely new for me.  Any ideas, tips, or guidance would be greatly appreciated.

Anton Mironov
Telerik team
 answered on 23 Oct 2023
1 answer
129 views

Hello

I currently have an kendo grid with PDF export functionality, I am trying to add in the facilities to add a line header text to the exported PDF and have tried using both a grid header text box and a javascript alert on button click, however when I try to do this either the application tries to export indefinitely, or the header text is not included. Can anyone suggest where I may be going wrong with this?


View code:

@(Html.Kendo().Grid<Planner.Models.GetTaskList_Result1>()
                                                                                .Name("grid")
                                                                                .Columns(columns =>
                                                                                {
                                                                                    columns.Bound(p => p.DateCreated).Title("Date Created").Format("{0:dd/MM/yy}").Width(120);
                                                                                    columns.Bound(p => p.TaskNo).Title("TaskNo").Width(90);
                                                                                    columns.Bound(p => p.TaskDescription).Title("Task").Width(200);
                                                                                    columns.Bound(p => p.PriorityText).Title("Priority").Width(90);
                                                                                    columns.Bound(p => p.AreaText).Title("Area").Width(140);
                                                                                    columns.Bound(p => p.QS1).Title("Quality Statement").Width(150);
                                                                                    columns.Bound(p => p.KA1).Title("KLOE Area 1").Width(150);
                                                                                    columns.Bound(p => p.KC1).Title("KLOE Characteristic 1").Width(200);
                                                                                    columns.Bound(p => p.KA2).Title("KLOE Area 2").Width(150).Hidden(true);
                                                                                    columns.Bound(p => p.KC2).Title("KLOE Characteristic 2").Width(150).Hidden(true);
                                                                                    columns.Bound(p => p.KA3).Title("KLOE Area 3").Width(150).Hidden(true);
                                                                                    columns.Bound(p => p.KC3).Title("KLOE Characteristic 3").Width(150).Hidden(true);
                                                                                    columns.Bound(p => p.KA4).Title("KLOE Area 4").Width(150).Hidden(true);
                                                                                    columns.Bound(p => p.KC4).Title("KLOE Characteristic 4").Width(150).Hidden(true);
                                                                                    columns.Bound(p => p.KA5).Title("KLOE Area 5").Width(150).Hidden(true);
                                                                                    columns.Bound(p => p.KC5).Title("KLOE Characteristic 5").Width(150).Hidden(true);
                                                                                    columns.Bound(p => p.LeadAssigned).Title("Lead Assigned").Width(120);
                                                                                    columns.Bound(p => p.SupportAssigned).Title("Support Assigned").Width(150);
                                                                                    columns.Bound(p => p.DateDue).Title("Date Due").Format("{0:dd/MM/yyyy}").Width(120);
                                                                                    columns.Bound(p => p.StatusText).Title("Status").Width(120);
                                                                                })
                                                                                .Resizable(resize => resize.Columns(true))
                                                                                .Selectable(selectable => selectable.Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
                                                                                .Events(events =>
                                                                                {
                                                                                    events.Change("onChange");
                                                                                    events.PdfExport("GetHeaderText");
                                                                                })
                                                                                .Sortable()
                                                                                .ToolBar(toolBar =>
                                                                                {

                                                                                toolBar.Template(
                                                                                        @<Text>
                                                                                        <b class="FloatRight SearchTopMarginExtra">Search by Task Description/Staff: </b>
                                                                                        <input type="search" id="searchbox" class="SearchRight SearchTopMargin" />
                                                                                        <b class="FloatRight">Date From:</b>
                                                                                        <input type="date" id="DateFrom" />
                                                                                        <b class="FloatRight">Date To:</b>
                                                                                        <input type="date" id="DateTo" />
                                                                                        <button id="clearFiltersButton" class="k-button">Clear Filters</button>
                                                                                         ||
                                                                                        <a class="k-button k-button-icontext k-grid-pdf" href="\#"><span class="k-icon k-i-pdf"></span>Export to PDF</a>
                                                                                        <b class="float-right">Title on PDF:</b>
                                                                                        <input type="text" id="PDFTitle" />
                                                                                        </Text>);
                                                                                })
                                                                                .Pdf(pdf => pdf
                                                                                        .AllPages()
                                                                                        .AvoidLinks()
                                                                                        .PaperSize("A4")
                                                                                        .Scale(0.45)
                                                                                        .Landscape()
                                                                                        .Margin("2cm", "1cm", "1cm", "1cm")
                                                                                        .TemplateId("page-template")
                                                                                        .FileName("Active tasks " + DateTime.Today.ToString("d") + ".pdf")
                                                                                        .ProxyURL(Url.Action("Pdf_Export_Save", "Grid"))
                                                                                    )
                                                                                                .Scrollable(scrollable => scrollable.Enabled(true).Height("600px"))
                                                                                                .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                                                                                                .DataSource(datasource => datasource
                                                                                                .Ajax()
                                                                                                .Filter(filters =>
                                                                                                {
                                                                                                    filters.Add(f => f.Completed).IsEqualTo(false);
                                                                                                })
                                                                                                .Sort(sort => sort.Add("DateDue").Ascending())
                                                                                                .Model(model => model.Id(p => p.TaskNo))
                                                                                                .Read(read => read.Action("Tasks_Read", "TaskList"))
                                                                                                )

                                                                                                .Pageable(pageable => pageable
                                                                                                .Enabled(false))
                                                                                                .Events(e => e.DataBound("onDataBound"))



    )

Relevant javascript and template:

    
<script type="text/javascript">    

    $(document).ready(function () {
        $("#PDFTitle").keyup(function SetViewData() {
            var val = $("#PDFTitle").val();
           
            var text = document.getElementById('customHeaderText');
            text.val() = val.val();
        })
    });
</script>



<script type="x/kendo-template" id="page-template">
    <div class="page-template">
        <div class="header">
            #: customHeader #

            @Html.Label("", new { id = "customHeaderText" })
        </div>
        <div class="footer">
            <div style="float: right">Page #: pageNum # of #: totalPages #</div>
        </div>
    </div>
</script>

<script type="text/javascript">
    function GetHeaderText(e) {
        var customHeader = prompt('Please enter a title for the PDF');
    }

</script>

 

                                                                                                
Eyup
Telerik team
 answered on 07 Mar 2023
1 answer
38 views

Hi there!


I would like to customize the header of GanttChart timeline, like 

if it is WeekView,  "2023/2" in 1st line and "1" , "8" (← it will be the first day of week) in 2nd line  or

if it is MonthlyView, "2023/Q1" in 1st line and "2", "3" (← it will be the month number like "2" means Feburay) in 2nd line.

let me know how should I customize to that.

I think that I should use "Views.MonthView.MonthHeaderTemplate" function, but I have no idea how I used it.

I found this API from this following link, but I can't get detail info because it had died.

ASP.NET MVC Gantt - API Reference - Telerik UI for ASP.NET MVC

Could you please share me if there is any link in which explaination for gantt API info, how to use or which parameter should be passed.

Eyup
Telerik team
 answered on 20 Feb 2023
1 answer
64 views

I have a grid that has a column that should only be shown if a user selects an option on the view (default is set to hidden). 

Is there a standard way to toggle the visibility of a column dynamically via javascript? 

Ivan Danchev
Telerik team
 answered on 18 Oct 2022
0 answers
54 views

Hello everyone,

I have a clientfootertemplate in a subcolumn and I want to show something in my column but when I do this the colspan is 3 instead of 1 so instead of 1 column he takes 3 columns.

Can someone help me with this?

Toinon
Top achievements
Rank 1
 updated question on 05 Oct 2022
1 answer
54 views

Hi,

When I add .OpenOnClick(true) to my menu and I click on the menu to display the submenu, the page reloads automatically.

Do I need to add another instruction to prevent the page reloading? What's the problem?

 

Thank's in advance.

 

Ignacio

Eyup
Telerik team
 answered on 09 Sep 2022
0 answers
65 views

I'm using EditorTemple to populate dropdown while in edit mode. I have my editor template in the Views/Shared/EditorTemplates folder.

But when I press the Edit button it does nothing and shows a simple text box instead of a dropdown.

Here's my code of Grid:


@(Html.Kendo().Grid<object>()
                                        .Name("Grid")
                                        .AutoBind(true)
                                        //.Events(ev => ev.Filter("setGridFilters").DataBound("setAutoFitColumn"))
                                        .Columns(columns =>
                                        {
                                            columns.AutoGenerate(true);
                                            columns.Bound("status").Title("Lead Status").Width(100).EditorTemplateName("LeadStatusList")
                                            .Filterable(a=>a.Multi(true).Search(true).BindTo(new[] {
                                            new{
                                                status="None"
                                            },
                                            new{
                                                status="Initial Call Scheduled"
                                            },
                                            new{
                                                status="Working"
                                            },
                                            new{
                                                status="Nurturing"
                                            },
                                            new{
                                                status="Unqualified"
                                            },
                                            new{
                                                status="Qualified"
                                            }
                                            }));
                                            columns.Bound("ownerId").Title("Owner").Width(100).Filterable(a => a.Multi(true).Search(true).DataSource(ds => ds.Custom()

                                            .Type("aspnetmvc-ajax")
                                            .Transport(transport =>
                                            transport.Read(read => read.Action("", "", new { field = "ownerId" }))
                                            )
                                            .Schema(schema => schema
                                            .Data("names")
                                            )));
                                            columns.Bound("eventBookedC").ClientTemplate("<div   title='#= title #'>#:getEventStatus(eventBookedC) #</div>").Title("Event Booked").Width(70)
                                            .Filterable(a => a.Multi(true).Search(true).BindTo(new[] {
                                            new{
                                                eventBookedC="Null"
                                            },
                                            new{
                                                eventBookedC="True"
                                            },
                                            new{
                                                eventBookedC="False"
                                            }
                                            }));
                                            columns.Command(command => { command.Edit();}).Width(150);
                                        })
                                        .Editable(editable => editable.Mode(GridEditMode.InLine))
                                    .Sortable()
                                    .Filterable()
                                    .Scrollable(sc => sc.Endless(true))
                                    .Groupable()
                                    .Resizable(resize => resize.Columns(true))
                                    .Reorderable(reorder => reorder.Columns(true))

                                    .ToolBar(e =>
                                    {
                                        e.Search();
                                        e.Custom().Text("Create New").HtmlAttributes(new { id = "btnCreateNew", @class = "btn btn-primary" });
                                    })
                                    .Pageable(p => p.Numeric(false).PreviousNext(false).Refresh(true))
                                    .Events(events => events
                                    .Sort("onSorting")
                                    .Filter("onFiltering")
                                    .Group("onGrouping")
                                    .Page("onPaging")
                                    .GroupCollapse("onGroupCollapse")
                                    .GroupExpand("onGroupExpand")
                                    .DataBound("onDataBound")
                                    .ColumnReorder("onColumnReordering")
                                    .Edit("edit")
                                     )


                                     .DataSource(dataSource => dataSource
                                        .Custom()
                                         .Type("aspnetmvc-ajax")
                                         .PageSize(500)
                                         .ServerPaging(true)
                                         .ServerFiltering(true)
                                         .ServerSorting(true)
                                         .ServerGrouping(true)
                                         .Transport(transport =>
                                         {
                                             transport.Read(read => read.Action("", ""));
                                             transport.Update(update => update.Action("", ""));
                                         }
                                         )
                                         .Schema(schema => schema
                                         .Data("data")
                                         .Total("total")
                                         .Model(m=>m.Id("id"))
                                         )
                                         )

                                 )

 

Here's my editor template -> LeadStatusList.cshtml:


@using Kendo.Mvc.UI
@model AzranHawkins.Models.Lead
@(Html.Kendo().DropDownListFor(x => x.Status)
                              .DataTextField("Text")
                              .DataValueField("Value")
                              .BindTo(new List<SelectListItem>() {
                                  new SelectListItem() {
                                      Text = "None",
                                      Value = "None"
                                  },
                                  new SelectListItem() {
                                      Text = "Initial Call Scheduled",
                                      Value = "Initial Call Scheduled"
                                  },
                                  new SelectListItem() {
                                      Text = "Working",
                                      Value = "Working"
                                  },
                                   new SelectListItem() {
                                      Text = "Nurturing",
                                      Value = "Nurturing"
                                  },
                                    new SelectListItem() {
                                      Text = "Unqualified",
                                      Value = "Unqualified"
                                  },
                                    new SelectListItem() {
                                      Text = "Qualified",
                                      Value = "Qualified"
                                  }
                              })
                              .Value("1")
                              .HtmlAttributes(new { style = "width: 100%" })
                        )

 

I also tried

Html.Kendo().DropDownList().Name("Status") instead of Html.Kendo().DropDownListFor(x => x.Status)

Zack
Top achievements
Rank 1
 updated question on 09 Jul 2022
1 answer
208 views

Hi, 

?EGood Day,

 

I am new to kendo ui and we are having an issue due to the upgrade of Jquery (1.x.x->3.6.0). The issue is "Syntax error, unrecognized expression: .field-validation-valid[data-valmsg-for=], .field-validation-error[data-valmsg-for=]" once the validation on the screen fires. Correct me if I am wrong, kendo ui should not be dependent on any Jquery versions. We are also checking if we need to change the validation process instead of using the said kendo validator. We are still hoping that there is still a way to fix this issue.
Below is the kendo version we are currently using.

Kendo Version: 2012.3.1114.340
Platform: ASP.NET MVC

Found the cause _findMessageContainer it is on the kendo.web.js, will just comment this to fix the issue

Ivan Danchev
Telerik team
 answered on 25 Jan 2022
1 answer
225 views

Hi all,

I started working with Blazor few weeks ago and recently got introduced to Telerik UI for Blazor so I started making a CRUD to learn.

After coding the update function I tested the app and got this error when I tried to update a register:

The instance of entity type 'Familia' cannot be tracked because another instance with the same key value for {'CodiFamilia'} is already being tracked.

To solve that I added "AsNoTracking" to the Entity Framework Core query located in "ReadList", it worked the first time but the app crashed after the second update. Afterwards I implemented an alternative solution which consists on finding the object by its ID and updating every parameter one by one which worked since it's not using the same object.

I'm wondering if there is any way to implement a functional update which resembles the first solution because the second one is pretty bad if there are many parameters to update azarshagle.

Thanks in advance.

Jack
Top achievements
Rank 1
 updated question on 16 Dec 2021
1 answer
202 views

Simple question: what NuGet files and namespaces contain the "ToPagedList" methods?

Detail:

New to Telerik, new to these Forums, but thrilled they are here. I have what SHOULD be a simple question...

Web Application written 4 years ago using Telerik ASP.NET MVC (I think) and Telerik Kendo (I think). The 2017 App is running in production, but I need to make changes in the code (new feature stuff). Meanwhile, the guy who wrote it is no longer here - there is no one left who has touched it. Undocumented, of course. And we have moved from Visual Studio 2017 to Visual Studio 2019.

So I am trying to get the application to build pretty much "as is" so I can tinker with it and see how it works, and figure out exactly where I need to make changes. First build had 274 errors, then 64 errors... now down to 1 error in two places in one class; a reference to "ToPagedList" which is a method apparently used to pluck a specified page or pages from a result set for rendering (in a Grid?). Virtually all of that was uninstalling and reinstalling NuGet files because somehow they lost their initialization in the app files. So, plenty of places I could have gone awry.

"ToPagedList" works on a View derivative class; but apparently I am not including the proper Telerik references and libraries to get these two references to "ToPagedList" to resolve. Probably have some class confusion as well (something referencing Microsoft instead of Telerik). 

The first of the two errors, other is basically identical in the same class:

Severity Code Description Project File Line Suppression State
Error CS1061 'IQueryable<IncidentDetailView>' does not contain a definition for 'ToPagedList' and no accessible extension method 'ToPagedList' accepting a first argument of type 'IQueryable<IncidentDetailView>' could be found (are you missing a using directive or an assembly reference?) QCWeb D:\QCWeb\QCWeb\Controllers\ReportController.cs 248 Active

Line 248 looks like:

return View(tickets.ToPagedList(pageNumber, pageSize));

where tickets is an instantiation of the "IQueryable<IncidentDetailView>",

and IncidentDetailView is partial class that contains the Entity Framework record field definitions for a database pseudo-table (query results).

If I could figure out which Telerik library that this method is defined in, I can probably work back to get other references properly aligned as well (ever the optimist). I am just not having much luck searching the Telerik documentation for class method lists and descriptions, nor am I having much luck playing library roulette. Any ideas?  Thanks!!

Ivan Danchev
Telerik team
 answered on 29 Nov 2021
Narrow your results
Selected tags
Tags
+? more
Top users last month
horváth
Top achievements
Rank 2
Iron
Iron
Steve
Top achievements
Rank 2
Iron
Erkki
Top achievements
Rank 1
Iron
Mark
Top achievements
Rank 2
Iron
Iron
Veteran
Jakub
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
horváth
Top achievements
Rank 2
Iron
Iron
Steve
Top achievements
Rank 2
Iron
Erkki
Top achievements
Rank 1
Iron
Mark
Top achievements
Rank 2
Iron
Iron
Veteran
Jakub
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?