Jsで複数画像をアップロードできる方法を知っていますか？

[yuta]

Multi-File Uploaderを使ってみたのですが、アップロードが遅すぎるのとconditionalで’s loadingが使えないので、ロード中かどうかが見た目でわからないのがいやで、JSを使って複数画像をアップロードさせたいと思っています。

しかし、以下のコードでjavascript to bubbleを使っても画像をDBに登録させることができなくて困っています。

画像1枚だけならいけたのですが、複数画像にとしてDBに読み込もうとうまくいきません…

よろしくお願いいたします。

<form>
            <div class="image-upload">
                <label for="file-input">
                    <img src="https://s3.amazonaws.com/appforest_uf/f1600002509614x764946865802154500/camera-28060.svg" style="width: 90px; height: 76px; cursor: pointer;" />
                </label>

                <input id="file-input" type="file" accept="image/*" multiple />
            </div>
        </form>

<script type="text/javascript">
    function readFile() {
        var base64_images = '';
        if (this.files) {
            var file_count = this.files.length;
            for (i = 0; i < this.files.length; i++) {
                var FR = new FileReader();
FR.onload = function(e) {
                    base64_images += e.target.result + '#';
                    if (file_count) {
bubble_fn_base64_images(base64_images);
console.log(base64_images);
                    }
                };
                FR.readAsDataURL(this.files[i]);
            }
        }
    }

    document.getElementById("file-input").addEventListener("change", readFile, false);
</script>

Bubble Editor - Js-test