Grid columns misaligned after changing visible property

[Vanderlei]

Hi, 

Using EJ2 AspNet MVC components on VS2017.

As suggested I am using visible property to show only desired columns. I show all columns while editing data in popup dialog form. It works fine for editing records but when I insert a new record grid show misaligned columns after saving record and closing popup dialog form. Please see below:

1 - Column pwd is hidden

2 - Grid looks ok

3 - For add or edit data column is set to be shown:

4 - After add/edit:

5 - After editing a record grid is rendered ok but after adding a new record grid looks like bellow:

Please help me to solve this problem.

Thank you.

[Mohammed Farook J]

Hi Vanderlei,       

Thanks for contacting Syncfusion support. 

 

We have validated the provided code and we need to change the visibility while saving with actionBegin event. Please update the following code example  in your application. 

. . . 

<div> 

    <div> 

        @Html.EJS().Grid("Grid").DataSource(ds => ds.Url(@Url.Action("UrlDatasource", "Home")).InsertUrl(@Url.Action("Add", "Home")).UpdateUrl(@Url.Action("Update", "Home")).RemoveUrl(@Url.Action("Remove", "Home")).Adaptor("UrlAdaptor")).Columns(col => 

   { 

       col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("75").Add(); 

       . . . 

       col.HeaderText("Manage Records").Width("90").Commands(commands).Add(); 

 

   }).AllowPaging().ActionBegin("begin").EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true).ShowConfirmDialog(true).Mode(Syncfusion.EJ2.Grids.EditMode.Dialog); }).AllowSorting().Toolbar(new List<string>() {"Add", "Delete","Search" }).Render() 

 

 

    </div> 

</div> 

<script> 

    function begin(args) { 

        if (args.requestType == "save" && args.action == "add") { 

            for (var i = 0; i < this.columns.length; i++) { 

                if (this.columns[i].field == "CustomerID") { 

                    this.columns[i].visible = false; 

                } 

            } 

        } 

        if (args.requestType == "beginEdit" || args.requestType == "add") { 

           

            for (var i = 0; i < this.columns.length; i++) { 

                if (this.columns[i].field == "CustomerID" && !this.columns[i].visible) { 

                    this.columns[i].visible = true; 

                } 

            } 

        } 

 

    } 

 

 

 

Regards, 

J Mohammed Farook 

 

[Vanderlei]

Hi Farook,

It is working fine now!

Many thanks!

[Mohammed Farook J]

Hi Vanderlei, 

 

Thanks for the update. We are happy to hear your problem has been resolved.  

 

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

 

Regards, 

J Mohammed Farook