Trying to implement file uploads by drag'n'drop, I run into the "Error: There is no file with ID 1. The file list may have changed" issue #11878
Unanswered
TheGreenAirplane
asked this question in
Q&A
Replies: 1 comment
-
I'd suggest to read this #9586 (comment) and look at this PR #9600 that solves it |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Hello,
I'm implementing a chat using MudBlazor UI. I'm trying to add drag'n'drop support. I don't upload the files immediately after they are added. Instead they are "stored" in a List of IBrowserFile, and when the user presses send on the message, they get uploaded:
protected List selectedFiles = new();
protected async void OnFilesChanged(InputFileChangeEventArgs e)
I have a MudFileUpload control, but I can't use its ActivatorContent for drag'n'drop. I need the whole chat window to be targetable for dnd, and in any case I don't have space in my UI for for an explicit drop zone.
I found this solution:
https://www.meziantou.net/upload-files-with-drag-drop-or-paste-from-clipboard-in-blazor.htm
which seems to work great, except there's one problem: if I do more than one drag'n'drop operation before I hit send, I get the well known error:
Exception || There is no file with ID 1. The file list may have changed. See https://aka.ms/aspnet/blazor-input-file-multiple-selections. Error: There is no file with ID 1. The file list may have changed. See https://aka.ms/aspnet/blazor-input-file-multiple-selections. at pt (https://localhost:7173/_framework/blazor.web.js?v=7:1:37745) at Object.readFileData (https://localhost:7173/_framework/blazor.web.js?v=7:1:37671) at https://localhost:7173/_framework/blazor.web.js?v=7:1:2900 at new Promise () at w.beginInvokeJSFromDotNet (https://localhost:7173/_framework/blazor.web.js?v=7:1:2857) at vn._invokeClientMethod (https://localhost:7173/_framework/blazor.web.js?v=7:1:65750) at vn._processIncomingData (https://localhost:7173/_framework/blazor.web.js?v=7:1:63139) at Rn.onreceive (https://localhost:7173/_framework/blazor.web.js?v=7:1:56780) at WebSocket. (https://localhost:7173/_framework/blazor.web.js?v=7:1:80728) || at Microsoft.AspNetCore.Components.Forms.BrowserFileStream.OpenReadStreamAsync(CancellationToken cancellationToken) at Microsoft.AspNetCore.Components.Forms.BrowserFileStream.CopyFileDataIntoBuffer(Memory
1 destination, CancellationToken cancellationToken) at Microsoft.AspNetCore.Components.Forms.BrowserFileStream.ReadAsync(Memory1 buffer, CancellationToken cancellationToken) at System.IO.Stream.g__Core|27_0(Stream source, Stream destination, Int32 bufferSize, CancellationToken cancellationToken) at
I tried diving into this, even found a possible workaround from the same author:
https://www.meziantou.net/uploading-multiple-files-to-using-inputfile-in-blazor.htm
it didn't help. I understand that this was somehow solved in MudBlazor's MudFileUpload component, but going through the source it left me none the wiser. Can anyone advise?
Beta Was this translation helpful? Give feedback.
All reactions