File manager closes after upload in dialog

[M.Alp]

Hi

I want to use file manager after uploading it without closing the dialog.But as seen in the picture, i cant do anything after upload.File manager goes black.Like a read only.How can I keep it open ?

 <SfFileManager TValue="FileManagerDirectoryContent">

                                    <FileManagerEvents TValue="FileManagerDirectoryContent" OnSend="OnSend"></FileManagerEvents>

                                    <FileManagerAjaxSettings Url="/api/FileManager/FileOperations"

                                                             UploadUrl="/api/FileManager/Upload"

                                                             DownloadUrl="/api/FileManager/Download"

                                                             GetImageUrl="/api/FileManager/GetImage">

                                    </FileManagerAjaxSettings>

                                    <FileManagerUploadSettings></FileManagerUploadSettings>

                                    <FileManagerNavigationPaneSettings Visible=false></FileManagerNavigationPaneSettings>

                                </SfFileManager>

Attachment: Fm_Moment(2)_8915a961.zip

[Indhumathy Loganathan]

Hi M.Alp,

Greetings from Syncfusion support.

We have prepared a Blazor sample where the File Manager is rendered within the Dialog component in the 19.4.43 package version. But we are unable to recreate the exact reported issue at our end. We can see in your video that the upload dialogue itself is prevented for interactions. In File Manager, by default, we prevent only the background interactions with File Manager while uploading but not the upload dialog.

Check the attached sample for reference.

https://www.syncfusion.com/downloads/support/forum/172421/ze/FileManagerPhysicalProvider-731662031

We suspect that this issue may occur due to some of the customizations made at your end. Kindly share the complete code and CSS style customizations done at your end. If possible, replicate the issue in the shared sample. These details would help us to assist you promptly.

Please let us know if you need any further assistance.

Regards,

Indhumathy L

[M.Alp]

Its opening in grid edit dialog.I'm using bootstrap.

<div style="height:calc(100vh - 20rem);">

        @{

            var intialGrouping = (new string[] { "StoreDefinition" });

        }

        <SfGrid @ref="InspectionGrid" DataSource="@InspectionData" EnableHover="false" Height="650" Width="%100" RowHeight="38" ShowColumnChooser="true" Toolbar="@(new List<string>() { "Edit", "Update", "Cancel", "ColumnChooser","Print" })" AllowResizing="true" AllowPaging="true" AllowFiltering="true" AllowGrouping="true" AllowSorting="true">

            <GridPageSettings PageSize="80"></GridPageSettings>

            <GridGroupSettings EnableLazyLoading="true" Columns="@intialGrouping" ShowDropArea="false"></GridGroupSettings>

            <GridFilterSettings Type="Syncfusion.Blazor.Grids.FilterType.Excel"></GridFilterSettings>

            <GridEvents OnActionBegin="ActionBeginHandler" CommandClicked="CommandClickHandler" TValue="Inspection"></GridEvents>

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

                <Template>

                    @{

                        var inspections = (context as Inspection);

                        InspId = inspections.InspectionId;

                        bool isExists = false;

                        var subPath = @"wwwroot\Files\InspectionPictures\" + InspId;

                        System.IO.Directory.Exists(subPath);

                        if (!isExists)

                            System.IO.Directory.CreateDirectory(subPath);

                    }

                    <form class="row g-3">

                        <div class="form-group col-md-12">

                            <SfTextBox ID="Question" Readonly="true" @bind-Value="@(inspections.Question)" FloatLabelType="FloatLabelType.Always" Placeholder="Soru"></SfTextBox>

                        </div>

                        <div class="form-group col-md-12">

                            <SfTextBox ID="Description" Readonly="true" @bind-Value="@(inspections.Description)" FloatLabelType="FloatLabelType.Always" Placeholder="Açıklama"></SfTextBox>

                        </div>

                        <div class="form-group col-md-12">

                            <SfDropDownList ID="Answer" Placeholder="Sonuç" @bind-Value="inspections.Answer" TValue="string" TItem="string" DataSource="@_Answer">

                            </SfDropDownList>

                        </div>

                        <div class="form-group col-md-12">

                            <SfTextBox ID="Comment" @bind-Value="@(inspections.Comment)" FloatLabelType="FloatLabelType.Always" Placeholder="Not"></SfTextBox>

                        </div>

                        <div class="form-group col-md-12">

                            <SfFileManager TValue="FileManagerDirectoryContent">

                                <FileManagerEvents TValue="FileManagerDirectoryContent" OnSend="OnSend"></FileManagerEvents>

                                <FileManagerAjaxSettings Url="/api/FileManager/FileOperations"

                                                         UploadUrl="/api/FileManager/Upload"

                                                         DownloadUrl="/api/FileManager/Download"

                                                         GetImageUrl="/api/FileManager/GetImage">

                                </FileManagerAjaxSettings>

                                <FileManagerUploadSettings></FileManagerUploadSettings>

                                <FileManagerNavigationPaneSettings Visible=false></FileManagerNavigationPaneSettings>

                            </SfFileManager>

                        </div>

                    </form>

                </Template>

            </GridEditSettings>

            <GridColumns>

                <GridColumn HeaderText="Ok" Width="40">

                    <GridCommandColumns>

                        <GridCommandColumn Type="CommandButtonType.None" ID="Answer" ButtonOption="@(new CommandButtonOptions() {IconCss="e-icons e-check", CssClass="e-flat" })"></GridCommandColumn>

                    </GridCommandColumns>

                </GridColumn>

                <GridColumn HeaderText="Edit" Width="40">

                    <GridCommandColumns>

                        <GridCommandColumn Type="CommandButtonType.Edit" ID="Edit" ButtonOption="@(new CommandButtonOptions() {IconCss="e-icons e-edit", CssClass="e-flat" })"></GridCommandColumn>

                    </GridCommandColumns>

                </GridColumn>

                <GridColumn HeaderText="Pdf" Width="40">

                    <GridCommandColumns>

                        <GridCommandColumn Type="CommandButtonType.None" ID="Document" ButtonOption="@(new CommandButtonOptions() {IconCss="oi oi-list-rich", CssClass="e-flat" })"></GridCommandColumn>

                    </GridCommandColumns>

                </GridColumn>

                <GridColumn Field=@nameof(Inspection.InspectionId) Visible="false" HeaderText="Id" Width="50"></GridColumn>

                <GridColumn Field=@nameof(Inspection.StoreDefinition) HeaderText="Bayi" Width="50"></GridColumn>

                <GridColumn Field=@nameof(Inspection.Question) HeaderText="Soru" Width="180"> </GridColumn>

                <GridColumn Field=@nameof(Inspection.Answer) EditType = "EditType.DropDownEdit" HeaderText="Cevap" Width="40"></GridColumn>

                <GridColumn Field=@nameof(Inspection.Comment) HeaderText="Denetim Notu" Width="100"></GridColumn>

                <GridColumn Field=@nameof(Inspection.Point) HeaderText="T.Puan" Width="40"></GridColumn>

                <GridColumn Field=@nameof(Inspection.InspectionQuestionPoint) HeaderText="D.Puan" Width="40"></GridColumn>

            </GridColumns>

        </SfGrid>

    </div>

[Keerthana Rajendran]

Hi M.Alp, 

 

Thanks for sharing the code. 

 

We have rendered the File Manager within Grid edit dialog using your code. But still, we couldn’t recreate the issue and the upload dialog is accessible(can be closed after upload) in our sample as shown below. 

 

 

 

We have attached the modified sample for your reference in the following link. 

 

https://www.syncfusion.com/downloads/support/forum/172421/ze/FileManager_within_GridTemplate-498544379 

 

Please confirm whether the same issue occurs with above sample too. If so, share the video footage on the same.  

 

Since the issue seems to be specific to your application, kindly modify the sample along with your package version to recreate the issue so that we can validate further and provide a prompt solution. 

 

Regards, 

Keerthana R. 

[M.Alp]

Hi,

I replaced my "site.css" with yours.Problem solved but I created this project with Syncfusion Extension.And I didnt change it.So it should be checked.What is blocking the upload popup in css generated from the extension and why?

Thank you for your help.I'm grateful.

[Keerthana Rajendran]

Hi M.Alp,  

Most welcome. 

Yes, we can reproduce the reported issue while using File Manager in DataGrid Blazor Template Studio samples and we logged a bug report for this issue. This fix will be included in upcoming weekly patch releases of February 2022. 

You can track further details about this fix from the following feedback link.

https://www.syncfusion.com/feedback/32389/file-manager-closes-issues-in-syncfusion-blazor-template-studio-samples 

Regards, 

Keerthana R. 

[Indhumathy Loganathan]

Hi M.Alp, 

 

Based on the level of priority, we are sorry that the issue “File Manager closes issues in Syncfusion Blazor Template Studio samples” isn’t included in the promised release. This fix will be included in our 2022 Volume 1 Main Release, which is scheduled to be rolled out by March 2022. 

 

Please track the previous shared feedback for status. 

 

Regards, 

Indhumathy L