Use jquery component inside a formData (fileupload)

Asked

Viewed 78 times

0

Friends, I am using the jquery fileupload plugin and using the following callback:

jQuery("#fileupload").fileupload({
    url: '/painel/uploads',
    dataType: 'json',
    formData: {_token: jQuery("#fileupload").data('token'), idpasta: jQuery("#list-id-client").html()},
    done: function (e, data) {

    },
    progressall: function (e, data) {
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $('#progress .progress-bar').css(
            'width',
            progress + '%'
        );
    }
});

I am printing this request with the PHP dd() command and I realized that when I print "idfolder" I have the following scenario: sometimes the ID comes correctly and sometimes nothing comes, just an empty string.

I believe it is an asynchronous request and I am taking data from another component of jQuery and this is giving me problems.

If I print per console.log(jQuery("#list-id-client").html()) always returns something, unlike ajax request.

Is there anything that can be done? I need to get this customer ID by jQuery...

Thank you

javascript jquery ajax

  • Add the parameter: 'async:false' in the request, and see if the problem remains.

  • If I put async:false, the plugin crashes. = ( Have some other idea?

  • The "#list-id-client" element is an input ?

  • It’s actually a span that contains the number I need. This span is filled with the number I need before calling this method I’m using. If I add a beforeSend: {console.log("#list-id-client")} I can clearly see that what I need is there, but I’m not able to manipulate beforeSend so I can ensure that this data goes to the route I want.

  • Got it, do you submit this form as ? have some jQuery event on some button or did you have it directly identified on Submit ? I think the mistake is the timing really

  • 1

    Actually the error was synchronized. I looked at the documentation of the plugin itself, there is a method called . bind that solved the problem. Thanks for your help, buddy!

  • Nice, answer your own question with the solution, can help more people!

Show 2 more comments

1 answer

1

I found the answer, it was a mistake in timing.

The plugin itself provides a bind method. I looked at the documentation and managed to implement the following, which solved the problem:

jQuery("#fileupload")
    .bind('fileuploadsubmit', function(e, data) {
        var idPasta = $("#idPasta").val();
        data.formData = {_token: jQuery("#fileupload").data('token'), idpasta: idPasta};
    })

    .fileupload({
    url: '/painel/uploads',
    dataType: 'json',

    done: function (e, data) {

    },
    progressall: function (e, data) {
        var progress = parseInt(data.loaded / data.total * 100, 10);
        $('#progress .progress-bar').css(
            'width',
            progress + '%'
        );
    }
});

Grateful!

Browser other questions tagged javascript jquery ajax

You are not signed in. Login or sign up in order to post.