If else in Web Grid Column

Question

How to put a condition (if else) in webgrid column?

@grid.GetHtml(tableStyle: "table table-bordered",
                columns: grid.Columns(
                grid.Column("RealName", "Name"),
                grid.Column("UserName", "Email")
                ))

I have to show the Email Column based on a condition, How to do this?

Try this may be Duplicate of [this link][1] [1]: http://stackoverflow.com/questions/7866051/conditionally-display-an-image-in-webgrid-mvc-3 — Nilesh Gajare, Dec 24 '13 at 10:31
I have to show / hide column based on a condition, The above thread shows or hides the column value, so its not duplicate. — Anup, Dec 24 '13 at 10:33

score 15 · Accepted Answer · answered Dec 24 '13 at 10:50

You can try this

@{
    var gridColumns = new List<WebGridColumn>();
    gridColumns.Add(grid.Column(format: (item) => Html.ActionLink("Select", "Details")));
    if (true)
    {
        gridColumns.Add(grid.Column(format: (item) => Html.ActionLink("Edit", "Edit")));
    }

    gridColumns.Add(grid.Column("UserName", "name"));
    gridColumns.Add(grid.Column("RealName", "RealName"));
}

@grid.GetHtml(columns: grid.Columns(gridColumns.ToArray()));

Thank you @Nilesh, looks like the cleanest way of doing this — Jason Loki Smith, Apr 21 '15 at 08:41

score 12 · Answer 2 · edited Jan 16 '14 at 13:48

This worked for me.

 @grid.GetHtml(tableStyle: "webGrid",
        headerStyle: "header",
        alternatingRowStyle: "alt",
        selectedRowStyle: "select",
        columns: grid.Columns(




        grid.Column("Is Active",format: (item) =>
            {
                if (item.IsActive == true)
                {
                    return Html.Raw(string.Format("<text><img height='20' width='20' src=\"{0}\" alt=\"Image\"/></text>", Url.Content("~/images/rightmark.png")));
                }
                else
                {
                    return Html.Raw(string.Format("<text><img height='20' width='20' src=\"{0}\" alt=\"Image\"/></text>", Url.Content("~/Content/images/non-preview-photo.gif")));                         
                }
            }, style: "firstColumn",canSort:true),       
        grid.Column("Name", " Name", style: "SecondColumn",canSort:true),       
        grid.Column("Role", "Role", style: "ThirdColumn",canSort:true)
))

Suraj Singh · Answer 3 · 2013-12-24T10:45:50.770

3

A very simple way is

if(myConditionCanGoInHere) {

   @grid.GetHtml(tableStyle: "table table-bordered",
            columns: grid.Columns(
            grid.Column("RealName", "Name"),
            grid.Column("UserName", "Email")
            ))

}
else{

 @grid.GetHtml(tableStyle: "table table-bordered",
            columns: grid.Columns(
            grid.Column("RealName", "Name"),
            //grid.Column("UserName", "Email")
            ))
// Here remove your email column

))

Reference and Here

edited Dec 24 '13 at 10:45

answered Dec 24 '13 at 10:24

Suraj Singh

4,041
1
21
36

thankx for answer, but how do i put entire column in condition. So if condition is true then the column displays & vice versa. – Anup Dec 24 '13 at 10:35
@Anup Check the updated answer it's a very basic answer check if it works for you . – Suraj Singh Dec 24 '13 at 10:46

score 2 · Answer 4 · answered Feb 19 '14 at 23:38

I update the code to accept parameter: (Razor View - Webmatrix)

      grid.Column("Unread",format: (item) =>
        {
            if (item.Unread == true)
            {
                return Html.Raw(string.Format("<text><a \"target=\"_blank\" href=\"ViewComments?bvnum={0}\"><img height='20' width='20' border='0' src=\"/images/new_comments.png\" alt=\"Image\"/></text>", @item.id));
            }
            else
            {
                return Html.Raw(string.Format("<text><a \"target=\"_blank\" href=\"ViewComments?bvnum={0}\"><img height='20' width='20' border='0' src=\"/images/comments.png\" alt=\"Image\"/></text>", @item.id));
            }
        }, canSort:true)

brothers28 · Answer 5 · 2013-12-24T10:33:05.430

1

It would be good, if you validate this before you put the data in the GUI layer. You have to get the right data for the grid in your Controller. So you can only show the data in the grid and you don't have to mind if it is the right data because you have already validate it.

That mean you have to put the if/else in your controller not in your view.

        public JsonResult GetServiceGridData([DataSourceRequest]DataSourceRequest request)
        {
            var services = ModelTransformer.Transform(Repository.Instance.GetServices());
            foreach (var service in services)
            {
                var filterType = _filterTypes.FirstOrDefault(x => x.Id == service.FilterTypeId);
                service.FilterTypeName = filterType == null ? _filterTypeNoneName : filterType.Name;
            }
            return Json(services.ToDataSourceResult(request));
        }

Something like this for example

edited Dec 24 '13 at 10:33

answered Dec 24 '13 at 10:27

brothers28

1,196
17
23

I am looking for quick fix buddy. – Anup Dec 24 '13 at 10:34
Then look at [this](http://stackoverflow.com/questions/7866051/conditionally-display-an-image-in-webgrid-mvc-3) one :) @Anup – brothers28 Dec 24 '13 at 10:35
Well i cannot change in controller, since it is being used by multiple users. – Anup Dec 24 '13 at 10:37
Klick on "This" in my last answer... There you don't have to change the Controller... – brothers28 Dec 24 '13 at 10:42

If else in Web Grid Column

5 Answers5

Linked