How do I use JQuery to detect if a file input is isset like php

Question

in php if i use Example

if (!empty(the input file)){
//is isset 
}

how can i do this in JQuery

html :

<div id="trash1">
Clear image
<i class="fas fa-trash"></i>
</div>
<div id="image-preview">
<input type="file" name="image-upload" id="image-upload">
</div>

JQuery

$(document).ready(function() {
$("#trash1").click(function() {

$("#image-upload").val("");

$( "#trash1" ).hide();
$("#image-preview").click(function() {
var file = $("#image-upload").val();
if(file) {
$( "#trash1" ).show();
}else {
$( "#trash1" ).hide();
}
});
});
});

I have prepared an example of action here https://codepen.io/danny2018/pen/RYajPB When I am loading the file

The div named trash1 need to show if input file is load But it only works the second time Someone might know why this is happening

Please start by indenting your code properly, so that we can easily see what is on which “nesting level” here. — CBroe, Aug 27 '18 at 11:04

Xigo · Answer 1 · 2018-08-27T11:50:26.693

0

 var File = document.getElementById("image-upload").files.length;
 if(File > 0){ do stuff.. }

edited Aug 27 '18 at 11:50

answered Aug 27 '18 at 11:33

Xigo

29
9

While this code snippet may be the solution, including an explanation really helps to improve the quality of your post. Remember that you are answering the question for readers in the future, and those people might not know the reasons for your code suggestion. – Narendra Jadhav Aug 27 '18 at 13:41

How do I use JQuery to detect if a file input is isset like php

1 Answers1