Hello i'm trying to figure out a way to conditionally "hide" a column using an "#if" statement, if a user is NOT a SuperUser and i'm trying this "#if" approach because i know that the 'template' : '#if(isAppAdmin == true) statement works fine. Or another approach that would work would be if there's a way to "hide" the 'edit' command button if a user is NOT a SuperUser, thanks for any suggestions or pointers!
{
'title' : 'Is Admin',
'field' : 'isAppAdmin',
'width' : '90px',
'hidden' : '#if(isSuperUser == false) {# true # } else {# false #}#',
'template' : '#if(isAppAdmin == true) {# yes # } else {# no #}#'
},
<script>
$(document).ready(function () {
$(".k-grid-edit",
"#grid").hide();
});
</script>
<
script
type
=
"text/x-kendo-template"
id
=
"admin-template"
>
<
div
class
=
"admin-container"
>
<
label
></
label
><
input
data-role
=
"combobox"
class
=
"k-combobox"
data-placeholder
=
"Select user..."
data-text-field
=
"userName"
data-value-field
=
"userId"
data-filter
=
"startswith"
data-bind
=
"value: selUser,source: userDs"
style
=
"width:300px;"
/>
<
a
>
<
img
data-bind
=
"click: onAddNew, attr: {src: addNewImgUrl}"
style
=
"vertical-align:middle;"
/>
<
span
>Add new</
span
>
</
a
>
</
div
>
<
hr
class
=
"hr-style"
/>
<
div
style
=
"margin:5px;"
>
<
div
id
=
"gridAppUsers"
data-role
=
"grid"
data-columns="[
{
'title' : 'User ID',
'field' : 'userId',
'width' : '130px'
},
{
'title' : 'Name',
'field' : 'userName',
'width' : '150px'
},
{
'title': 'Position',
'field': 'position'
},
{
'title' : 'Email',
'field' : 'email',
'width' : '170px'
},
{
'title' : 'Phone',
'field' : 'phoneNumber',
'width' : '120px'
},
{
'title' : 'Is App User',
'field' : 'isAppUser',
'width' : '90px',
'template' : '#if(isAppUser == true) {# yes # } else {# no #}#'
},
{
'title' : 'Is Admin',
'field' : 'isAppAdmin',
'width' : '90px',
'hidden' : '#if(isSuperUser == false) {# true # } else {# false #}#',
'template' : '#if(isAppAdmin == true) {# yes # } else {# no #}#'
},
{
'title' : 'Is Super User',
'field' : 'isSuperUser',
'width' : '90px',
'template' : '#if(isSuperUser == true) {# yes # } else {# no #}#'
},
{ 'command' : ['edit', 'destroy'], 'title': ' ', 'width': '180px' }
]"
data-editable
=
"inline"
data-sortable
=
"true"
data-scrollable
=
"true"
data-selectable
=
"single, row"
data-bind
=
"source: appUserDs , events: { save: onSave, remove: onDelete }"
>
</
div
>
</
div
>
</
script
>
<
script
>
$(document).ready(function () {
$(".k-grid-edit", "#grid").hide();
});
</
script
>