Skip to main content
P
Paul5C46
Participant
June 14, 2021
Answered

Animate 2019 HTML5 textinput component set value

  • June 14, 2021
  • 2 replies
  • 967 views

Hello,

 

I am trying to set the value of a textinput HTML5 component and I am using a document.getElementById('my_textinput') method (of course 'my_textinput' is the instance name).

I am getting null from that and I am suspecting that the component is not yet initialized when I am calling the above.

Is there any eventListener I can add to the symbol (like onload or oncreatecompletion etc) that can help with this?

 

Thank you

    This topic has been closed for replies.
    Correct answer joejoe_jack

    I found the "attached" event is what jQuery triggers in the component sdk (anwidget.js)

    this.my_textinput.on("attached", () => $("#my_textinput")[0].value = "your value");

     

    2 replies

    C
    ClayUUID
    Legend
    June 15, 2021

    "Is there any eventListener I can add to the symbol (like onload or oncreatecompletion etc) that can help with this?"

     

    Yes.

     

    this.my_textinput.addEventListener("added", initInput);

function initInput() {
     document.getElementById("myVideo").value = "banana";
}

     

    But if this is to set the initial value, why aren't you just entering that in the component parameters dialog?

    P
    Paul5C46Author
    Participant
    June 15, 2021

    Good question. The componenet has an initial value which might be altered by an API call before it enters the stage. It is a game setting (player username) which should display the value from the server if  the player has an account or remain 'Type your desired username'. The strange thing is that the response from the server comes before the initialization of the component so I couldn't update the text input value at that time but I had to wait for the component to be ready.

    I am facing a lot of such 'weird' mismatches, like setting a movieclip to a specific frame and then seeing it resetting at 0 with no reason (obviously when completing initialization).

    I think I miss something between flash/as3 and animate/js conversion regarding the frame loop and object updating. 

    Any advise for a good book covering advanced developer topics in Animate CC?

     

    J
    joejoe_jackCorrect answer
    Inspiring
    June 17, 2021

    I found the "attached" event is what jQuery triggers in the component sdk (anwidget.js)

    this.my_textinput.on("attached", () => $("#my_textinput")[0].value = "your value");

     

      kglad
      Community Expert
      kgladCommunity Expert
      Community Expert
      June 14, 2021

      use a loop (tick or setInterval, eg) to check for its initialization (and you can use jquery if you want because the library is added when you add a component).

       

       

      P
      Paul5C46Author
      Participant
      June 14, 2021

      Well, I was hoping for an event to tell you the truth, bt I will go with a hack like that you described.

      Thanks a lot for your prompt reply!

      kglad
      Community Expert
      kgladCommunity Expert
      Community Expert
      June 14, 2021

      you're welcome.

       

      p.s.  here's code i suggested to someone else:

       

      var video;
      function checkInitF() {
      if (video) {
      video.addEventListener("ended", function(){
      // video ended. do whatever
      });
      } else {
      video = $("#videoPlayer")[0];
      setTimeout(checkInitF, 100);
      }
      }
      checkInitF();

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices