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

Combining actions in a single column's template

1 Answer 30 Views
Grid
This is a migrated thread and some comments may be shown as answers.
DoomerDGR8
Top achievements
Rank 2
Iron
Iron
Iron
DoomerDGR8 asked on 07 Jul 2020, 10:06 PM

I have this grid:

01.<div id="SearchDetail">
02.    <div id="SearchResult" style="width:850px"></div>
03.</div>
04.  
05.<script>
06.    function getSearchResult() {
07.        $("#SearchResult").kendoGrid({
08.            dataSource: {
09.                transport: {
10.                    read: {
11.                        url: BASE_URL + "SomeApi/GetRequestList",
12.                        type: "post",
13.                        dataType: "json",
14.                        data: {                       
15.                            CardId: $("#ParkingCardId").val(),
16.                            StatusId: $("#StatusId").val(),
17.                            Status: $("#Status").val()
18.                        }
19.                    }
20.                },
21.                pageSize: 10,
22.                schema: {
23.                    data: "result",
24.                    total: "total"
25.                }
26.            },
27.            groupable: false,
28.            sortable: true,
29.            resizable: true,
30.            pageable: true,
31.            filterable: false,
32.            selectable: "single",
33.            dataBound: function(e) {
34.                for (var i = 0; i < this.columns.length; i++) {
35.                    if (i === 2) {
36.                        continue;
37.                    }
38.  
39.                    this.autoFitColumn(i);
40.                }
41.  
42.                setTimeout(function() {
43.                        $(".k-pager-wrap ul").css({ "margin-left": "0px" });
44.                        $(".k-pager-wrap ul li")
45.                            .css({ "margin-left": "0px", "padding-left": "0px", "list-style-type": "none" });
46.                    },
47.                    100);
48.            },
49.            columns: [ {
50.                    field: "ParkingCardId",
51.                    title: "Card Id",
52.                    template: '<a href="@Url.Action("NewRequest", "Parking")?cardId=#=ParkingCardId#&cardTypeString=View">#=ParkingCardId#</a>'
53.                }, {
54.                    field: "Name",
55.                    title: "Full Name"
56.                }, {
57.                    field: "Status",
58.                    title: "Status"
59.                }, {
60.                    field: "IsExpired",
61.                    title: "Action",
62.                    template: '#if (IsExpired) {# <a href="@Url.Action("NewRequest", "Parking")?cardId=#=ParkingCardId#&cardTypeString=Renew Card">Renew</a> #} else {# #}#'
63.                }, {
64.                    field: "StatusId",
65.                    title: "Action",
66.                    template: '#if (StatusId === 0) {# <input type="button" class="k-button" value="Cancel" onclick="openDialog(#=ParkingCardId#)" #} else {# #}#'
67.                }
68.            ]
69.        });
70.    }
71.</script>

 

How do I get a single Action column with the two conditional actions? The button can be replaced with link.

1 Answer, 1 is accepted

Sort by
0
Accepted
Ivan Danchev
Telerik team
answered on 09 Jul 2020, 06:10 PM

Hello Hassan,

You can use a single column and add both "if" statements to its template: https://dojo.telerik.com/ENepuqon/2

Regards,
Ivan Danchev
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
Tags
Grid
Asked by
DoomerDGR8
Top achievements
Rank 2
Iron
Iron
Iron
Answers by
Ivan Danchev
Telerik team
Share this question
or