Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

161
Views
Picture upload interrupted in JavaScript

Consider the following script:

    function uploadPicture(myindex, stringid)
{
    uploadingpicture = true;
    let fileform = document.getElementById("fileform" + myindex);
    let file = fileform.elements.namedItem('file').files[0];
    let type = file.type;
    let size = file.size;
    console.log('User is trying to upload a ' + type + ' file called ' + stringid + ' (size: ' + size + ')');

    let contents = new FileReader(); // no arguments
    contents.readAsDataURL(file);

    contents.onloadend = function ()
    {

        let filename;
        let client;
        let filecontainer = document.getElementById('file' + myindex);
        if (filecontainer != null)
        {
            filename = filecontainer.innerHTML.replace(/\+/g, '+').replace(/&/g, '&').replace(/#/g, '#').replace(/%/g, '%');
        }
        let clientcontainer = document.getElementById('myclient');
        if (clientcontainer != null)
        {
            client = clientcontainer.innerHTML.replace(/\+/g, '+').replace(/&/g, '&').replace(/#/g, '#').replace(/%/g, '%');
        }

        postRequest(
            'ajaxcalls/ajaxUploadPicture.php', // url
            '&client=' + client +
            '&stringid=' + stringid +
            '&filename=' + filename +
            '&field=' + myindex +
            '&type=' + type +
            '&contents=' + contents.result,
            function (responseText)
            {
                return drawOutputUploadPicture(myindex, responseText);
            },  // success
            drawErrorUploadPicture   // error
        );
    }

    contents.onerror = function ()
    {
        console.log(contents.error);
    };

}

function drawOutputUploadPicture(myindex, responseText)
{
    console.log('RESPONSE: ' + responseText);
    let feedbackElement = document.getElementById('feedback' + myindex);
    if (feedbackElement !== null)
    {
        feedbackElement.innerHTML = responseText;
    }
    uploadingpicture = false;
}

function drawErrorUploadPicture()
{
    uploadingpicture = false;
}

This script works. However, the upload is almost always interrupted halfway, so the result is a partial picture: sometimes you see half, sometimes a quarter, but almost never the whole picture. There are no errors. There is no upload limit.

What could be causing this?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I found out the cause of this.

The form calling this JavaScript used a Submit button with type="submit", so that the form being submitted interrupted the actual upload. I was able to solve this by changing the type into type="button".

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!