Hi I am having a bit of an issue.

I am trying to move the headers down the left i am trying to create something like this - 

Title              Value

created         11/05/2016

Duration        11:05:20

FPS               60

I have attached a screenshot.

I really want all my items to be the same hence why I want it as a kendo grid.

Any help would be appreciated.

Hi, I am using the upload widget with angular. 

I am looking for it to achieve the following:

1) have something like k-files = "initialFiles" in the input options; to display list of previously loaded files. 

I tried using k-files along with in javascript code; but that does not work.. how do I make this feature work? 

2) Is there a way to use template (again using angular) to make the previously uploaded files downloadable? I saw a similar post but it had no examples. Can you give a small example on how to do this? 

Thanks

The titles on Row 1 seem to be set to what's coming down from the service, how can I customize them?  Like the JSON is "studyId" but the client wants "Study_ID".

Is this possible?  I tried setting the cell value property but doesn't seem to work.

I am using 3 Kendo grids.

Each grid has the ability to Export to Excel using toolbar template. 

This was all working until recently. Now it does not work on any grid. 

I am not sure what environmental issue I created. 

Here is the code. 

BundledConfig:

  //Telerik 
            bundles.Add(new ScriptBundle("~/bundles/kendo").Include(
                "~/Scripts/kendo/kendo.all.min.js",
                "~/Scripts/kendo/kendo.web.min.js",
                "~/Scripts/kendo/kendo.aspnetmvc.min.js",
                 "~/Scripts/jszip.min.js"));

View:

   <div class='pull-left'>
        <a class="k-button k-button-icontext" href="javascript:void(0)" onclick="customCommand()"><span class="k-icon k-add"></span>Add new transfer</a>
        <button class="k-button k-button-icontext k-grid-excel" type="button"><span class="k-icon k-i-excel"></span>Export to Excel</button>
        <button class="k-button k-button-icontext k-grid-pdf"><span class="k-icon k-i-pdf"></span>Export to PDF</button>

@helper ToolbarTemplate2()
{
    <div class='pull-left'>
        <button class="k-button k-button-icontext k-grid-excel" type="button"><span class="k-icon k-i-excel"></span>Export to Excel</button>
        <button class="k-button k-button-icontext k-grid-pdf"><span class="k-icon k-i-pdf"></span>Export to PDF</button>
    </div>
}

@(Html.Kendo().Grid<TransferView>()
                    .Name("grid")
                    .Columns(columns =>
                    {
                        columns.Bound(e => e.TransferId).Title("ID").Width(60);
                        columns.Bound(e => e.FromDescription).Width(180);
                        columns.Bound(e => e.ToDescription).Width(180);
                        columns.Bound(e => e.FromDept).Width(120);
                        columns.Bound(e => e.ToDept).Width(120);
                        columns.Bound(e => e.CreateDate).Hidden();
                        columns.Bound(e => e.CreateProfile).Hidden();
                        columns.Bound(e => e.ChangeDate).Hidden();
                        columns.Bound(e => e.ChangeProfile).Hidden();
                        columns.Bound(e => e.ApprovalFlag).Hidden();
                        columns.Bound(e => e.ApprovalDate).Hidden();
                        columns.Bound(e => e.ApprovalProfile).Hidden();
                        columns.Bound(e => e.PostedDate).Hidden();
                        columns.Bound(e => e.PostedFlag).Hidden();
                        columns.Bound(e => e.ReceivedDate).Hidden();
                        columns.Bound(e => e.TrnComment).Hidden();
                        columns.Command(command =>
                        {
                            command.Custom("Edit").Click("showDetails");
                            command.Custom("Delete").Click("deleteTransfer").HtmlAttributes(new { @style = "border-color: #b92c28; background-color: #d9534f; color:white" });
                        }).Width("20%");
                    })
                    .Sortable()
                    .Filterable(ftb => 
                    {
                        ftb.Mode(GridFilterMode.Row);
                    })
                .ColumnMenu()
                .ToolBar(toolbar =>
                {
                toolbar.Template(@<text>@ToolbarTemplate()</text>);
                })
                .Sortable()
                .Pageable()
                .Scrollable(a => a.Height("auto"))
                .Resizable(resize => resize.Columns(true))
                .Excel(excel => excel
                        .FileName("alltransfers.xlsx")
                        .Filterable(true)
                        .AllPages(true)
                      )
                .Groupable()
                .Reorderable(Reorder => Reorder.Columns(true))
                .Navigatable()
                .Pageable(pager => pager.PageSizes(new[]
                    {
                        10,
                        20,
                        30,
                        40,
                        50,
                        100
                    }))

                .ClientDetailTemplateId("template")
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .PageSize(10)
                    .Read(read => read.Action("GetAllTransfersForStore", "Transfer"))
                )
                .Events(events => events
                  .DataBound("dataBound")
                  .DetailExpand("detailExpand"))
)

<script id="template" type="text/kendo-tmpl">
    @(Html.Kendo().TabStrip()
            .Name("tabStrip_#=TransferId#")
            .SelectedIndex(0)
            .Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
            .Items(items =>
            {
            items.Add().Text("Transactions")
                .Content(
                @<text>
                    @RenderTabStrip()
                </text>);
                items.Add().Text("Transfer Information").Content(
                       "<div class='row'>" +
                        "<div class='col-md-4'>" +
                            "<ul>" +
                                "<li><label>Created Date</label> #= CreateDate #</li>" +
                                "<li><label>Created By</label> #= CreateProfile #</li>" +
                                "<li><label>Changed Date</label> #= ChangeDate #</li>" +
                                "<li><label>Changed By</label> #= ChangeProfile #</li>" +
                                 "<li><label>Received Date </label> #= ReceivedDate #</li>" +

                            "</ul>" +
                        "</div>" +
                        "<div class='col-md-4'>" +

                            "<ul>" +

                            "<li><label>Approval Yes/No</label> #= ApprovalFlag #</li>" +
                            "<li><label>Approval Date</label> #= ApprovalDate #</li>" +
                             "<li><label>Approval Profile</label> #= ApprovalProfile #</li>" +
                            "<li><label>Posted Date</label> #= PostedDate #</li>" +
                            "<li><label>Posted Yes/No</label> #= PostedFlag #</li>" +
                        "</ul>" +
                        "</div>" +
                    "</div>"

                          );

            })
            .ToClientTemplate())}

    @helper RenderTabStrip()
    {    @(Html.Kendo().Grid<TransferLine>()
                .Name("grid_#=TransferId#")
                .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                .ColumnMenu()
                .ToolBar(toolbar =>
                 {
                     toolbar.Template(@<text>@ToolbarTemplate2()</text>);
                 })
                .Sortable()
                .Pageable()
                .Resizable(resize => resize.Columns(true))
                .Scrollable(a => a.Height("auto"))
                .Groupable()
                .Reorderable(Reorder => Reorder.Columns(true))
                .Navigatable()
                .Pageable(pager => pager.PageSizes(new[]
                    {
                        10,
                        20,
                        30,
                        40,
                        50,
                        100
                    }))
                .Columns(columns =>
                {
                    //columns.Bound(e => e.FromStoreNumber).Hidden();
                    //columns.Bound(e => e.T).Hidden());
                    //columns.Bound(e => e.FromDept).hidden();
                    //columns.Bound(e => e.ToDept).hidden();
                    columns.Bound(e => e.TransferId).Title("ID").Width(70);
                    columns.Bound(e => e.ItemUpc).Title("UPC").Width(500);
                    columns.Bound(e => e.Quantity).Width(120);
                    columns.Bound(e => e.UnitPrice).Width(120);
                    columns.Bound(e => e.ItemUOM).Width(120);
                    columns.Bound(e => e.ExtendedPrice).Format("{0:C}").Width(120);
                    columns.Bound(e => e.TrnComment).Hidden();
                    //columns.Command(command =>
                    //{
                    //    command.Custom("Delete").Click("deleteLine");
                    //}).Width("20%");

                })
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .PageSize(10)
                .Read(read => read.Action("GetAllLinesForId", "Transfer", new { id = "#=TransferId#" }))

                )
                .Pageable()
                .Sortable()
                .ToClientTemplate())
}
</script>

Any ideas would be appreciated. 

Hi,

I have a mobile navbar / toolbar. It only has one item, but is showing an empty Overflow Anchor (see image attached). How can remove the overflow anchor? (Or is there some method to flag for it to auto-hide itself when it's empty?)

I'm trying to adapt the Kendo Mobile demo here: http://demos.telerik.com/php-ui/m/index#navbar/adaptive-toolbar

My code follows.

Thanks.

-Paul

In my cshtml, I am rendering a template that will be used via javascript.

Note that I'm using @Html.Raw to output the value and text of the select items. This is necessary because we support several languages and without the @Html.Raw, the result is an invalid template.

If I keep the @Html.Raw, I'm exposing a potential hole for XSS because this data is supplied by the user.

How can I allow multiple locales and not expose an XSS vulnerability (without having to encode the data stored in the DB)?

Thanks,

--Ed

I really hope someone can assist me.  I am new to MVC and Telerik Controls.  I have use the Jquery version of the Telerik Grid to display lists of parent data from my database and implemented server paging/sorting etc and this has gone well so far.

I have a list of Issues and when an item is double clicked, an issue detail view is opened (this is a razor view, with additional information to display to that contained in the grid).  I have done this by implementing a jquery call on the double click of the kendo grid. (If there is a nicer way to do this using the popup mode please could someone let me know as I found popup mode relied on the data available to the grid??)

The issue detail view need to present a list of all issue comments related to the issue and allow adding/editing and removing of them.

I would like to use the kendo grid for this list too as their may be a lot of comments and I would like to implement paging for them.

I have EF as my data layer with unit of work and repository pattern and a business layer with business models.  I am then translating to View models and currently I have an Issue view model with a List<IssueCommentsVM> property populated.

However, I am currently getting the data for IssueComments via the grids read operation to a 'GetIssueComments' action on the controller.

Issues I am having:-

- I need to be able to create a new issue and add multiple issue comments to the grid and save both the issue and the issue comments entered at the same time

- When editing an issue, there may be a lot of comments, so I would like server side paging/filtering/sorting implemented, but when I change the page/filter etc, my edits will be lost??

Is there a good way of getting the kendo grid to add/edit and delete Issue Comments in bulk edit style way, maintaining state if pages are changed or filtering is applied so that when they save the Parent Issue, the child Issue Comment changes are all passed to the Issue Save action method.

I was thinking maybe there is a way to bind the grid to the parent models child data List<IssueCommentVM> and getting add/edit/delete to post and update this model and refresh the page and hence child grid, but then how would I handle paging etc as I don't want to return all comments to the parent model, just the requested page, but I still need to save changes.

Can anyone help me out, this seems so complicated, there has to be something I am missing in my understanding.