JS error in AJAX framework when using a file input and data-request on a sibling field
@bennothommo is already working on this.
Since May 28, 2025.
- Dominant language
- PHP
- Stars
- 1.5k
- Forks
- 246
- Avg merge
- 19h 2m
- Merged PRs (30d)
- 7
Description
Winter CMS Build
dev-develop
PHP Version
8.3
Database engine
MySQL/MariaDB
Plugins installed
None
Issue description
Encountered this issue when migrating an application from OctoberCMS 1.1.
Using the legacy AJAX framework, if an input of type file exist in a form and another field in this form calls an AJAX handler (using a data-request attribute), the following JS error appears:
Unformatted text version
Uncaught TypeError: 'slice' called on an object that does not implement interface Blob.
jQuery 4
Request http://winter.test/modules/system/assets/js/framework.js?v=winter:171
request http://winter.test/modules/system/assets/js/framework.js?v=winter:505
dataTrackInputTimer http://winter.test/modules/system/assets/js/framework.js?v=winter:684
setTimeout handler*documentOnKeyup http://winter.test/modules/system/assets/js/framework.js?v=winter:680
jQuery 7
<anonymous> http://winter.test/modules/system/assets/js/framework.js?v=winter:659
<anonymous> http://winter.test/modules/system/assets/js/framework.js?v=winter:716
[jquery.js:2:88140](http://winter.test/themes/demo/assets/vendor/jquery.js)
jQuery 4
Request http://winter.test/modules/system/assets/js/framework.js?v=winter:171
request http://winter.test/modules/system/assets/js/framework.js?v=winter:505
dataTrackInputTimer http://winter.test/modules/system/assets/js/framework.js?v=winter:684
(Asynchrone : setTimeout handler)
documentOnKeyup http://winter.test/modules/system/assets/js/framework.js?v=winter:680
jQuery 7
<anonyme> http://winter.test/modules/system/assets/js/framework.js?v=winter:659
<anonyme> http://winter.test/modules/system/assets/js/framework.js?v=winter:716
The parent form has a data-request-files attribute, but the child field doesn't, the intent being that the file is not uploaded on every request.
This can happen for example when using wn-location-plugin and the Country+State fields.
Let me know if you would like me to dig a bit more, but I am not very familiar with the inner working of the AJAX framework.
Steps to replicate
Create the following CMS page in a theme using the legacy AJAX framework:
Demo page
title = "Form issue demo"
url = "/demo/form"
layout = "default"
==
function onSomeValueChange()
{
return [
'#echo' => input('someValue'),
];
}
==
<div class="container">
<!-- The form has data-request-files -->
<form data-request="onSubmit" data-request-files>
<input type="file" name="someFile">
<!-- The field causing trouble -->
<input type="text" name="someValue" data-request="onSomeValueChange" data-track-input=100>
<div id="echo"></div>
<button type="submit">Submit</button>
</form>
</div>
Then, access the page, open the browser dev tools and try to put a value in the text field. The error appears and no AJAX request is made.
Workaround
Adding data-request-files to the field allows to avoid the problematic code path, but it causes the file to be uploaded on every request (not just the form submit).
Snowboard does not seem to be impacted as far as I could test.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.