1. Home
  2. Forum
  3. ASP.NET Core - EJ 2
  4. Working Example with Razor Pages

Working Example with Razor Pages

Hi,

I'm trying to get the "Initialize the File Manager" example from the "Getting Started" section located here

https://ej2.syncfusion.com/aspnetcore/documentation/file-manager/getting-started/

working for Razor Pages in ASP.NET Core 5.0

I'm currently stuck updating the FileOperations method to razor pages.

I tried changing the return type to ActionResult<string> but get the following error

InvalidOperationException: Unsupported handler method return type 'Microsoft.AspNetCore.Mvc.ActionResult`1[System.String]'.


Is it possible to get a Razor Pages example of this example?

Cheers


12 Replies 1 reply marked as answer
IL Indhumathy Loganathan Syncfusion Team July 16, 2021 02:25 PM UTC

Hi Sean, 
 
Greetings from Syncfusion support. 
 
We have validated your reported query in File Manager component. We have prepared a Core sample in .NET 5.0 using the exact code in our getting started page with File Manager component. Please find the sample from below link. 
 
 
Please follow the steps in below UG to configure Syncfusion components in Core. 
 
 
Then replace the code blocks in our Getting Started page to corresponding pages. Please check the above sample and ensure whether you have performed any code changes in your sample. If so, then share your exact requirement with File Manager component and replicate the issue in the shared sample(if possible) which will help us to assist you promptly.  
 
Please let us know if you need any further assistance. 
 
Regards, 
Indhumathy L 


SB Sean Bryant July 20, 2021 06:18 AM UTC

Hi Indhumathy,


Thankyou for the reply, im still having issues applying what you supplied me in my example, i've attached my example for you to review.


If you could take a look at what i have so far and let me know where im going wrong that would get great!


Regards,

Sean


Attachment: 202107201613_ls.demo.website.syncfusion.20210713_5ede9ca2.rar

SS Sharon Sanchez Selvaraj Syncfusion Team July 21, 2021 02:01 PM UTC

Hi Sean,
 
 
Thanks for the sample.
 
 
We are currently validating with your reported scenario. We will check and provide further details within three business days, by July 26th 2021.
 
 
We appreciate your patience.
 
 
Regards,
 
 
Sharon Sanchez S.


SS Sharon Sanchez Selvaraj Syncfusion Team July 26, 2021 11:56 AM UTC

Hi Sean, 
 
Thanks for your patience.  
 
We have checked with your sample, but we had faced few issues when trying to run the application. So, we have created a similar application for your reference. With regards to your previous update regarding the error caused due to the use of string return type, please use the IActionResult return type to resolve the issue. 
 
Refer to the below general blogs where similar queries are addressed. 
 
 
 
Refer to the sample link. 
 
 
Please get back to us if you need any further assistance. 
 
Regards, 
 
Sharon Sanchez S. 


Marked as answer
SH Sheldon August 13, 2021 07:39 PM UTC

I tried using the example you gave above which works fine. But when I try to add the code to a Razor Page in another application I get a network error consistently.

The only real difference is that the FileManager is located at /FileManager/Index instead of root site.

My file gets the following 


Screenshot 2021-08-13 153539.png



IL Indhumathy Loganathan Syncfusion Team August 16, 2021 12:12 PM UTC

Hi Sheldon, 
 
We have validated your reported query in File Manager component and able to reproduce the reported issue just by moving the Index file inside a FileManager folder. File Manager utilizes the URL mentioned in ajaxSettings to send file operation request to the server. So you need to map proper URL in the ajaxSettings. 
 
You can resolve the reported issue by mapping the proper URL in the ajaxSettings as demonstrated in the below code snippet. 
 
<ejs-filemanager id="file" success="onSuccess" failure="onFailure"> 
    <e-filemanager-ajaxsettings url="/FileManager/Index?handler=FileOperations" getImageUrl="/FileManager/Index?handler=GetImage" uploadUrl="/FileManager/Index?handler=Upload" downloadUrl="/FileManager/Index?handler=Download"> 
    </e-filemanager-ajaxsettings> 
</ejs-filemanager> 
 
Please get back to us if you need any further assistance. 
 
Regards, 
Indhumathy L 


SH Sheldon August 17, 2021 12:37 PM UTC

That is what my filemanager looks like and it is giving the networkerror.

The following is the code in the file, I just copied and changed what was needed to move it to that folder.

Including the PhysicalFileProvider.cs file.

/FileManager/Index.cshtml file

<ejs-filemanager id="file" success="onSuccess" failure="onFailure">

    <e-filemanager-ajaxsettings url="/FileManager/Index?handler=FileOperations" getImageUrl="/FileManager/Index?handler=GetImage" uploadUrl="/FileManager/Index?handler=Upload" downloadUrl="/FileManager/Index?handler=Download">

    </e-filemanager-ajaxsettings>

</ejs-filemanager>

<script>

    // File Manager's file onSuccess function

    function onSuccess() {

        console.log("Ajax request successful");

    }

    // File Manager's file onError function

    function onFailure() {

        console.log("Ajax request has failed");

    }

</script>


/FileManager/Index.cshtml.cs

public PhysicalFileProviderTest operation;

        public string basePath;

        string root = "wwwroot\\Files";

        public IndexModel(IHostingEnvironment hostingEnvironment)

        {

            this.basePath = hostingEnvironment.ContentRootPath;

            this.operation = new PhysicalFileProviderTest();

            this.operation.RootFolder(this.basePath + "\\" + this.root);

        }


        public IActionResult OnPostFileOperations([FromBody] FileManagerDirectoryContent args)

        {

...

}

public IActionResult OnPostUpload(string path, IList<IFormFile> uploadFiles, string action)

        {

...

}

public IActionResult OnPostDownload(string downloadInput)

        {

            ...

        }


        // gets the image(s) from the given path\

        public IActionResult OnGetGetImage(FileManagerDirectoryContent args)

        {

            ...

        }



IL Indhumathy Loganathan Syncfusion Team August 18, 2021 02:10 PM UTC

Hi Sheldon, 
 
We have validated your reported query. We have prepared a sample where we placed all the File Manager related files inside the “FileManager” folder(similar to your scenario) but we are unable to replicate the issue in our end. You can find the sample from below link. 
 
 
We have recorded the File Manager rendering in the below video for your reference. 
 
 
Please check the shared details and if the issue persists, kindly share a video footage on the steps to reproduce the issue and stack trace on the error. If possible, replicate the issue in the above sample to serve you better. 
 
Regards, 
Indhumathy L 


CC Charles Cherry January 15, 2025 01:15 AM UTC

Was this ever resolved? I'm literally trying the same thing and getting the same results. I downloaded the sample app and copied the code into my page and it still doesn't work. I get the XMLHttp error popup.


PM Prasanth Madhaiyan Syncfusion Team January 15, 2025 12:53 PM UTC

Hi Charles,


Based on the shared details, you were facing an issue in the FileManager component while checking the sample we shared three years ago. However, we have downloaded the same sample and tested it at our end without making any changes. The sample is running properly, and file operations are also working as expected without any issues on our end.


For your reference, we have attached the sample and screenshot.


Sample: Attached as a zip file.


Screenshot:


Please check and run the attached sample (navigate to the FileManager/Index), and if you are still facing any issues, could you replicate the issue in the attached sample or share a replicated sample along with video footage for our better understanding? This will help us provide you with a prompt solution. Kindly get back to us with the requested details.


Regards,

Prasanth Madhaiyan.


Attachment: WebApplication_a5e1d88d.zip

CC Charles Cherry January 16, 2025 10:51 PM UTC

I finally got my filemanager partially working. In the end I had to add the attribute "

[IgnoreAntiforgeryToken]" to the pagemodel class and then the filemanager displayed the folders.


Everything seems to be working now except Download. The files are downloaded, but as soon as the operation is complete my app shuts down.


The download handler looks like this:

        public IActionResult OnPostDownload(string downloadInput)

        {

            FileManagerDirectoryContent args = Newtonsoft.Json.JsonConvert.DeserializeObject<FileManagerDirectoryContent>(downloadInput);

            var result = operation.Download(args.Path, args.Names);

            return result;

        }


Any help would be appre


PM Prasanth Madhaiyan Syncfusion Team January 17, 2025 01:07 PM UTC

Hi Charles,


Based on the shared code snippets for the download operation, we tested the functionality in both older and latest package versions. However, the download operation worked properly, and we were unable to replicate the reported application shutdown after the operation completed.


For your reference, we have attached the sample and video footage.


Sample and video: attached as a zip file.


Please check the attached sample. If the issue still persists on your end, kindly replicate the issue in the attached sample or share a sample where the issue can be reproduced. To provide you with a better solution, we need to replicate the issue on our end. Kindly get back to us with the requested details.


Regards,

Prasanth Madhaiyan.


Attachment: WebApplication_f748e552.zip

Loader.
Up arrow icon