Re: [FlexJS] question about porting an Adobe Flex 3 project to HTML+JS

[Justin Mclean]

Hi,

I’d guess you have an js:Application tag elsewhere in your application and this 
is just a component right?

To use as a component try this instead (again untested):

<?xml version="1.0" encoding="utf-8"?>
<js:View xmlns:fx="http://ns.adobe.com/mxml/2009";
               xmlns:js="library://ns.apache.org/flexjs/basic">
  <fx:Script>
     <![CDATA[

     [Bindable]
     public var target:ISearchable;

     ]]>
  </fx:Script>

  <js:beads>
     <js:SimpleBinding />
  </js:beads>

  <js:HContainer>
     <js:Label text="Search:" />
     <js:TextInput id="searchInput" change="{target.find(searchInput.text)}" 
width="207">
        <js:beads>
           <js:ToolTip text="Live search" />
           <js:SimpleCSSStyles backgroundColor="{!target.searchString || 
target.found ? 0xffffff:0xff0000}" />
           <js:BindableCSSStyles />
        </js:beads>
     </js:TextInput>
     <js:TextButton id="previousButton"  text="&lt;" 
click="{target.findPrevious()}">
        <js:beads>
           <js:ToolTip text="Previous" />
           <js:DisableBead disabled="{target.searchString == null}" />
           <js:SimpleBinding />
        </js:beads>
     </js:TextButton>
     <js:TextButton id="nextButton" text="&gt;" click="{target.findNext()}">
        <js:beads>
           <js:ToolTip text="Next" />
           <js:DisableBead disabled="{target.searchString == null}" />
           <js:SimpleBinding />
        </js:beads>
     </js:TextButton>
  </js:HContainer>

</js:View>

You could test it with this snippet replacing SearchClass() with your class, 
you may need an import as well.

<?xml version="1.0" encoding="utf-8"?>
<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
               xmlns:js="library://ns.apache.org/flexjs/basic"
               xmlns:comp="*">

   <js:valuesImpl>
       <js:SimpleCSSValuesImpl/>
   </js:valuesImpl>

   <js:initialView>
       <comp:Search target="{new SearchClass()}” />
   </js:initialView>

</js:Application>

Thanks,
Justin