1 Reply Latest reply on Jun 19, 2014 7:46 AM by dharmk

    Edge Animate HTML input textbox click

    Vishal Kohli

      Hi,

       

      I want to click a HTML input text box that i added in the symbol at the end of the timeline of edge composition so that the keyboard of the mobile shows up to input data into text field,

      How can i do that at the end of timeline, the keyboard pops up to enter the data into input field.

       

      After installing app using phonegap on mobile, i am able to click and keyboard shows up but not when i try to invoke it through click event at timeline complete event.

       

      Code to add HTML into symbol 'symbol1' for text box 'CodeDisplay' :

       

      Symbol.bindSymbolAction(compId, symbolName, "creationComplete", function(sym, e) {

         var input = $('<input/>').attr({'type':'tel','value':'','id':'Stage_CodeDisplay_Input','maxlength':'8 '});

         input_CodeDisplay .css('font-size',80);

         input_CodeDisplay .css('font-family',"Arial");

         input_CodeDisplay .css('width',750);

         input_CodeDisplay .css('border','none');

         input_CodeDisplay .css('input-border','none');

         input_CodeDisplay .css('outline','0');

         sym.$('CodeDisplay').html(input);

      });

       

      Code to invoke click event at the end of timeline

       

      Symbol.bindTimelineAction(compId, symbolName, "Default Timeline", "complete", function(sym, e) {

         // insert code to be run at timeline end here

         sym.getSymbol('symbol1').$('CodeDisplay').$('#Stage_CodeDisplay_Input').click();

      });

       

       

      Please help.

        • 1. Re: Edge Animate HTML input textbox click
          dharmk Adobe Employee

          HI Vishal,

           

          Animate runtime doesn't know that the id of the instance CodeDisplay has been changed later. Thus you should still be able to use:

           

          sym.getSymbol('symbol1').$('CodeDisplay').click();


          Or else, you can simply use the following:


          $('#Stage_CodeDisplay_Input').click()


          Anytime you face issues like this, check the returned value from the selector, eg: console.log(sym.getSymbol('symbol1').$('CodeDisplay')). It will tell you if you have the reference to the correct object that you are expecting.


          hope this helps, I haven't really tried out the code myself.


          Regards,

          Dharmendra

          1 person found this helpful