CODEWITHSUNDEEP
kendo-ui
Jonathan
Jonathan

Reputation: 1669

How to use the template function in the grid using kendoui

I am using a template to display some button. I have written the following code :

template: kendo.template($("#edit-template").html())

And in the edit template I have written :

<script id="edit-template" type="text/x-kendo-template">
    <a class="k-grid-edit" style="visibility:hidden;" id="edit">Edit</a>
</script>

Initially it will be hidden mode. On databound function, I will show or hide the button. If the permission is shown then I write

$(".k-grid-edit").show();

Whenever I am updating the grid then the edit button is disappearing again. This is because the button is in hidden state initially. After updating also I need to display that in visible mode. How can i do that.

Regards

Upvotes: 1

Views: 5466

Answers (1)

OnaBai
OnaBai

Reputation: 40917

What about transforming your template into:

<script id="edit-template" type="text/x-kendo-template">
    # if (isVisible) { #
        <a class="k-grid-edit">Edit</a>
    # } else {#
        <a class="k-grid-edit" style="display:none">Edit</a>
    # } #
</script>

and then have a variable:

var isVisible = false;

Then toggling it to visible is:

isVisible = true;
$(".k-grid-edit").show();

while hiding it is:

isVisible = false;
$(".k-grid-edit").hide();

Basically the variable isVisible stores the state and the template checks it using JavaScript.

NOTE The template might be more compact but I think this is more readable.

One more question (styling) I removed the id from the anchor a in your template since id must be unique and you were setting the same id for all kendoGrid rows.

Upvotes: 1

Related Questions