Can I change data-default-file with jQuery ?

[mecjos]

I want to edit table element which includes image file. To do this, first I get existing file name with;

existingImage = $("#imgElement").attr("src");

then I try to change input element data-default-file attribute with;

$("#inputImageElement").attr("data-default-file", existingImage);

In that way, I can see data-default-file when I inspect element but I can't see on screen.

[roberto-slopez]

I use

dropify.dropify({
           "defaultFile": "full path file",
            "messages": {
                    default: 'Arrastre un archivo o haga clic aquí',
                    replace: 'Arrastre un archivo o haga clic en reemplazar',
                    remove: 'Eliminar',
                    error: 'Lo sentimos, el archivo demasiado grande'
                }
            });

[roberto-slopez]

@JackZeled0n Sorry, I updated my comment

[JackZeled0n]

My team & me use angular, our solution were `

$(document).ready(function(){
    var nameImage =  'full path file';
    $('.dropify').dropify({
        defaultFile: nameImage ,
    });
});

`

[hanhduykaka]

How can I binding image by Base64?

[JackZeled0n]

@hanhduykaka Are you using any specific function for making the Base 64? I think something, you can get the image wherever you have it and you can decode for putting on defaultFile=your-image-decode.format(jpg,png) the property by Dropify.

[hanhduykaka]

@JackZeled0n : You mean I must using decode base64 before using defaultFile and using when I want to binding code from the database?

[JackZeled0n]

@hanhduykaka Yes, you could use it for making the encode and decode the url of the image that you want put on the property. I don't understand so good that you want to say with

I want to binding code from the database

[hanhduykaka]

@JackZeled0n : I have a form and using Dropify for upload Avatar. So when I get an API from backend and the data for Image is base64. I'm trying decode URL to blob but still not working!

[mecjos]

@JackZeled0n I tried your solution. It didn't work. My dropify is in a edit modal form.

[JackZeled0n]

@mecjos can you show how you do?

[mecjos]

@JackZeled0n I do it as follow.

$(document).ready(function() {
    $(document).on('click', '.editButton', function() {

        $.ajax({
            type: 'GET',
            url: 'projects/' + editProjectId + '/edit',
            dataType: 'json',
            error: function (data) {
                console.error('Error:', data);
            },
            success: function (response) {
                var nameImage = response.imagName
                  $('.dropify').dropify({
                       defaultFile: nameImage ,
                  });
            }
        });
}

[JackZeled0n]

What brings the response? Make a console log and show us the mistake

console.log(response.imagName);

You have to be sure you get the good response from the request.

[ghost]

@mecjos Any Success buddy. I am Stuck at same issue , Please tell me how did you solve this problem :)

[hanhduykaka]

@akshaysalekar108 : defaultFile: blobFunction() ,

You can create a function: blobFunction() and return decode URL to blob from your base64

like this

[developerabdan]

@hanhduykaka i'm trying this right now, but didn't solve my issue

[SkinnyCoders]

@hanhduykaka thanks dude, it's work fine

[hanhduykaka]

you're welcome