Dear Expert,
I've a function in WEB App that handle an image selection in HTML
It's working fine and B4J Event triggered and parse all the parameter smoothly, but when the image size is bigger than 49000 Byte / 49 KB, it broken when running
b4j_raiseEvent("GetImage_ClickEvent", { value1: e.target.result, value2: fileproperties.files.item(0).size, value3: fileproperties.files.item(0).name, value4: cFile });
Below is the script of the HTML
Please help, is there any way to solve this issue ?
Thanks for your help
I've a function in WEB App that handle an image selection in HTML
It's working fine and B4J Event triggered and parse all the parameter smoothly, but when the image size is bigger than 49000 Byte / 49 KB, it broken when running
b4j_raiseEvent("GetImage_ClickEvent", { value1: e.target.result, value2: fileproperties.files.item(0).size, value3: fileproperties.files.item(0).name, value4: cFile });
Below is the script of the HTML
Get Image:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, viewport-fit=cover" />
<link rel="stylesheet" type="text/css" href="/template/styles/bootstrap.css">
<link rel="stylesheet" type="text/css" href="/template/styles/style.css">
<link rel="stylesheet" type="text/css" href="/template/fonts/css/fontawesome-all.min.css">
<link rel="manifest" href="_manifest.json" data-pwa-version="set_in_manifest_and_pwa_js">
<link rel="apple-touch-icon" sizes="180x180" href="/template/app/icons/icon-192x192.png">
<title>Accomodation</title>
<style id="jqstyle">
</style>
</head>
<body class="theme-light" data-highlight="highlight-red" data-gradient="body-default" style="background-color: white;">
<div id="preloader">
<div class="spinner-border color-highlight" role="status"></div>
</div>
<div class="sidebaradmin" style="position: fixed; z-index:99;">
<div id="jqheader"></div>
<div id="jqmore"></div>
</div>
<div class="main">
<div id="jqcontent"></div>
<div id="footer-bar" class="footer-bar-1" style="margin-left: 200px; background-color: whitesmoke;">
<button id="jqaddguest" type="button" class="btn btn-danger rounded-xxl"" style=" height: 50px; width: 47px;
margin-top: 5px; margin-left: 48%; text-align: center; font-size:x-large; padding-top: 5px;">+</button>
</div>
</div>
<!--==========================JAVA SCRIPT========================== -->
<script type="text/javascript" src="/template/scripts/jquery.min.js"></script>
<script type="text/javascript" src="/template/scripts/b4j_ws.js"></script>
<script type="text/javascript" src="/template/scripts/bootstrap.min.js"></script>
<script type="text/javascript" src="/template/scripts/custom.js"></script>
<script>
$(document).ready(function () {
b4j_connect("/wspgAccomodationDetail");
});
</script>
function getimage(cFile) {
var file = document.getElementById(cFile).files[0];
const fileproperties = document.getElementById(cFile);
var reader = new FileReader();
reader.onloadend = function (e) {
b4j_raiseEvent("GetImage_ClickEvent", { value1: e.target.result, value2: fileproperties.files.item(0).size, value3: fileproperties.files.item(0).name, value4: cFile });
}
reader.readAsDataURL(file);
}
</script>
</body>
</html>Please help, is there any way to solve this issue ?
Thanks for your help