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

Disable Listview Template Edit & Delete buttons

1 Answer 251 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 2
Eric asked on 01 Aug 2014, 04:28 AM
Any ideas? I took a stab in the dark; just add
'disabled' class to the template, but this doesn't work:

01.if (User.Identity.IsAuthenticated)
02. {
03.    <script type="text/x-kendo-tmpl" id="template">
04.        <div class="post-view k-widget">
05.            <div class="edit-buttons">
06.                <a class="k-button k-button-icontext k-edit-button" href="\\#"><span class="k-icon k-edit"></span></a>
07.                <a class="k-button k-button-icontext k-delete-button" href="\\#"><span class="k-icon k-delete"></span></a>
08.            </div>
09.            <div class="post-header bg-azure">
10.                <p class="post-title">#:Name# </p>
11.                <p class="post-time">#:kendo.toString(CommentDate,'d')#</p>
12.            </div>
13.            <div class="post-msg">
14.                #=Comment#
15.            </div>
16.        </div>
17.    </script>
18. }
19. else
20. {
21.    <p>You must be logged in to contribute.</p>
23.    <script type="text/x-kendo-tmpl" id="template">
24.        <div class="post-view k-widget">
25.            <div class="edit-buttons">
26.                <a class="k-button k-button-icontext k-edit-button disabled" href="\\#"><span class="k-icon k-edit"></span></a>
27.                <a class="k-button k-button-icontext k-delete-button disabled" href="\\#"><span class="k-icon k-delete"></span></a>
28.            </div>
29.            <div class="post-header bg-azure">
30.                <p class="post-title">#:Name# </p>
31.                <p class="post-time">#:kendo.toString(CommentDate,'d')#</p>
32.            </div>
33.            <div class="post-msg">
34.                #=Comment#
35.            </div>
36.        </div>
37.    </script>
38. }

What would be the correct way?


1 Answer, 1 is accepted

Sort by
Dimiter Madjarov
Telerik team
answered on 01 Aug 2014, 11:38 AM
Hi Robert,

You could add the k-state- disabled class in order to visually style the button as disabled. Nevertheless this won't prevent it's behavior. In order to do this, you should remove the k-edit-button and k-delete-button classes, which are used to attach the corresponding handlers.
<a class="k-button k-button-icontext k-state-disabled" href="\\#"><span class="k-icon k-edit"></span></a>

Dimiter Madjarov

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Asked by
Top achievements
Rank 2
Answers by
Dimiter Madjarov
Telerik team
Share this question