That is on client side Button "Read input field" is not working for large Strings, large Strings simply are not entering Setter of field imageArrayId.
If I see JSF phases "Update Model Values" is just absent in case of large String, while is present for String less 1MB size.
I know that for transferring large data post http requests are not used, but where is it documented? And what is the way out for our case except splitting String to 1MB and using series of post requests?
<h:form id="formWebAdmin">
<h:inputHidden id="imageArrayId" value="#{manageScanFile.imageArray}"/>
<br/>
<h:outputText id="imageArrayOutId" value="#{manageScanFile.imageArray}"/>
<br/>
<div class="row-image-uploads" id="divrow1">
<label for="image_uploads" class="image-uploads-BTN">#{translate.getMessage("Load file")}</label>
<input type="file" id="image_uploads" name="file" style="opacity:0;display:none;" accept="image/*" capture="camera"></input>
<script type="text/javascript">
document.getElementById('image_uploads').addEventListener('change', handleFileSelect, false);
</script>
</div>
<p:commandButton value="Read input field"
process="@form" update="@none"
/>
<p:commandButton value="Write output field"
process="@form" update="formWebAdmin:imageArrayOutId"
/>
<p:commandButton value="Clear output field"
process="@this" update="formWebAdmin:imageArrayOutId"
action="#{manageScanFile.setImageArray('')}"
/>
</h:form>
<script>
function handleFileSelect(evt) {
console.log('handleFileSelect');
var file = evt.target.files; // FileList object
var f = file[0];
if (!f.type.match('image.*')) {
alert("Image only please....");
}
var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
document.getElementById('formWebAdmin:imageArrayId').value = e.target.result;
};
})(f);
reader.readAsDataURL(f);
}
</script>