Jquery ile File İnputtan Veri Azaltmak.
Yapmaya çalıştığım tam olarak şu.
Aynı sayfa içerisinde PHP ile POST ediyorum. (Bu esnada Ajax kullanmıyorum)
silBtn ile ön izlemesini sildiğim resmin POST ettiğim de $_FILES değişkenine gelmemesini istiyorum.
html kodum
'''
<form method="POST" enctype="multipart/form-data">
<input type="file" id="file" class="file" name="resimler[]" accept="image/*" multiple>
<button type="submit" name="gonder">Gönder</button>
</form>
<div class="resimler"></div>
'''
jquery kodum
"""
$('.file').on('change', function(){
const files = this.files;
const resimlerKutu = $('.resimler');
for ( var i=0; i<files.length; i++){
let file = files[i];
let name = file['name'];
let size = file['size'];
type = file['type'];
onaylananVeriler = [];
let oku = new FileReader();
oku.readAsDataURL(file);
oku.onload = (function(file) {
return function(e) {
let kutu = $('<div class="resim"></div>');
let resim = $('<img>');
let silBtn = $('<button type="button" class="sil btn" data-id="'+i+'">Sil</button>')
resim.attr('src', e.target.result);
kutu.append(resim);
kutu.append(silBtn);
resimlerKutu.append(kutu);
silBtn.on('click', function() {
kutu.remove();
});
};
})(file);
}
});
});
"""
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (1)
Burada en önemli nokta inputun taşıdığı value attribute'sidir. Postlarken php kısmında name => value şeklinde gönderilir.
Silme işleminden sonra .file inputunun value'sinden aktif olan elemanı silmen gerekli
silBtn.on('click', function() {
files.splice(i,1);//silBtn click olduğunda value'nin içerisinde i nin ci index'i diziden siliyoruz
$('.file').val(files)//files'ın içinden eleman silindi ve güncel haliyle değerini güncelledik
kutu.remove();
});