Input of type = "file" doesn't respond. Pop-up window for choosing a file doesn't appear

44 Views Asked by At

I am using Vue.js and Express for building an app where one of its core features is the option to upload images. For that purpose I have an input field with "type" attribute set to "file". It worked perfectly, until I tried to disable the "submit" button if the user hasn't uploaded any file. For that I tried to use ":disabled=condition" attribute in my HTML. It didn't work as expected and now, also without the ":disabled" attribute, my <input type="file">, doesn't respond at all. No pop-up window is opening for choosing a file to upload. I guess I broke something in my HTML code, and I cannot really track what it is.

   <form class="upload_form" method="post" enctype="multipart/form-data" action="/upload" @submit.prevent="handleImgSubmit">
                <div class="input_fields_div">
                    <input class="upload_input" name="title" type="text" placeholder="title" >
                    <input class="upload_input" name="description" type="text" placeholder="decription" >
                    <input class="upload_input" name="username" type="text" placeholder="user" >
                </div>
                <div class="buttons_div">
                    <div class="select_file_div">
                        <input id="choose_file" name="image" type="file" accept="image/*">
                        <label class="select_img_btn" for="choose_file">Select Image</label>
                    </div>
                    <button class="upload_button" type="submit">Upload</button>
                </div>
      </form>
0

There are 0 best solutions below