Template column value not refreshing after edit

[Cristina Pelivan]

Hello,

I have a grid with a template column. After editing a row in grid (on save), the template column value is not updated properly. 

My exact scenario is that if I edit an user with "IsActive" bool set to true, and i update it to false, on endEdit, the template value is not updated. But, the reverse scenario does not apply - meaning that if I edit an user with "IsActive" bool set to false and update it to true, the template is refreshed after edit.

The grid:

@(Html.EJ().Grid<UserModel>("Users")

                                      .Datasource(Model)

                                      .AllowSorting()

                                      .AllowPaging()

                                      .EditSettings(edit => { edit.AllowDeleting().AllowEditing(); })

                                      .ToolbarSettings(toolbar =>

                                      {

                                          toolbar.ShowToolbar().ToolbarItems(items =>

                                          {

                                              items.AddTool(ToolBarItems.Edit);

                                              items.AddTool(ToolBarItems.Delete);

                                              items.AddTool(ToolBarItems.Update);

                                              items.AddTool(ToolBarItems.Cancel);

                                          });

                                      })

                                      .ClientSideEvents(eve => { eve.EndEdit("endEdit").EndDelete("endDelete"); })

                                      .IsResponsive()

                                      .Columns(col =>

                                      {

                                          col.Field("Id").HeaderText("Id").IsPrimaryKey(true).Visible(false).Add();

                                          col.Field("Name").HeaderText("Nume").Add();

                                          col.Field("Username").HeaderText("Utilizator").Add();

                                          col.Field("Email").Add();

                                          col.Field("IsActive").HeaderText("Activ").Template("#isActive").Add();

                                      }))

And the template column:

<script type="text/x-jsrender" id="isActive">

    {{if IsActive}}

    <span class="new badge green pull-left" data-badge-caption="">

        <i class="fa fa-user"></i> ACTIV

    </span>

    {{else}}

    <span class="new badge red pull-left" data-badge-caption="">

        <i class="fa fa-user-o"></i> INACTIV

    </span>

    {{/if}}

</script>

Thanks,

Cristina

[Thavasianand Sankaranarayanan]

Hi Cristina, 

Thanks for contacting Syncfusion support. 

We have analyzed your query and we suspect that you want to do some changes after changes done in Grid value. So, we suggest you to use the helper function for the changes reflected in the Grid after the CRUD operations. 

For an example we have modified the isActive column value in Grid. 

Refer the below code example. 

@(Html.EJ().Grid<object>("FlatGrid") 

        .Datasource((IEnumerable<object>)ViewBag.datasource) 

             .AllowPaging() 

 

              --- 

 

                             

        .Columns(col => 

        { 

 

              ---- 

 

            col.Field("IsActive").HeaderText("Activ").Template("#isActive").Add();             

 

        })) 

</div> 

 

<script type="text/x-jsrender" id="isActive"> 

    {{if IsActive}} 

       {{:~renderValue()}} 

     

    {{else}} 

        {{:~renderValue()}} 

    

    {{/if}} 

     

</script> 

    var title = { 

         renderValue: function (arg) { 

            var IsActive= JSON.parse(this.data. IsActive); 

                    if (IsActive) 

                        return "<span class='new badge green pull-left' data-badge-caption=''><i class=fa fa-user'></i>ACTIV</span>"; 

                    else 

                        return "<span class='new badge green pull-left' data-badge-caption=''><i class=fa fa-user'></i>INACTIV</span>"; 

                }, 

            }; 

            $.views.helpers({ renderValue: title.renderValue });    

</script> 

Regards, 

Thavasianand S. 

[Cristina Pelivan]

Thank you, that solved my problem.

Best regards,

Cristina

[Thavasianand Sankaranarayanan]

Hi Cristina, 

 

We are happy that the problem has been solved at your end. 

 

Please get back to us if you need any further assistance.  

 

Regards, 

Thavasianand S.