Selecting files not working
-
I have v1.3.7.7 installed. File uploading has problems with the field. The plugin is set to use jQuery because regular JS mode does not work on this site – the “Choose files” link does nothing when clicked.
So with “Enable jQuery” enabled the clicking of “Choose files” works where I can select a file and it is uploaded, but drag and drop does not work. With drag and drop a message is displayed “The uploaded file exceeds the maximum upload size of your server.” This is with small files, 12K and 37K in my tests. That does not occur with the clicking of “Choose files”. This is not a problem PHP upload size limit.
Tested on Firefox and Chrome. Page HTML has been validated.
What is causing this?
Here’s the page: https://www.multiviewfurniturerepair.com/#requestandestimateThe page I need help with: [log in to see the link]
-
Glen I can upload files using the “Browse” link, what does not work is dragging and dropping a file from a file manager. I open a file manager on my system and open the form web page in my browser. I grab an image file in the file manager and drag it over to the form’s file upload section. At that point the border around that field highlights (border turns darker and bolder to show it’s the active target). Then I drop the file over the form field and nothing happens, the file is not uploaded. And at that time in the browser inspector there is no network activity.
Using your modified JS file, the drop event is triggered. But nothing is in the file list object. Here’s the output from the console:
FileList [] ? length: 0 ? <prototype>: FileListPrototype { item: item(), length: Getter, … }Object { originalEvent: drop, type: "drop", isDefaultPrevented: Ne(), target: div.codedropz-upload-inner, currentTarget: div.codedropz-upload-handler, relatedTarget: null, timeStamp: 20471, jQuery37109784926069615019: true, delegateTarget: div.codedropz-upload-handler , handleObj: {…}, … } ? currentTarget: <div class="codedropz-upload-handler"> ? data: undefined ? delegateTarget: <div class="codedropz-upload-handler">? handleObj: Object { type: "drop", origType: "drop", guid: 21, … } ? isDefaultPrevented: function Ne()? isPropagationStopped: function Ne() ? jQuery37109784926069615019: true ? originalEvent: drop { target: div.codedropz-upload-inner , buttons: 0, clientX: 726, … } ?? altKey: false ?? bubbles: true ?? button: 0 ?? buttons: 0 ?? cancelBubble: false ?? cancelable: true ?? clientX: 726 ?? clientY: 651 ?? composed: true ?? ctrlKey: false ?? currentTarget: null ?? dataTransfer: DataTransfer { dropEffect: "move", effectAllowed: "uninitialized", mozCursor: "auto", … } ??? dropEffect: "move" ??? effectAllowed: "uninitialized" ??? files: FileList [] ???? length: 0 ???? <prototype>: FileListPrototype { item: item(), length: Getter, … } ??? items: DataTransferItemList { 0: DataTransferItem, 1: DataTransferItem, length: 2 } ???? 0: DataTransferItem { kind: "string", type: "text/x-moz-url" } ???? 1: DataTransferItem { kind: "string", type: "text/plain" } ???? length: 2 ???? <prototype>: DataTransferItemListPrototype { add: add(), remove: remove(), clear: clear(), … } ??? mozCursor: "auto" ??? mozSourceNode: null ??? mozUserCancelled: false ??? types: Array [ "text/x-moz-url", "text/plain" ] ??? <prototype>: DataTransferPrototype { setDragImage: setDragImage(), getData: getData(), setData: setData(), … } ?? defaultPrevented: true ?? detail: 0 ?? eventPhase: 0 ?? explicitOriginalTarget: <div class="codedropz-upload-inner"> ?? isTrusted: true ?? layerX: 303 ?? layerY: 24 ?? metaKey: false ?? movementX: 0 ?? movementY: 0 ?? offsetX: 0 ?? offsetY: 0 ?? originalTarget: <div class="codedropz-upload-inner"> ?? pageX: 726 ?? pageY: 3413 ?? rangeOffset: 0 ?? rangeParent: null ?? relatedTarget: null ?? returnValue: false ?? screenX: 2344 ?? screenY: 808 ?? shiftKey: false ?? srcElement: <div class="codedropz-upload-inner">?? target: <div class="codedropz-upload-inner"> ?? timeStamp: 20471 ?? type: "drop" ?? view: Window https://www.multiviewfurniturerepair.com/#requestandestimate ?? which: 1 ?? x: 726 ?? y: 651 ?? <get isTrusted()>: function isTrusted() ?? <prototype>: DragEventPrototype { initDragEvent: initDragEvent(), dataTransfer: Getter, … } ? relatedTarget: null ? target: <div class="codedropz-upload-inner"> ? timeStamp: 20471 ? type: "drop" ? <prototype>: Object { constructor: Event(e, t), isDefaultPrevented: qe() , isSimulated: false, … } ?? altKey: ?? bubbles: ?? button: ?? buttons: ?? cancelable: ?? changedTouches: ?? char: ?? charCode: ?? clientX: ?? clientY: ?? code: ?? constructor: function Event(e, t)?? ctrlKey: ?? detail: ?? eventPhase: ?? isDefaultPrevented: function qe()?? isImmediatePropagationStopped: function qe()?? isPropagationStopped: function qe() ?? isSimulated: false ?? key: ?? keyCode: ?? metaKey: ?? offsetX: ?? offsetY: ?? pageX: ?? pageY: ?? pointerId: ?? pointerType: ?? preventDefault: function preventDefault()?? screenX: ?? screenY: ?? shiftKey: ?? stopImmediatePropagation: function stopImmediatePropagation()?? stopPropagation: function stopPropagation()?? targetTouches: ?? toElement: ?? touches: ?? view: ?? which:
- You must be logged in to reply to this topic.
