Change data-url via jquery

Question

I am trying to use jquery to change the data-url attribute used by a file upload. But it doesn't seems to be working. The file upload takes the old value.

$('#fileupload').attr('data-url', "https://api.mysite.com/optimizeonly");

HTML

<input id="fileupload" class="fileupload" type="file" name="file[]" data-url="https://api.mysite.com/upload" multiple="">`

Snippet:

$('#fileupload').attr('data-url', "https://api.mysite.com/optimizeonly");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="fileupload" class="fileupload" type="file" name="file[]" data-url="https://api.mysite.com/upload" multiple="">

Edit : 1

I am using jquery file upload module , i though this was evident from the tags. The whole code is available from the live demo (just inspect element)

Answer 1

The data-url attribute of the input is read by the plugin when initializing. It is not automatically read afterwards. Have you tried updating the URL as follows?

var fu = $('#fileupload');
fu.fileupload('option', 'url', fu.data('url'));

Of course, this would be done after updating the data-url attribute of the element using

fu.data('url', 'new-url-you-want-here');

and you could, I think, skip updating the attribute altogether and only change the option of the plugin.

fu.fileupload('option', 'url', 'new-url-you-want-here');