I have a submit function that user can choose to update their picture or not. If user decided not to update their picture the current retrieved value will be send to the approve function. I have no problem when user wants to update, but I have problem with when user don't want to update the picture. I can't get the current value of the received value in my submit function.
This is what I have tried. How do I pass the src value into the variable pictureData if user choose not to update their picture?
$(document).ready(function() {
var isImageChosen = false;
$(".choose").click(function() {
$("#picture").click();
isImageChosen = true;
});
getPhoto();
$("#approve").click(function() {
var pictureData = $('#picture')[0].files[0];
if (!isImageChosen) {
pictureData = $("#picture_photoViewer").attr('src');
alert(pictureData);
}
let formData = new FormData();
formData.append('picture', pictureData);
for (var pair of formData.entries()) {
console.log(pair[0] + ', ' + pair[1]);
}
});
});
const getPhoto = () => {
let photo = 'http://hd.wallpaperswide.com/thumbs/beast_2-t2.jpg';
$("#logo").append(`<img id="picture_photoViewer" src="${photo}" width="100" height="100">`);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
<div class="text-center">
<div class="form-group" id="logo"></div>
<button type="button" class="btn btn-primary ml-4 choose">Choose</button>
<input type="file" id="picture" oninput="picture_photoViewer.src=window.URL.createObjectURL(this.files[0])" hidden>
</div>
</div>
<br>
<button type="button" id="approve" class="btn btn-success">Submit</button>
You can set the status if the user has pressed the choose button or not by introducing a new variable.
Here is my solution:-
$(document).ready(function() {
var isImageChosen = false;
$(".choose").click(function() {
$("#picture").click();
isImageChosen = true;
});
getPhoto();
$("#approve").click(function() {
var pictureData = $('#picture')[0].files[0];
if (!isImageChosen){
pictureData = $("#picture_photoViewer").attr('src');
alert(pictureData);
}
let formData = new FormData();
formData.append('picture', pictureData);
for (var pair of formData.entries()) {
console.log(pair[0] + ', ' + pair[1]);
}
});
});