Telerik Forums
UI for ASP.NET MVC Forum
0 answers
3 views

I'm using .paperSize("auto") for my Export to PDF, and I want using the .TemplateId("templateName") so that I could include a header when I export to PDF. Using paperSize("auto") will not apply the template. How do I use paperSize("auto") and also include a header? Any help with be appreciated

<script type="x/kendo-template" id="page-template">

        <div class="page-template">
            <div class="header">
                #=getDllValueForPrint()#
            </div>
            <div class="footer">
                @*<div style="float: right">Page #: pageNum # of #: totalPages #</div>*@
            </div>
        </div>
    </script>
                                                    .Pdf(pdf => pdf
                                                    .FileName("Customer Orders Summary (Yearly).pdf")
                                                    .AllPages()
                                                    .PaperSize("auto")
                                                    .Margin("2cm", "1cm", "1cm", "1cm")
                                                    .Landscape()
                                                    .TemplateId("page-template")
    function getDllValueForPrint() {
        var CustomerID = $("#CustomerID").data('kendoDropDownList');
        var selectedCustomerName = CustomerID.text();
        return selectedCustomerName;
    }

Andrew
Top achievements
Rank 1
 asked on 06 May 2021
0 answers
5 views

This is a follow up question of this question:

https://www.telerik.com/forums/cannot-read-property-'removeclass'-error-after-calling-setoptions

I made that work, and I'm calling the setOptions method and it is setting the Height, PageSize and PageSizes properties. 

But now, I'm having a different issue. I'm working on a grid that has a button on the toolbar. This is the code for the toolbar.

                            .ToolBar(t =>
                            {
                            t.Template(@<text>
                                    <div class="grid-toolbar-primary">
                                        @(Html.Kendo().Button()
                                                .Name("appSettingItemAddButton")
                                                .Content(HtmlLocaleHelper.GetLabelText(CoreConstants.Localization.Labels.Grid.CreateNew).ToString())
                                                .HtmlAttributes(new { @type = "button" })
                                                .Events(e => e.Click("onAppSettingGridOnAdd")))
                                    </div>
                                </text>);
                            })

This code is working fine, and the toolbar and the button are being displayed. But with my new code, that call the setOptions method, the toolbar and the button are not being displayed anymore.

I found this post on the forum Save/Load - Custom Toolbar Disappears in UI for ASP.NET MVC | Telerik Forums, and it looks like it is a known issue. According to what I found, the workaround is to get the options and save them somehow, and then use that value to set the options again. 

In my case, I will need to also change the Height, PageSize and PageSizes, so I started by trying to just get the toolbar and set it, but is not working:


            //Get the settings to set the toolbar
            var options = kendo.stringify(grid.getOptions());
            console.log("options = " + options);
            if (options) {
                var parsedOptions = JSON.parse(options);
                console.log("parsedOptions: ");
                console.log(parsedOptions);
                console.log("#grid-toolbar-primary: ");
                console.log($("#grid-toolbar-primary").html());
                parsedOptions.toolbar = [
                    { template: $("#grid-toolbar-primary").html() }
                ];
                var optToolbar = parsedOptions.toolbar;
                console.log("optToolbar: ");
                console.log(optToolbar);
            }

            grid.setOptions({
                groupable: true
                , pageable: {
                    pageSizes: selPageSizes,
                    pageSize: selDefaultPageSize
                }
                , dataSource: { pageSize: selDefaultPageSize }
                , height: selGridHeight
                , toolbar: optToolbar
            });

Just to test it, I also tried to just get the options and then set them again (no changes at all), but I still can't see the toolbar after setting the options:

            //Get the settings to set the toolbar
            var options = kendo.stringify(grid.getOptions());
            console.log("options = " + options);
            if (options) {
                var parsedOptions = JSON.parse(options);
                console.log("parsedOptions: ");
                console.log(parsedOptions);
                console.log("#grid-toolbar-primary: ");
                console.log($("#grid-toolbar-primary").html());
                parsedOptions.toolbar = [
                    { template: $("#grid-toolbar-primary").html() }
                ];
                var optToolbar = parsedOptions.toolbar;
                console.log("optToolbar: ");
                console.log(optToolbar);

                grid.setOptions(parsedOptions);
            }

If I look at the console, the parsedOptions object has a toolbar object, but it looks empty:

  1. toolbarArray(1)
    1. 0:
      1. templateundefined
      2. __proto__:
        1. constructorƒ Object()
        2. hasOwnPropertyƒ hasOwnProperty()
        3. isPrototypeOfƒ isPrototypeOf()
        4. propertyIsEnumerableƒ propertyIsEnumerable()
        5. toLocaleStringƒ toLocaleString()
        6. toStringƒ toString()
        7. valueOfƒ valueOf()
        8. __defineGetter__ƒ __defineGetter__()
        9. __defineSetter__ƒ __defineSetter__()
        10. __lookupGetter__ƒ __lookupGetter__()
        11. __lookupSetter__ƒ __lookupSetter__()
        12. get __proto__ƒ __proto__()
        13. set __proto__ƒ __proto__()
    2. length1
    3. __proto__Array(0)

In summary, what I need to do is to modify a grid for the three properties (Height, PageSize, PageSizes) and make sure that the grid will still work as it was designed originally.

Is there a way to do this?

Thanks.

Alex
Top achievements
Rank 1
 asked on 04 May 2021
0 answers
2 views

ClientGroupHeaderColumnTemplate prefers "data.FIELDNAME.sum" to "aggregates.FIELDNAME.sum" when using more than 7 aggregates.  < 7 aggregates, either one works.  Adding an 8th aggregate = "no bueno".

I kept getting an error on grouping if I added an 8th aggregate.  With 7 or less aggregates, there didn't seem to be a problem.

I changed my ClientGroupHeaderColumnTemplate to use "data.FIELD.sum" instead of "aggregates.FIELD.sum" and the problem went away, but the problem seems to only exist after the 7th aggregate.

I'm not using all of the aggregates in the same ClientGroupHeaderColumnTemplate.  Just adding a new line in the datasource to enable an aggregate on another column (> 7) triggered the fail.

If someone can advise what I might be doing wrong (other than using excessive aggregates), please advise.

Darron
Top achievements
Rank 1
 asked on 04 May 2021
1 answer
13 views

Hi guys,

 

My project is aimed to record employee registration. I want to add a grid into my project.

Link: ASP.NET MVC Grid Batch editing Demo | Telerik UI for ASP.NET MVC

But I check my reference which is missing Kendo.Mvc.Examples.

In the demo project (location: C:\Program Files (x86)\Progress\Telerik UI for ASP.NET MVC R1 2021\wrappers\aspnetmvc\Examples\MVC5\Kendo.Mvc.Examples), Kendo.Mvc.Examples is in the reference (under Kendo.Mvc).

Could you tell me how to add this reference into my project? Or is there any other document can help me develop the Grid.

 

Thanks,

Mike

Aleksandar
Telerik team
 answered on 03 May 2021
1 answer
10 views
This is a problem that has existed for years, are actions currently being taken to solve it or is there a version where it is solved?
Stoyan
Telerik team
 answered on 29 Apr 2021
12 answers
23 views

Hi All,

 

When I want to add Scrollable menu, I meet this issue, Please Help me!

The item need to add: ASP.NET MVC Menu Scrollable Demo | Telerik UI for ASP.NET MVC

I just create an new project (Kendo UI MVC5 Application) and I want to a scrollable navigation menu.

After I copy and paste the code from menu demo, the menu is show up but it isn't scrollable.

I screenshot the issue(when mouse move to "Men", nothing show up)

I put these code in index.cshtml which is under Home folder

    <div class="k-content">
    <h4>Horizontal</h4>

    @(Html.Kendo().Menu()
            .Name("horizontalMenu")
            .Scrollable(true)
            .Items(items =>
            {
                items.Add()
                    .Text("Mens")
                    .Items(children =>
                    {
                        children.Add().Text("Jackets and Coats");
                        children.Add().Text("Jeans");
                        children.Add().Text("Knitwear");
                        children.Add().Text("Shirts");
                        children.Add().Text("Belts");
                        children.Add().Text("Socks");
                        children.Add().Text("Fan Zone");
                    });

                items.Add()
                    .Text("Ladies")
                    .Items(children =>
                    {
                        children.Add().Text("Jackets and Coats");
                        children.Add().Text("Jeans");
                        children.Add().Text("Knitwear");
                        children.Add().Text("Shirts");
                        children.Add().Text("Belts");
                        children.Add().Text("Socks");
                        children.Add().Text("Fan Zone");
                    });

                items.Add()
                    .Text("Kids")
                    .Items(children =>
                    {
                        children.Add().Text("Jackets and Coats");
                        children.Add().Text("Jeans");
                        children.Add().Text("Knitwear");
                        children.Add().Text("Shirts");
                        children.Add().Text("Belts");
                        children.Add().Text("Socks");
                        children.Add().Text("Fan Zone");
                    });

                items.Add()
                    .Text("Sports");
                items.Add()
                    .Text("Brands");
                items.Add()
                    .Text("Accessories");
                items.Add()
                    .Text("Promotions");
                items.Add()
                    .Text("Contacts");
                items.Add()
                    .Text("About us");
            })
          )

</div>
<style>
    .k-menu-scroll-wrapper.horizontal li.k-item.k-last {
        border-right-width: 0;
    }
</style>

 

And I didn't change anything in HomeController.cs:

   using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace Work_Time_Record.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            ViewBag.Message = "Welcome to ASP.NET MVC!";

            return View();
        }
    }
}

Is there any issue about controller? I'm new in ASP.Net MVC, Please let me know if need more information!

 

Thanks a lot,

Mike

Mike
Top achievements
Rank 1
Iron
 answered on 28 Apr 2021
10 answers
127 views
I could not find any documentation how to submit hidden field via form control.
Frans
Top achievements
Rank 1
Iron
 answered on 28 Apr 2021
5 answers
111 views

Hi, 

I feel like I may be missing something, but like my title says, my grid is not populating with data after the read function. Here is my code:

// grid

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
</head>
<body>
    <div>
        @(Html.Kendo().Grid<DataManager.Models.CommodityCodesViewModels.IndexViewModel>()
      .Name("commodityCodesGrid")
      .Columns(columns =>
      {
          columns.Bound(c => c.CommodityCodeId).Width(100);
          columns.Bound(c => c.CommodityCode).Width(100);
          columns.Bound(c => c.Description).Width(100);
      })
    .HtmlAttributes(new { style = "height: 700px;" })
    .Scrollable(s => s.Height(700))
    .Groupable()
    .Sortable()
    .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(5))
    .Filterable()
    .DataSource(dataSource => dataSource
        .Custom()
        .Batch(true)
        .PageSize(20)
        .Schema(schema => schema.Model(m => m.Id(p => p.CommodityCodeId)))
        .Transport(transport =>
        {
            transport.Read(read =>
               read.Url("http://localhost:51088/api/commoditycodes")
                   .DataType("jsonp")
            );
        })
    )
)
    </div>
</body>
</html>

 

// View Model

public class IndexViewModel
{
    public int CommodityCodeId { get; set; }
    [Required, MaxLength(3)]
    public string CommodityCode { get; set; }
    [Required, MaxLength(50)]
    public string Description { get; set; }
}

 

I have also attached two screenshots. One illustrates the returned data via the corresponding url, and the other shows the response when testing the grid. 

Thanks,

Ruben

serge
Top achievements
Rank 1
 updated answer on 27 Apr 2021
1 answer
12 views

Hello

How can I make a $("#FileManager").data("kendoFileManager").refresh() everytime I open a folder on Kendo UI File Manager?

This is my problem:

When I browse to an empty folder, the folder gets reloaded every time I go into the folder.

When I browse to a folder that has files, the folder gets reloaded the first time and afterwards it won't reload/refresh anymore.

Practical case:

- Root
     - FolderA
          - File1
          - File2
     - FolderB

- If I go to FolderA, it will load both files
- When I drag File1 into FolderB, if I go to FolderB I will see the File1 inside
- I go back to FolderA and I drag File2 into FolderB
- If I go to FolderB I can only see File1 inside, FolderB was not reloaded when I went there again

The only 2 ways I found so far to see File2 inside of FolderB are:
- refreshing the whole page
- moving File1 again to another folder, when I do that File2 becomes visible again (a refresh is made);

The second way only happeens because I do a $("#FileManager").data("kendoFileManager").refresh(); but this only refreshes the folder I am currently at.

I would like to make a $("#FileManager").data("kendoFileManager").refresh() everytime I open a folder on Kendo UI File Manager.

Ianko
Telerik team
 answered on 27 Apr 2021
1 answer
5 views

Hi,

 

I have an issue with the Editor control where copy/pasting content with & into the "View HTML" tool window is converting the & to &amp. I've reproduced this behaviour in a pared down version of one of the jQuery demos here

Steps to reproduce:

- Click the View HTML button and copy/paste the following "<a href="https://clk.omgt1.com/?AID=1749609&PID=32811&UID=--MembershipNumber--" target="_blank" rel="noopener">"

- Click the Update button to save the change

- Click the View HTML button again and you can see that the content has been changed to this (emphasis mine to show the differences) - <a href="https://clk.omgt1.com/?AID=1749609&amp;PID=32811&amp;UID=--MembershipNumber--" target="_blank" rel="noopener"></a>

 

I've looked through the documentation and found the option for "encoded" which seems related but setting that to false doesn't fix this problem. Since this problem was originally reported via someone copy/pasting content into the window I've also tried modifying the paste options without success but I can also reproduce this via typing the problematic content in myself so copy/pasting doesn't seem related here.

 

Is there some other option that controls this behaviour or is it a bug with the control?

Neli
Telerik team
 answered on 27 Apr 2021