Looping selecting file in Internet Explorer #747

New Issue

2017-04-18T05:41:13Z

kotromeo commented

2017-04-18 05:41:13 +00:00

(Migrated from github.com)

When click on Cancel when selecting file, its looping the process and it's showing again screen for selecting file.
Even if select file, after upload it's showing screen for select file again.

Video approve http://take.ms/NmrStJ

When click on Cancel when selecting file, its looping the process and it's showing again screen for selecting file. Even if select file, after upload it's showing screen for select file again. Video approve http://take.ms/NmrStJ

dr-mohamed-benkhalifa commented

2017-04-20 09:24:30 +00:00

(Migrated from github.com)

What version of IE you use ?

kotromeo commented

2017-04-20 09:28:12 +00:00

(Migrated from github.com)

Microsoft Edge
http://take.ms/X2HWC

Microsoft Edge http://take.ms/X2HWC

dr-mohamed-benkhalifa commented

2017-04-20 09:30:33 +00:00

(Migrated from github.com)

With ME (Microsoft Edge 38.14393.1066.0) I dont have any issue with file selection!
Can you provide the code you are using with the uploader?

With ME (Microsoft Edge 38.14393.1066.0) I dont have any issue with file selection! Can you provide the code you are using with the uploader?

dr-mohamed-benkhalifa commented

2017-04-20 09:31:39 +00:00

(Migrated from github.com)

Try to update your browser to the latest version...

kotromeo commented

2017-04-20 09:38:28 +00:00

(Migrated from github.com)

html http://take.ms/w6L62
ts http://take.ms/TRI3p http://take.ms/UT1sUJ

i can not ask users to update IE so it's should work even without updates.

html http://take.ms/w6L62 ts http://take.ms/TRI3p http://take.ms/UT1sUJ i can not ask users to update IE so it's should work even without updates.

dr-mohamed-benkhalifa commented

2017-04-20 09:39:34 +00:00

(Migrated from github.com)

Can you paste the code here please ?

kotromeo commented

2017-04-20 09:40:26 +00:00

(Migrated from github.com)

<div ng2FileDrop
    [ngClass]="{'nv-file-over': hasBaseDropZoneOver}"
    (fileOver)="fileOverBase($event)"
    [uploader]="uploader"
    class="drag-n-drop-container well my-drop-zone">
    <label class="upload-button">
        <input type="file"
            class="hidden"
            ng2FileSelect
            [uploader]="uploader"
        >
        +
    </label>
</div>

``` <div ng2FileDrop [ngClass]="{'nv-file-over': hasBaseDropZoneOver}" (fileOver)="fileOverBase($event)" [uploader]="uploader" class="drag-n-drop-container well my-drop-zone"> <label class="upload-button"> <input type="file" class="hidden" ng2FileSelect [uploader]="uploader" > + </label> </div> ```

kotromeo commented

2017-04-20 09:41:22 +00:00

(Migrated from github.com)

self.uploader.onSuccessItem = function () {
    self.response = JSON.parse(arguments[1]);
    switch (arguments[2]) {
        case 401:
            let toast: Toast = {
                type: 'error',
                title: 'Error',
                body: self.response.message ? self.response.message : 'Not specified error text.',
                onHideCallback: () => {
                    self.router.navigate(['login']);
                }
            };
            self.toasterService.pop(toast);
            break;
        case 200:
            let newPhotos = self.response.media.filter((newMedia) => {
                let index = self.data.media.findIndex((oldMedia) => {
                    return oldMedia.id === newMedia.id;
                });
                return index === -1;
            });
            if (newPhotos.length) {
                self.oldData.media = self.oldData.media.concat(newPhotos);
                self.data.media = self.data.media.concat(newPhotos);
                self.oldData.validationErrors = self.data.validationErrors = self.response.validationErrors;
            }
            self.toasterService.pop('success', 'Success uploaded file.');
            break;
        default:
            self.toasterService.pop('error', 'Error ' + arguments[1], self.response.message ? self.response.message : 'Not specified error text.');
            break;
    }
};
self.uploader.onErrorItem = function () {
    self.response = JSON.parse(arguments[1]);
    self.toasterService.pop('error', 'Error ' + arguments[2], self.response.message ? self.response.message : 'Not specified error text.');
};

``` self.uploader.onSuccessItem = function () { self.response = JSON.parse(arguments[1]); switch (arguments[2]) { case 401: let toast: Toast = { type: 'error', title: 'Error', body: self.response.message ? self.response.message : 'Not specified error text.', onHideCallback: () => { self.router.navigate(['login']); } }; self.toasterService.pop(toast); break; case 200: let newPhotos = self.response.media.filter((newMedia) => { let index = self.data.media.findIndex((oldMedia) => { return oldMedia.id === newMedia.id; }); return index === -1; }); if (newPhotos.length) { self.oldData.media = self.oldData.media.concat(newPhotos); self.data.media = self.data.media.concat(newPhotos); self.oldData.validationErrors = self.data.validationErrors = self.response.validationErrors; } self.toasterService.pop('success', 'Success uploaded file.'); break; default: self.toasterService.pop('error', 'Error ' + arguments[1], self.response.message ? self.response.message : 'Not specified error text.'); break; } }; self.uploader.onErrorItem = function () { self.response = JSON.parse(arguments[1]); self.toasterService.pop('error', 'Error ' + arguments[2], self.response.message ? self.response.message : 'Not specified error text.'); }; ```

ghost commented

2017-06-26 08:18:44 +00:00

(Migrated from github.com)

We have the same problem with Edge 40.15063.0.0 and EdgeHTML 15.15063. We use Angular 2.3.1 and ng2-file-upload 1.2.0. Is there already a solution for this problem?

makeitbetter-su commented

2017-07-10 11:47:57 +00:00

(Migrated from github.com)

Seems like bug in MS Edge https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/8282613/. Solution is the using INPUT tag outside of LABEL.

👍 4

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: dc/ng2-file-upload#747