Re: Recommendations for Ajax ID's

From: Ricardo J. Parada (rparad..ac.com)
Date: Fri Apr 24 2009 - 15:53:44 EDT

  • Next message: Mike Schrag: "Re: Recommendations for Ajax ID's"

    Hi Ken,

    Yes I wrap pop-ups in AjaxObserveField components all the time.

    I was trying to put a simple example to demonstrate this and also to
    test Mike's suggestion about using updateContainerID = "_parent" but I
    noticed that something is not working as expected.

    Just like the Ajax Example, I have three pop-ups: State, City and
    Street.

    When I select the State the cities pop-up is populated.... so far so
    good... But now, when I select a City from the cities pop-up, I was
    expecting only the setSelectedCity() method to get called, but the
    setSelectedState() is also being called and with null.

    It seems to me that the states pop-up is doing a takeValuesFromRequest
    when he wasn't included in the form values... Is this a bug??
    I tried using the fullSubmit = false binding but it still behaves
    wrong. I also tried wrapping each pop-up in its own
    AjaxObserveField. Same result.

    Here is the html:

         <wo:form>
                 <wo:AjaxUpdateContainer>
                         <wo name="PopUpObserver">
                                 State: <wo name="StatesPopUp"/>
                         </wo name="PopUpObserver">
                         <wo name="PopUpObserver">
                                 City: <wo name="CitiesPopUp"/>
                         </wo name="PopUpObserver">
                         <wo name="PopUpObserver">
                                 Street: <wo name="StreetsPopUp"/>
                         </wo name="PopUpObserver">
                 </wo:AjaxUpdateContainer>
         </wo:form>

    the .wod:

    PopUpObserver : AjaxObserveField {
            updateContainerID = "_parent";
            fullSubmit = false;
    }
    StatesPopUp : WOPopUpButton {
            list = states;
            selection = selectedState;
            noSelectionString = " ";
    }
    CitiesPopUp : WOPopUpButton {
            list = cities;
            selection = selectedCity;
            noSelectionString = " ";
    }
    StreetsPopUp : WOPopUpButton {
            list = streets;
            selection = selectedStreet;
            noSelectionString = " ";
    }

    and the .java code:

    import org.apache.log4j.Logger;

    import com.webobjects.appserver.WOContext;
    import com.webobjects.foundation.NSArray;
    import com.webobjects.foundation.NSMutableArray;

    import er.extensions.components.ERXComponent;

    public class Main extends ERXComponent {
            
            public static final Logger log = Logger.getLogger(Main.class);

            public Main(WOContext context) {
                    super(context);
            }
            
            public NSArray<String> states = new NSArray<String>(new String[]
    {"State 1", "State 2"} );
            public NSArray<String> cities;
            public NSArray<String> streets;
            
            public String selectedState;
            public String selectedCity;
            public String selectedStreet;
            
            public void setSelectedState(String aState) {
                    log.info("setSelectedState(" + aState + ")");
                    
                    NSMutableArray<String> theCities = new NSMutableArray<String>();
                    for (int i = 1; i <= 10; i++) {
                            theCities.add(aState + " - City " + i);
                    }
                    selectedState = aState;
                    cities = theCities;
            }
            
            public void setSelectedCity(String aCity) {
                    log.info("setSelectedCity( " + aCity + " )");
                    
                    NSMutableArray<String> theStreets = new NSMutableArray<String>();
                    for (int i = 1; i <= 5; i++) {
                            theStreets.add(aCity + " - Street " + i);
                    }
                    selectedCity = aCity;
                    streets = theStreets;
            }
            
            public void setSelectedStreet(String aStreet) {
                    log.info("setSelectedStreet( " + aStreet + " )");
                    
                    selectedStreet = aStreet;
            }

            public void awake() {
                    super.awake();
                    
                    log.info("Context.request.formValues = " +
    context().request().formValues());
            }
    }

    On Apr 24, 2009, at 1:19 PM, Ken Anderson wrote:

    > Ricardo,
    >
    > In the Dependent List example, the popups were not wrapped in the
    > observe field components, they were next to each other with the ID
    > linking them.
    >
    > I tried the below, and nothing is updating... are you sure you can
    > just wrap the pop-ups in the observe field component?
    >
    > Thanks,
    > Ken
    >
    >
    > On Apr 23, 2009, at 6:07 PM, Ricardo J. Parada wrote:
    >
    >> I'm thinking something like this maybe:
    >>
    >> <wo:AjaxUpdateContainer id="$updateContainerID">
    >>
    >> <wo:AjaxObserveField updateContainerID="_parent">
    >> <wo name="PopUp1"/>
    >> </wo:AjaxObserveField/>
    >> <wo:AjaxObserveField updateContainerID="_parent">
    >> <wo name="PopUp2"/>
    >> </wo:AjaxObserveField/>
    >> <wo:AjaxObserveField updateContainerID="_parent">
    >> <wo name="PopUp3"/>
    >> </wo:AjaxObserveField/>
    >>
    >> </wo:AjaxUpdateContainer>
    >>
    >> I have not used _parent but if I understood correctly that is how
    >> one could use it.
    >>
    >> I don't know if the id binding for AjaxUpdateContainer is required
    >> or not though.
    >>
    >> But in case you need it it could be something like this:
    >>
    >> public String updateContainerID() {
    >> return "UpdateContainer" +
    >> ERXStringUtilities.safeIdentifierName(context().elementID());
    >> }
    >>
    >>
    >> On Apr 23, 2009, at 3:35 PM, Ken Anderson wrote:
    >>
    >>> Thanks for the responses everyone, but I'm still not completely
    >>> clear.
    >>>
    >>> I can't use repetition index because the component is embedded
    >>> many levels deep below the rep (not to mention there's more than 1
    >>> repetition).
    >>>
    >>> There are 2 different types of hard coded strings in the Dependent
    >>> Lists example... the IDs of the pop-ups, and the IDs of the update
    >>> containers that wraps the sections to be updated.
    >>>
    >>> We have 3 pop ups, same as the dependent list example, so I'm
    >>> creating 2 AjaxObserveFields - one to encapsulate the 2nd & 3rd,
    >>> and another to encapsulate the 3rd.
    >>>
    >>> So, I was trying to create 5 unique strings - 1 for each pop-up,
    >>> and 2 for the update containers.
    >>>
    >>>
    >>>
    >>> One way I can do this is call context().elementID(), which will
    >>> create a new unique element ID, and then store it in my
    >>> component. Then, all the unique strings use it:
    >>>
    >>> private String myID;
    >>> myID = context().elementID();
    >>>
    >>>
    >>> public String marketField() {
    >>> return myID+"-Market";
    >>> }
    >>>
    >>>
    >>> Not nearly as cool as what some of the other ideas suggest, but at
    >>> least I could make this one work :)
    >>>
    >>> Ken
    >>>
    >>>
    >>>
    >>>
    >>> On Apr 23, 2009, at 2:14 PM, Mike Schrag wrote:
    >>>
    >>>>>> The 3 pop-ups I tied together with Ajax are in a single
    >>>>>> component that can be on a page multiple times, so I need to
    >>>>>> come up with unique ID's for the pop-ups and update
    >>>>>> containers. What do people use? I was thinking about using
    >>>>>> the element ID, but can't seem to find out how to get it...
    >>>>>>
    >>>>>> Thanks,
    >>>>>> Ken
    >>>>> For the pop-ups I wrap them in AjaxObserveField. No need to
    >>>>> give your pop-ups unique IDs. But you'll need unique IDs for
    >>>>> the update containers. :-)
    >>>> In many cases you don't anymore -- if you're updating the
    >>>> container above you you can just use updateContainerID= "_parent"
    >>>> on the links ... Most cases have obvious id's, but if you need
    >>>> per-EO id's, i use wonder helper functions (id="$person|id") and
    >>>> we have an ERXGenericRecordHelper that spits them out (this is
    >>>> the usual case for the multiple-on-a-page). You probably don't
    >>>> want to use element ID, though, as this can change across
    >>>> requests and you probably want to be able to trigger the update
    >>>> from other parts of the page.
    >>>>
    >>>> ms
    >>>>
    >>>
    >>
    >



    This archive was generated by hypermail 2.0.0 : Fri Apr 24 2009 - 15:55:42 EDT