i am using input type='file' with multiple file and one with single file. like,
from How to delete the specifuc value of an “input type=file” multiple
//single image
//IMAGE_TYPES is constant and defined with:define('IMAGE_TYPES',array('main',
'floor','bedroom1','bedroom2','bedroom3','kitchen','reception','garages','epc','other'));
@foreach(IMAGE_TYPES as $images)
@if($images!='other')
<div class="col-sm-10">
<input type="file" class="form-control" id="_image" name="_image"
accept="image/*" placeholder="<span> <i class='fa fa-plus-circle'></i>Click
here or drop files to upload</span>"/>
</div>
@else
//multiple
<div class="col-sm-10">
<input type="file" class="form-control" id="other_images"
name="other_images[]" accept="image/*" placeholder="<span> <i
class='fa fa-plus-circle'></i>Click here or drop files to upload</span>"
multiple />
</div>
@endif
@endforeach
now, i validating it with jquery like,var image_type ='<?=json_encode(IMAGE_TYPES);?>';
image_type = JSON.parse(image_type);
var max_image_size = 2;
$.each(image_type, function( index, value ) {
if (value!='other') {
$('#'+value+'_image').bind('change', function() {
var a=(this.files[0].size);
var ValidImageTypes = ["image/jpeg", "image/png"];
if ($.inArray(this.files[0].type, ValidImageTypes) < 0) {
show_notification('error','Only .jpg/.jpeg and .png file allowed.
Please select other image.');
var file = document.getElementById(value+'_image');
file.value = file.defaultValue;
return false;
}
else{
if (Math.round(a / (1024 * 1024)) > max_image_size) {
show_notification('error','Image is Greater than '+max_image_size+'MB.
Please select smaller image.');
var file = document.getElementById(value+'_image');
file.value = file.defaultValue;
return false;
}
else
{
preview_main_image(value);//won't matter
}
}
});
}
else{
$('#other_images').bind('change', function() {
$('div.add_preview').remove();//won't matter
for (var i = 0; i < $("#other_images").get(0).files.length; i++) {
var a=(this.files[i].size);
var name = this.files[i].name;
var ValidImageTypes = ["image/jpeg", "image/png"];
if ($.inArray(this.files[i].type, ValidImageTypes) < 0) {
show_notification('error','Image '+name+' is Not allowed. Only .jpg/.jpeg and
.png file allowed. Please select other image.');
}
else{
if (Math.round(a / (1024 * 1024)) > max_image_size) {
show_notification('error','Image '+name+' is Greater than '+max_image_size+'MB.
Please select smaller image.');
}
else
{
$('#other_image_preview').append("<div class='col-md-2 p_3 add_preview'><img
class='img-responsive' src='"+URL.createObjectURL(event.target.files[i])+"'></div>");
//won't matter
//preview_detail_images(value);
}
}
}
});
}
});
now, my question is when i am using single image if image is not fitting in validation then i delete it's value from input type='file' using, this codevar file = document.getElementById(value+'_image');
file.value = file.defaultValue;
return false;
but when i select multiple image and if any image is not fitting in validation then how can i remove that particular image from input type='file'. please help mefrom How to delete the specifuc value of an “input type=file” multiple
No comments:
Post a Comment