I have a registration form where fields have a file field. He registers normally.
<div class="form-group">
<label for="foto">Foto do(a) Vereador(a):</label>
<input type="file" name="Foto" class="form-control" id="fileUpload" placeholder="Foto do Vereador(a)">
<img id="imagem" src="#" alt="Preview da sua imagem" style="width: 130px; margin-top: 10px; display: none" class="img-thumbnail" />
<label id="excluir" style="margin-left: 50px; color: #00F; display: none; cursor: pointer">Excluir</label>
</div>
JQuery
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$("#imagem").attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$("#fileUpload").change(function(){
readURL(this);
$("#imagem").css("display","block");
$("#excluir").css("display","block");
});
$("#excluir").click(function(){
$("#fileUpload").val("");
$("#imagem").css("display","none");
$("#excluir").css("display","none");
});
Alright, alright! The only problem is when I try to bring this field into the user edit. When it comes to bringing the database results to the edit I'm doing it this way:
<div class="form-group">
<label for="foto">Foto do(a) Vereador(a):</label>
<input type="file" name="Foto" class="form-control" id="fileUpload" value="<?php echo $visualizar->FotoUsuario; ?>">
<img id="imagem" src="<?php echo "../../fotos/".$visualizar->FotoUsuario; ?>" alt="Preview da sua imagem" style="width: 130px; margin-top: 10px;" class="img-thumbnail" /><br>
<label id="excluir" style="margin-left: 50px; color: #00F; cursor: pointer">Excluir</label>
</div>
The problem is when I click the Delete link:
It is not erasing the value of the file field. Jquery is the same thing I went through above.