This is a migrated thread and some comments may be shown as answers.

How do I create an empty column?

7 Answers 1150 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Jonathan
Top achievements
Rank 1
Jonathan asked on 16 Aug 2013, 01:58 PM
Hi,
I'm very new to Kendo and inthis case, ASP.NET so your help would be appreciated.  I'm creating a web page using ASP.NET MVC4 with an entity framework over a SQL DB to create my Views and Controllers.

I've created a view that uses a Kendo grid thus:

@(Html.Kendo().Grid(Model)    
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.FirstName).Template(@<text>@item.FirstName</text>);
        columns.Bound(p => p.MiddleName).Template(@<text>@item.MiddleName</text>);
        columns.Bound(p => p.LastName).Template(@<text>@item.LastName</text>);
        columns.Bound(p => p.DateOfBirth).Template(@<text>@item.DateOfBirth</text>);
    })
    .Groupable()
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    )

This works really well but I would like to add another column that isn't bound to data so that I can insert some buttons for editing, deleting etc.  Ideally I'd like to show a link called 'Edit' that takes the user to another page for editing.

Many Thanks for your help!

7 Answers, 1 is accepted

Sort by
0
Alexander Popov
Telerik team
answered on 19 Aug 2013, 03:53 PM
Hi Jonathan,


I would recommend checking the following tutorials:


They should get you familiar with the basics, as well as the built-in CRUD functionality. Also you can check this example which demonstrates how to add a custom command buttons.

In case you need to add an an empty column, you can do so using the Template method as shown below:    

columns.Template(@<text> </text>).Title("Column Title");
 
Kind Regards,
Alexander Popov
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Curt Rabon
Top achievements
Rank 1
Veteran
answered on 23 Nov 2017, 06:35 PM
For those using AJAX-bound, it would be nice if just using .ClientTemplate() were enough, instead of having to call .Template() and pass an empty set of @<text>.
1
Stefan
Telerik team
answered on 27 Nov 2017, 08:13 AM
Hello, Curt,

Thank you for the suggestion.

The main reason for this requirement is that the ClientTemplate is a property of the bound columns. That is why the template column is made for not bound column scenarios.

The template column will also work with an empty string:

columns.Template("");


Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Curt Rabon
Top achievements
Rank 1
Veteran
answered on 27 Nov 2017, 06:32 PM
In an Ajax-bound grid with a bound column, there are still common scenarios where you need to add a CSS class to a cell based on the data for that cell, so ClientTemplate() is common.  Also, in Ajax-bound grids, if I understand your documentation correctly, the Template() is ignored, and if so, it would seem like you should not require it when using ClientTemplate.
0
Stefan
Telerik team
answered on 29 Nov 2017, 09:07 AM
Hello, Curt,

The Template property on the bound columns of the Ajax bound Grid is ignored. I understand that this may be confusing due to the matching names. When a column is bound to a field there are two scenarios:

1) ClientTemplate for Ajax bound Grids.

columns.Bound(p => p.ProductID).ClientTemplate(
    "<a href='" +
        Url.Action("ProductDetails", "Product") +
        "/#= ProductID #'" +
    ">Show Product Details</a>"
);


2) Template for Server bound Grid.

columns.Bound(p => p.ProductID).Template(@<text>
          @Html.ActionLink("Show Product Details", "ProductDetails", new { id = @item.ProductID } )>
    </text>);


Still, the template which is referred here is used when a column is not bound to a specific field(regardless of the Ajax or Server binding), and it is for Template column:

columns.Template(""); //The column is not bound to a field.

I hope this description will provide more insights on why the Template column is used in this scenario.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Curt Rabon
Top achievements
Rank 1
Veteran
answered on 29 Nov 2017, 07:17 PM

Yes, you are right...the Template() is still used in AJAX mode for non-bound columns, and I even use that.  Thanks for the clear explanation.

I realize this is off-topic, but in the ClientTemplate, it would be very helpful if the JavaScript function was passed a reference to the <td> container, so that we could put a CSS class on that cell dynamically.  Yes, you can put a <div> inside the cell with your css class on it, but it some cases it would be much easier to access the <td> itself, such as when we want to override the default padding of that cell, etc.  Yes, you can use the dataBound event and find the cell you are interested in, but it makes more sense to access the <td> inside your ClientTemplate function.

0
Stefan
Telerik team
answered on 01 Dec 2017, 09:31 AM
Hello, Curt,

Thank you for the feedback.

I can suggest submitting a feature request in our UserVoice portal, as this is helping us to prioritize the most useful the requested functionality:

http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback?category_id=170280

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
Jonathan
Top achievements
Rank 1
Answers by
Alexander Popov
Telerik team
Curt Rabon
Top achievements
Rank 1
Veteran
Stefan
Telerik team
Share this question
or