Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    Can we specify and find a component by Name

    SmartClient-Version: 7.0rc4
    Browser : Firefox 3.6.8

    We are thinking of using reusable component methodology for developing our application.
    Rationale: Some of the small screens are present in multiple places.

    Here is what we do :
    While developing component we specify a new class "MainPanel" extending the original VLayout class.
    Now in this class we initialize various components by adding properties method(without using any IDs for any underlying member component).
    example:
    Code:
    isc.defineClass("MainPanel", "VLayout");
    
    isc.MainPanel.addProperties({
    	height: "100%",
    	width: "85%",
            name: "layoutMain",
            members: [
    	     isc.LayoutSpacer.create({height:"5%"}) ,
    	     isc.HLayout.create({
    		width: "60%",
    		height: "5%",
    		align: "center",
                    name: "memberlayoutOne",
                    members: [
    				isc.FirstForm.create({
    						width: "50%",
    						height: "10%",
                                                    name: "formOne"        
    				    }),
    				isc.LayoutSpacer.create({width:"5"}) ,
    				isc.SecondForm.create({
    						width: "45%",
    						height: "10%",
                                                    name: "formTwo"        
        				    })
    			      ]
                    }),
    	isc.LayoutSpacer.create({height:"5%"})
    	]
    });
    
    isc.MainPanel.create({
                    ID: "mainPanelInstance"
    });
    Initializing a new component: create instance of the top component as above (The IDs for underlying or member component are generated automatically(by SmartClient))


    Problem:
    Is there a way to find a member component by name of the member instead of IDs (As we do have to write a method in main component to ) so that we can access member by name instead of ID.
    For example in above example:

    mainPanelInstance.findElementByName("formOne");
    mainPanelInstance.findElementByName("formTwo");
    Last edited by Isomorphic; 1 Nov 2010, 16:40.

    #2
    The "autoChild" subsystem is designed for exactly this kind of thing.

    Its documented here: http://www.smartclient.com/docs/7.0r.....autoChildren

    Take a look, and let us know if you have questions or can't make it work for your use case!

    Comment


      #3
      Thanks Alot!!!! This is very helpful and exactly what we need!


      CODE:
      Code:
      isc.defineClass("Portlet", "VLayout").addProperties({
           headerDefaults : {
               _constructor:isc.Label,
               ...
           },
           focusButtonDefaults : {
               autoParent:"header",
               _constructor:isc.ImgButton,
               click : function () { this.creator.bringToFront() },
               ...
           },
           initWidget : function () {
               this.Super("initWidget", arguments);
      
               this.addAutoChild("header");
               this.addAutoChild("focusButton");
               ...
      In the above code what is a "creator". The current Parent or the Parent in the hierarchy?
      Portlet->header->focusButton


      I expect this is the main Component! Correct me if I am wrong!

      In case this is wrong, how can we reach the top parent from the leaf components in the Hierarchy?

      Comment


        #4
        When an autoChild is created the child's "creator" property points back to whatever canvas created it.
        So if you call 'someCanvas.addAutoChild('foo')'
        The generated canvas (someCanvas.foo) will have a "creator" property which refers back to "someCanvas".

        In your case this means both the header and the focus button's "creator" property points back to the Portlet instance that created them.

        Make sense?

        Comment


          #5
          Definitely makes sense...and Smartclient, Hats off to you guys for such a classic feature!!!!
          Thanks alot!!

          Comment

          Working...
          X