Remove button removes preview with defaultPreviewContent set

Web Tips Q & ACategory: Krajee PluginsRemove button removes preview with defaultPreviewContent set
mlnimouse asked 1 year ago

I have the following jquery code:

$("#avatar").fileinput({
    overwriteInitial: true, 
    maxFileSize: 1500, 
    showClose: false, 
    showCaption: false, 
    browseLabel: '', 
    removeLabel: '', 
    browseClass: "btn btn-info", 
    browseValue: "upload", 
    browseIcon: '<i class="glyphicon glyphicon-folder-open"></i>', 
    removeIcon: '<i class="glyphicon glyphicon-remove"></i>', 
    removeTitle: 'Cancel or reset changes', 
    uploadClass: "btn btn-primary", 
    uploadLabel: "", 
    showRemove: false, 
    elErrorContainer: '#kv-avatar-errors',
    msgErrorClass: 'alert alert-block alert-danger', 
    defaultPreviewContent: '<img src="<?php echo controller_url()."member/get_default_image"; ?>" alt="No Photo" style="width:160px">', 
    layoutTemplates: {
        main2: '{preview}{browse} {upload}'
    },  
    allowedFileExtensions: ["jpg", "png", "gif"], 
    initialPreview: [ "<img src='<?php echo controller_url()."member/get_image/".$member->ID; ?>' class='file-preview-image' title='photo'>"], initialPreviewConfig: [
        {
            width: '160px', 
            url: "<?php echo controller_url()."member/delete_image/".$member->ID; ?>", 
            key: 100, 
            extra: {} 
        }
    ]
});

When I click on the remove button, the image is successfully deleted, the fileupload plugin only shows the browse button and nothing else. What am I doing wrong? Also, how can I not show the remove-file button in the defaultPreviewContent? I only need the remove-file button when the avatar photo is not the default pic.  Thanks !

mlnimouse replied 1 year ago

ok sorry about the wrapped code, I did use the button but I didn’t have a preview 🙁

Kartik Staff replied 1 year ago

No problem I corrected the format for you.

1 Answers
Kartik Staff answered 1 year ago

You may have a look at the avatar upload demo on the plugin page again.
Why you are seeing a delete button on your initial preview thumb is because you are setting a delete url in your initial preview content. For your use case, you may want to remove this URL from your initial preview config. Handle the delete of image on the fileclear event.

Login or register to contribute or comment.

Login   Register