This is a migrated thread and some comments may be shown as answers.
Toolbar Template Syntax in Razor
3 Answers 249 Views
This is a migrated thread and some comments may be shown as answers.
Ristogod
Top achievements
Rank 2
Ristogod asked on 13 Mar 2014, 04:47 PM
I have a grid where I am trying to put a drop down list in the toolbar of the grid.

This is the syntax I am using:
Html.Kendo()
            .Grid<Fss.Areas.Customers.Models.Contact>()
            .Name("ContactsGrid")
            .Columns(columns =>
            {
                columns.Bound(c => c.LastName);
                columns.Bound(c => c.FirstName);
                columns.Bound(c => c.Email);
                columns.Bound(c => c.Phone);
                columns.Bound(c => c.Mobile);
                columns.Bound(c => c.Changed).Format("{0:HH:mm:ss d/M/yyyy}");
                columns.Bound(c => c.ChangedBy);
                columns.Command(command =>
                {
                    command.Edit();
                    command.Destroy();
                }).Width(172);
            })
            .ToolBar(toolbar =>
            {
                toolbar.Create();
                toolbar.Template(() =>
                {
                    @<div class="toolbar">
                        @{
                            Html.Label("Customer");                                                    
                            Html.Kendo()
                                .DropDownList()
                                .Name("CustomersComboBox")
                                .HtmlAttributes(new { style = "width: 400px" })
                                .DataTextField("Name")
                                .DataValueField("CustomerId")
                                .AutoBind(false)
                                .Events(e => e.Change("changeCustomer"))
                                .DataSource(source => source.Read(read => read.Action("GetCustomers", "Contacts")));
                        }
                    </div>
                });
            })
            .Editable(editable => editable.Mode(GridEditMode.PopUp))
            .Pageable()
            .Sortable()
            .Scrollable()
            .Reorderable(con => con.Columns(true))
            .Resizable(con => con.Columns(true))
            .ColumnResizeHandleWidth(5)
            .HtmlAttributes(new { style = "height:600px;" })
            .Events(e => e.Edit("edit"))
            .DataSource(dataSource => dataSource.Ajax()
                                                .PageSize(10)
                                                .Events(events => events.Error("error_handler"))
                                                .Model(model =>
                                                {
                                                    model.Id(c => c.ContactId);
                                                    model.Field(f => f.Changed).Editable(false);
                                                    model.Field(f => f.ChangedBy).Editable(false);
                                                    model.Field(f => f.Error).Editable(false);
                                                })
                                                .Create(c => c.Action("Create", "Contacts"))
                                                .Read(r => r.Action("Read", "Contacts"))
                                                .Update(u => u.Action("Edit", "Contacts"))
                                                .Destroy(d => d.Action("Delete", "Contacts")));

I am following an example found here:
http://demos.telerik.com/kendo-ui/Beta/web/grid/toolbar-template.html

This seems to compile OK, but at runtime it throws this error. It's saying it's missing a semicolon, but I don't understand where I would put one:

Server Error in '/' Application.

Compilation Error Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS1002: ; expected

Source Error:

Line 186:EndContext(__razor_template_writer, "~/Areas/Customers/Views/Contacts/Customer.cshtml", 1606, 30, true);
Line 187:
Line 188:})
Line 189:
Line 190: #line 44 "C:\Users\riston\Desktop\Fss\Fss\Areas\Customers\Views\Contacts\Customer.cshtml"
Source File: c:\Users\riston\AppData\Local\Temp\Temporary ASP.NET Files\root\c09ffc8d\a8a27bfd\App_Web_customer.cshtml.d9b99660.sjvq2jbh.0.cs    Line: 188

3 Answers, 1 is accepted

Sort by
0
Nikolay Rusev
Telerik team
answered on 14 Mar 2014, 08:36 AM
Hello Ristogod,

Your template doesn't have well formed Razor template. In the demos you mention go to the ASP.NET MVC tab of the code viewer and inspect the `toolbar_template.cshtml` file. Here are the important bits:
.ToolBar(toolbar =>
    {
        toolbar.Template(@<text>
           <div class="toolbar">
                    <label class="category-label" for="category">Show products by category:</label>
                        @(Html.Kendo().DropDownList()
                            .Name("categories")
                            .OptionLabel("All")
                            .DataTextField("CategoryName")
                            .DataValueField("CategoryID")
                            .AutoBind(false)
                            .Events(e => e.Change("categoriesChange"))
                            .DataSource(ds =>
                            {
                                ds.Read("ToolbarTemplate_Categories", "Grid");
                            })
                        )
                        </div>
        </text>);
    })


Regards,
Nikolay Rusev
Telerik
 

DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.

 
0
Chris
Top achievements
Rank 1
Veteran
Iron
answered on 05 Feb 2020, 07:01 AM

How to do this in .NET Core Application ?? Template(Func<Grid<T>, object> template) method not found : 

  toolbar.Template(@<text>

 

Best regards

 

Chris

 

 

0
Tsvetomir
Telerik team
answered on 06 Feb 2020, 02:25 PM

Hi Chris,

The implementation toolbar template in ASP.NET Core is different due to rendering differences compared to the ASP.NET MVC framework. Therefore, you should declare it as follows:

 .ToolBar(toolbar => {
        toolbar.ClientTemplateId("GridToolbarTemplate");
    })

<script id="GridToolbarTemplate" type="text/x-kendo-template">
     // content goes here
</script>

You could check out the respective live demo here:

https://demos.telerik.com/aspnet-core/grid/toolbar-template

 

Regards,
Tsvetomir
Progress Telerik

Get quickly onboarded and successful with your Telerik UI for ASP.NET MVC with the dedicated Virtual Classroom technical training, available to all active customers.
Tags
Grid
Asked by
Ristogod
Top achievements
Rank 2
Answers by
Nikolay Rusev
Telerik team
Chris
Top achievements
Rank 1
Veteran
Iron
Tsvetomir
Telerik team
Share this question
or