CODEWITHSUNDEEP
javascriptasp.net-mvckendo-uikendo-gridkendo-asp.net-mvc
xkcd
xkcd

Reputation: 2590

Masking a specified column in kendo grid

Here is my grid initialization:

@(Html.Kendo().Grid<UT.CRM.ViewModels.DemoUserListViewModel> ()
    .Name("demoUsers")
    .Columns(columns =>
    {
        columns.Bound(c => c.CustomerName).Title("Ad Soyad").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
        columns.Bound(c => c.Login).Title("Hesap").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
        columns.Bound(c => c.DayCount).Title("Toplam Gün").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
        columns.Bound(c => c.TradeCount).Title("Toplam İşlem").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
        columns.Bound(c => c.RegistrationDate).Title("Kayıt").Format("{0:dd.MM.yyyy}").Filterable(ftb => ftb.Cell(cell => cell.Operator("eq")));
        columns.Bound(c => c.Email).Title("E-Posta").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
        columns.Bound(c => c.Phone).Title("Phone").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
    })
    .HtmlAttributes(new { style = "height: 690px;" })
    .Scrollable()
    .Sortable()
    .Resizable(resize => resize.Columns(true))
    .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("GetDemoUsersReport", "Reports"))
    )
)

As you see I have a column having phone values. I want these phone values to be formatted as below:

05356645879 -> ****664****

Is it possible?

Thanks in advance,

Upvotes: 0

Views: 1156

Answers (1)

DontVoteMeDown
DontVoteMeDown

Reputation: 21465

Try setting a ClientTemplate as below:

columns.Bound(c => c.Phone).ClientTemplate(@"#: phone.replace(/^\\d{4}|\\d{4}$/g, \'****\') #").Title...

I could not test it with ASP.Net, but here is a demo in pure javascript. Any problems please let me know.

UPDATE: I forgot to say that the best and safer way to achieve that is to do the same thing, but in your server side. So the user cannot get the information in the raw request result. But if you think that isn't necessary, it is ok.

Upvotes: 1

Related Questions