Column Chooser Pop Up Does Not Stay Open

[Judi Smith]

I am having a problem where the ColumnChooser will show for a very brief (<1 sec) time. I don't actually see it, I just see the .css change from close to open and then right back. All of the other Grid functions work as expected. This very same code in this project has worked in the past. I am unclear what is causing the problem. Thank you in advance for your help.

I have the following Code:

//Component that holds the Open Column Chooser Button

<SearchBarComponent OnSearch="HandleSearch" OnExport="ExcelExport" OnAddRecord="HandleAddRecord" OnShow="HandleShow" OnPrint="HandlePrint" />

<br/>

<SfTab>

<TabItems>

<TabItem>

<HeaderTemplate>

    <div class="e-title">Active</div>

    <div style="padding: 0 4px; margin-left: 2px; background-color: var(--button-primary); color:  var(--button-primary-text)">@peopleCount</div>

</HeaderTemplate>

<ContentTemplate>

<div style="height: calc(100vh - 15rem);" class="grid-container">

<a name="target"></a>

<span class="error">@ErrorDetails</span>

<SfGrid DataSource="people" TValue="Person" ID="StudentGrid" @ref="DefaultGrid" AllowPaging="true" AllowSorting="true" AllowExcelExport="true" AllowReordering="true"

        ShowColumnMenu="true" ColumnMenuItems="@menuItems" ShowColumnChooser="true" RowHeight="70" Height="100%" Toolbar="@toolbarItems">

<GridEvents OnRecordDoubleClick="RecordDoubleClickHandler" TValue="Person" OnActionFailure="@ActionFalure"></GridEvents>

<GridPageSettings PageSize="50" PageSizes="new int[] {50, 100, 150, 200}"></GridPageSettings>

<GridEditSettings AllowAdding="true" AllowEditing="true" Mode="EditMode.Dialog">

// Grid Editor Template

</GridEditSettings>

<GridColumns>

// Grid Column Templates

</GridColumns>

</SfGrid>

</TabItem>

// More (Empty) Tabs

</TabItems>

</SfTab>

</div>

//Send Email Pop Up Form

<EmailDialogComponent @ref="emailDialog"></EmailDialogComponent>

@code {

    private IEnumerable<Person> people;

    private string ErrorDetails = "";

    private SfGrid<Person> DefaultGrid;

    public string[] toolbarItems = new[] {"ColumnChooser"}; //Only to see if this would work

    private int peopleCount = 0;

    private EmailDialogComponent emailDialog;

    private string[] menuItems = new string[] {"SortAscending", "SortDescending", "AutoFit", "AutoFitAll", "ColumnChooser"};

    protected override async Task OnInitializedAsync()

    {

        base.OnInitialized();

        people = await Http.GetFromJsonAsync<List<Person>>("api/people");

        peopleCount = people.Count();

    }

    private void HandleSearch(string filter)

    {

        DefaultGrid.Search(filter);

    }

    private async Task ExcelExport()

    {

        await DefaultGrid.ExcelExport();

    }

    private async Task HandleAddRecord()

    {

        await DefaultGrid.AddRecord();

    }

    private async Task HandleShow()

    {

        // int height, width;

        // var dimension = await Service.GetDimensions();

        // height = dimension.Height;

        // width = dimension.Width;

        //await DefaultGrid.OpenColumnChooser(width - 550, 50);

        await DefaultGrid.OpenColumnChooser(200, 50); //Changed to make sure it was on the page - hasn't helped

    }

    private async Task HandlePrint()

    {

        await DefaultGrid.Print();

    }

    private void RecordDoubleClickHandler(RecordDoubleClickEventArgs<Person> args)

    {

        NavigationManager.NavigateTo("/profile/" + args.RowData.Id);

    }

    private void Navigate(Person person)

    {

        NavigationManager.NavigateTo("/profile/" + person.Id.ToString());

    }

    private void OpenDialog(Person person)

    {

        emailDialog.OpenDialog(person);

    }

    private void ActionFalure(FailureEventArgs eventArgs)

    {

        ErrorDetails = eventArgs.Error.Message;

    }

}

[Rahul Narayanasamy]

Hi Judi, 

Greetings from Syncfusion. 

Query: Column Chooser Pop Up Does Not Stay Open - I am having a problem where the ColumnChooser will show for a very brief (<1 sec) time 

We have validated your query with the provided details and checked the reported problem. We could not face the problem at our end. Here, we have opened column chooser using OpenColumnChooser method in button click and it does not close immediately as mentioned by you. Find the below sample for your reference. 

Sample: https://www.syncfusion.com/downloads/support/forum/162732/ze/SampleColChooser-1498112346  

If you are still facing the problem, then could you please share the below details. It will be helpful to validate and provide a better solution. 

• Reproduce the problem in the provided sample and revert back to us.
• Share .Net version details and Syncfusion NuGet version details.
• Share your _Host.cshtml(if you are using server side app) or index.html(if you are using web assembly  app).
• Video demonstration of the problem.
• Share a simple reproduceable sample if possible.

Regards, 

Rahul