I followed this question to resize image before upload and it works. But I need to post this image like when I submit the form.. I have tried lots of things to do this but no way.. I don't want to send it with ajax. It should be appended to post request as does. Documents/answers that I found say 'post with ajax'..
Do you have an idea? Thank you for your helps!
Edit: here is the code. (almost identical with the link above)
    function handleFiles()
    {
        var filesToUpload = $(this)[0].files;
        var file = this_input.get(0).files[0];
        var name = file.name;
        // Create an image
        var img = document.createElement("img");
        // Create a file reader
        var reader = new FileReader();
        // Set the image once loaded into file reader
        var ctx;
        var dataurl;
        reader.onload = function(e)
        {
            img.src = e.target.result;
            alert(e.target.result);
            var canvas = document.createElement("canvas");
            //var canvas = $("<canvas>", {"id":"testing"})[0];
            var ctx = canvas.getContext("2d");
            ctx.drawImage(img, 0, 0);
            var MAX_WIDTH = 1920;
            var MAX_HEIGHT = 1080;
            var width = img.width;
            var height = img.height;
            if (width > height) {
                if (width > MAX_WIDTH) {
                    height *= MAX_WIDTH / width;
                    width = MAX_WIDTH;
                }
            } else {
                if (height > MAX_HEIGHT) {
                    width *= MAX_HEIGHT / height;
                    height = MAX_HEIGHT;
                }
            }
            canvas.width = width;
            canvas.height = height;
            ctx = canvas.getContext("2d");
            ctx.drawImage(img, 0, 0, width, height);
            dataurl = canvas.toDataURL("image/jpeg");
            //$('#img_hidden').attr('value', dataurl);
            document.getElementById('image').src = dataurl;
        }
        // Load files into file reader
        reader.readAsDataURL(file);
    }
 
    