Skip to main content
Known Participant
August 8, 2018
Answered

UI Button file reference solution in Animate cc in html5 mode

  • August 8, 2018
  • 1 reply
  • 1250 views

Hey guys,

I would like to ask the community how to implement file reference for uploading file via ui-button component in Adobe Animate cc in canvas(HTML5) mode?

Here is scenario.

On the canvas at design time is placed ui-button with instance name browseImage_btn. 

I use these lines below to assign file type to this button with intention to browse the certain file that has to be uploaded.

$("#browseImage_btn").attr("type", "file");

$("#browseImage_btn").attr("id", "getFile");

But this code doesn't acts as i expected. There is no open file dialog box after button was clicked.

And secondly if there is solution via this type of button how to get file path of the chosen file?

Thanks

Ol

This topic has been closed for replies.
Correct answer kglad

use:

     if(!this.browseImage_btn_click_cbk) {

          function browseImage_btn_click(evt) {

               // Start your custom code

            select.click();

               // End your custom code

          }

     $("#dom_overlay_container").on("click", "#browseImage_btn", browseImage_btn_click.bind(this));

     this.browseImage_btn_click_cbk = true;

     }

var select=document.createElement('input');

select.setAttribute('type','file');

1 reply

kglad
Community Expert
Community Expert
August 8, 2018

that's jquery code for something with id=browseImage_btn.

use the code snippets panel to see how to encode your button component.

Known Participant
August 8, 2018

Hi kglad,

Maybe this is a step in right direction but still not the desired result.

The Code Snippets panel  under User Interface > Button Click Event generates just these lines:

     if(!this.browseImage_btn_click_cbk) {

          function browseImage_btn_click(evt) {

               // Start your custom code

               console.log("Button clicked");

               // End your custom code

          }

     $("#dom_overlay_container").on("click", "#browseImage_btn", browseImage_btn_click.bind(this));

     this.browseImage_btn_click_cbk = true;

     }

I need to upload a file using ui-button just like input button does but in canvas mode.

Thanks

ol

kglad
Community Expert
Community Expert
August 8, 2018

do you see the comments about where to insert your custom code?

that's where you should add your upload file code.