In my rails 4 app I have a form with two file field inputs that upload to S3:
<form accept-charset="UTF-8" action="/projects" class="new_project" enctype="multipart/form-data" id="new_project" method="post">
<input id="project_videos_attributes_0_poster" name="project[videos_attributes][0][poster]" type="file">
....
<input class="js-s3_file_field" data-acl="public-read" id="project_gifts_attributes_0_file" name="project[gifts_attributes][0][file]" type="file">
</form>
The first file field uses Carrierwave, and the other is hooked up to the s3_file_field gem for direct upload to S3, but both are disabled when the page is viewed on iPad. No other platform/vendor has this issue. It's also seen when the inputs are presented in isolation too.
I'm wondering if Turbolinks has any iPad specific issues. Could Rails UJS be the culprit? For what it's worth, here's the code that s3_file_field gem uses to hijack the second file input, but I just can't see how it could possibly cause either file field to be disabled on any platform:
ready = ->
$(".js-s3_file_field").each ->
id = $(this).attr('id')
$this = -> $("##{id}")
$progress = $(this).siblings('.progress').hide()
$meter = $progress.find('.meter')
$(this).S3FileField
add: (e, data) ->
$progress.show()
data.submit()
done: (e, data) ->
window.data = data.result
$progress.hide()
$this().attr(type: 'text', value: data.result.url, readonly: true)
fail: (e, data) ->
alert(data.failReason)
progress: (e, data) ->
progress = parseInt(data.loaded / data.total * 100, 10)
$meter.css(width: "#{progress}%")
$(document).ready(ready)
$(document).on('page:load', ready)
It's so strange. I can't read the HTML code on my iPad either which is why this is so hard to troubleshoot. Everything is fine on Linux, Windows, Mac, Android. Can't vouch for iPhone though.