Questions on UI for ASP.NET MVC Forum

2 answers

1.4K+ views

Hello,

The only way we can access the beforeEdit Event on a kendo grid is with javascript. shouldnt this be accessible through the Kendo.Mvc.UI.Fluent.GridEventBuilder? attached are just images showing that it errors and that we are using Kendo version 2017.2.621.340 as our dll.

the way we did get it to work is by binding it via javascript with this code (for anyone that wants to know how to get this event to work)

$(document).ready(function () {
var grid = $("#BrandsGrid").data("kendoGrid");

grid.bind("beforeEdit", function (e) {
alert("Before Edit");
});

})

but its weird to have 2 of your events using the grid builder and then 1 of your events bound through javascript makes it easy for a developer to miss that the event exists which can lead to them not fully understanding what is happening upon editing the grid.

Thanks,

Thomas

Grid

answered on 25 Oct 2021

1 answer

215 views

Locked column resize fix problem

When the grid is loaded for the first time, the height of the locked column remains constant, the height of the other columns can be changed.

Locked column : " Stok No "

Fixed when changing the width of any column

Grid

answered on 22 Oct 2021

1 answer

180 views

PDF Export not working on iphone Safari

Hello,

I am using the exact example give below in my project:

https://demos.telerik.com/aspnet-mvc/pdf-export

But when i browse this url in my iPhone Safari browser, I am not able to export the PDF. Export as Image and SVG works though. I am seeing the same issue in my project too. Any solution for this?

Thanks

Meera

PDFViewer

answered on 20 Oct 2021

1 answer

897 views

Column value is null only inside client template

Hi! I've been trying to figure this out for days. I have a template that works as detail table of a Kendo grid. Inside this template i have several columns wich data I CAN SEE right. But, one column in particular, that include a client template, is always null. When i get ride of the client template i can see the data on the grid provided by the server, but each time I include the client template, the column is null (html code below)

The first column Adjunto works greats, the seconde one is always null. As it can be seen, there are other client template in the grid that work propery. What can i be doing wrong? Thanks in advance. (I added the view with the two columns righ below)

Grid

answered on 19 Oct 2021

1 answer

665 views

Hide the title in a single column

I would like to hide the last column in my grid.

How can I do this?

Here's my code:

@(Html.Kendo().Grid<GoodNeighbor.Models.TrackingList>()
        .Name("TrackingListGrid")
        .Columns(c =>
        {
            c.Bound(t => t.TrackingListId).Hidden(true);
            c.Bound(t => t.FirstName).Width(115).Title("First Name");
            c.Bound(t => t.LastName).Width(115).Title("Last Name");
            c.Bound(t => t.Email).Width(150);
            c.Bound(t => t.Date).Width(90).ClientTemplate("#= kendo.toString(kendo.parseDate(CreatedDate), 'MM/dd/yyyy') #");
            c.Bound(t => t.Hours).Width(85);
            c.Bound(t => t.VolunteerOrganization).Width(120).Title("Volunteer Organization");
            c.Bound(t => t.ReponseCopy).Width(115).Title("Reponse Copy");
            c.Bound(t => t.Phone).Width(85);
            c.Bound(t => t.Location).Width(85);
            c.Bound(t => t.CreatedDate).Hidden(true);
            c.Bound(t => t.ModifiedDate).Hidden(true);
            c.Bound(p => p.TrackingListId).ClientTemplate("<a href='" + Url.Action("Create", "TrackingList") + "/#= TrackingListId #'" + ">Details</a>"); // Details link
        })
        .HtmlAttributes(new { style = "height: 400px;" })
        .Scrollable()
        .Groupable()
        .Sortable()
        .Filterable()
        .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(5))
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(20)
            .Read(r => r.Action("TrackingListRead", "TrackingList").Data("sendAntiForgery"))
            .Model(model => model.Id(p => p.TrackingListId))
            .Events(events => events.Error("onError"))
        )
    )

Grid

answered on 19 Oct 2021

1 answer

1.3K+ views

TextBox autocomplete attribute gets set to 'off'

I want browsers to offer autocomplete suggestions for a kendo TextBox I have on a form, but it always renders with autocomplete="off" no matter what I set it to in HtmlAttributes config. How do I make it work?

TextBox

answered on 18 Oct 2021

1 answer

126 views

Removed hierarchy cells reappearing after parent grid is filtered or page is changed

I have the following js function that is called during the dataBound event of the parent grid to remove any hierarchal cells, for readability of the users. So they don't have to expand every row to see that there is no data.

function removeHierarchyCell() {
    var data = $('#GridName').data('kendoGrid').dataSource.data();

    // Remove row expansion when no data
    $.each(data, function (i, row) {
        var hasChildren = row.get("ChildModel");

        if (hasChildren === null || hasChildren === undefined || hasChildren.length == 0) {
            $('tr[data-uid="' + row.uid + '" ] ').find(".k-hierarchy-cell a").remove();
        }
    });
}

It works as it should when the page loads, the issue comes when the parent grid is either filtered or on page change. When the grid populate the rows they now have the expand icon in the hierarchy-cell. I've tried several things but these elements always appear after any operation on the parent grid.

Is there some way to keep these removed from the parent grid?

Filter

Grid

answered on 18 Oct 2021

2 answers

441 views

Apply css class to TreeViewItemModel MVC

Hello.

I'm trying to put different color text (and style) on TreeView node item.

I just found that this is archieved with SpriteCssClass property on TreeViewItemModel class but it seems that It is not working.

My view:

<h2>Index</h2>

<script>
    kendo.culture("es-ES"); //week start day depends on the used kendo culture
</script>

@section Menu {
        <h4>Departamento</h4>
        @(
            Html.Kendo().TreeView()
                    .Name("left-menu")
                    .BindTo((IEnumerable<TreeViewItemModel>)ViewBag.depts)
                    .DataSpriteCssClassField("SpriteCssClass")
                    .Events(ev => ev
                        .Select("onSelect")
                        )
        )
}

My CSS file:

/* Treeview Departamentos */

.deptRoot {
    color: dodgerblue;
    font-weight: bold;
}

.deptSub {
    color: cadetblue;
    font-weight: bold;
}

.empSup {
    color:indianred;
    font-weight: normal;
}

.empleado {
    color: white;
    font-weight: normal;
}

This is my JSON Tree data passed by ViewBag.depts var:

[
  {
    "Enabled": true,
    "Expanded": false,
    "Encoded": true,
    "Selected": false,
    "Text": "Informática",
    "SpriteCssClass": "deptRoot",
    "Id": "1#48",
    "Url": null,
    "ImageUrl": null,
    "HasChildren": true,
    "Checked": false,
    "Items": [
      {
        "Enabled": true,
        "Expanded": false,
        "Encoded": true,
        "Selected": false,
        "Text": "Soporte",
        "SpriteCssClass": "deptSub",
        "Id": "2#1001",
        "Url": null,
        "ImageUrl": null,
        "HasChildren": true,
        "Checked": false,
        "Items": [
          {
            "Enabled": true,
            "Expanded": false,
            "Encoded": true,
            "Selected": false,
            "Text": "RAUL MORENO RAMIREZ",
            "SpriteCssClass": "empSup",
            "Id": "3#221",
            "Url": null,
            "ImageUrl": null,
            "HasChildren": true,
            "Checked": false,
            "Items": [
              {
                "Enabled": true,
                "Expanded": false,
                "Encoded": true,
                "Selected": false,
                "Text": "BRIAN SALAZAR MUÑOZ",
                "SpriteCssClass": "empleado",
                "Id": "4#585",
                "Url": null,
                "ImageUrl": null,
                "HasChildren": false,
                "Checked": false,
                "Items": [

                ],
                "HtmlAttributes": {

                },
                "ImageHtmlAttributes": {

                },
                "LinkHtmlAttributes": {

                }
              }
            ],
            "HtmlAttributes": {

            },
            "ImageHtmlAttributes": {

            },
            "LinkHtmlAttributes": {

            }
          }
        ],
        "HtmlAttributes": {

        },
        "ImageHtmlAttributes": {

        },
        "LinkHtmlAttributes": {

        }
      },
      {
        "Enabled": true,
        "Expanded": false,
        "Encoded": true,
        "Selected": false,
        "Text": "Desarrollo",
        "SpriteCssClass": "deptSub",
        "Id": "2#1002",
        "Url": null,
        "ImageUrl": null,
        "HasChildren": true,
        "Checked": false,
        "Items": [
          {
            "Enabled": true,
            "Expanded": false,
            "Encoded": true,
            "Selected": false,
            "Text": "GUILLEM ALBERT JULVE SEGOVIA",
            "SpriteCssClass": "empSup",
            "Id": "3#292",
            "Url": null,
            "ImageUrl": null,
            "HasChildren": false,
            "Checked": false,
            "Items": [

            ],
            "HtmlAttributes": {

            },
            "ImageHtmlAttributes": {

            },
            "LinkHtmlAttributes": {

            }
          }
        ],
        "HtmlAttributes": {

        },
        "ImageHtmlAttributes": {

        },
        "LinkHtmlAttributes": {

        }
      },
      {
        "Enabled": true,
        "Expanded": false,
        "Encoded": true,
        "Selected": false,
        "Text": "MTRANS",
        "SpriteCssClass": "deptSub",
        "Id": "2#1003",
        "Url": null,
        "ImageUrl": null,
        "HasChildren": true,
        "Checked": false,
        "Items": [
          {
            "Enabled": true,
            "Expanded": false,
            "Encoded": true,
            "Selected": false,
            "Text": "CARLOS LUNA PACHECO",
            "SpriteCssClass": "empSup",
            "Id": "3#40",
            "Url": null,
            "ImageUrl": null,
            "HasChildren": true,
            "Checked": false,
            "Items": [
              {
                "Enabled": true,
                "Expanded": false,
                "Encoded": true,
                "Selected": false,
                "Text": "ALBERT FERRANDIZ ISERTE",
                "SpriteCssClass": "empleado",
                "Id": "4#576",
                "Url": null,
                "ImageUrl": null,
                "HasChildren": false,
                "Checked": false,
                "Items": [

                ],
                "HtmlAttributes": {

                },
                "ImageHtmlAttributes": {

                },
                "LinkHtmlAttributes": {

                }
              }
            ],
            "HtmlAttributes": {

            },
            "ImageHtmlAttributes": {

            },
            "LinkHtmlAttributes": {

            }
          }
        ],
        "HtmlAttributes": {

        },
        "ImageHtmlAttributes": {

        },
        "LinkHtmlAttributes": {

        }
      }
    ],
    "HtmlAttributes": {

    },
    "ImageHtmlAttributes": {

    },
    "LinkHtmlAttributes": {

    }
  }
]

All items have the same text color. Where is the mistake?

Thx in advance for who resolve this ;)

KR

TreeView

answered on 11 Oct 2021

0 answers

242 views

Kendo Scheduler (Wrong Appointment Time Shown on Calendar) Asp.Net MVC

Hi ,

I am Using kendo scheduler
I am facing issue wrong appointment time is shown on the calendar. The appointment is Stored in Database as Datetime.
and I'm retrieving the database value and showing values in kendo scheduler control
here in my local solution its showing correct data time (database value : 5 PM Indian timing Its showing correctly)

but in server side its showing wrong time(UK Timimg, Its showing wrong time)

Scheduler

asked on 11 Oct 2021

6 answers

108 views

Scheduler customeditor - apend patrial view

Hello,
I need to append partial view into custom editor.

Scenario: When the user clicks the add button in the editor, another line (div) should appear in the custom editor with a drop down list.
Or is there another solution instead of using the patriarchal view? Any examples are welcome :)

Thanks.

Regards
Frank

Scheduler

updated answer on 11 Oct 2021