how to rectify the errors of div behaving like a file browser

Question

my problem:i have a code that im using to make a div behave like a file browser but it keeps on giving a error Uncaught ReferenceError: handleFileSelect is not defined when inspected in google chromes console how to rectify it

my code:

<input class="image_select" id="image_select" type="file" name="image" style="display:none">

<script>
    document.getElementById('image_select').addEventListener('change', handleFileSelect, false);
</script>

<div class="faker_select_button-singular" 
     onclick="document.getElementById('image_select').click();">
        Select My Image
</div>

NOTE:not that the error is any problem i just dont like having errors in the website

Answer 1

It tells you upfront exactly what the error is. You did not define the handleFileSelect callback function.

Define the function for God's sake.

That's how you define a function:

function handleFileSelect()
{
    //code
}

Just put this snippet before you add the listener and it'll throw no error.