Loading ...
Sorry, an error occurred while loading the content.

Re: A Bug:AutoComplete And Modal's Panel

Expand Messages
  • takitzis
    I believe the problem is the same as mine. We have an AutoComplete. We also have a panel with modal=true. The autocomplete works fine until I show the panel
    Message 1 of 7 , Jan 2, 2007
    • 0 Attachment
      I believe the problem is the same as mine.

      We have an AutoComplete.
      We also have a panel with modal=true.
      The autocomplete works fine until I show the panel and then hide it.
      After the hide action, the autocomplete is stops working.

      If the same panel has the option modal=false, If I show and then hide
      the panel the autocomplete works fine, after the hide action.

      So, the major problem is after the show/hide action of a panel with
      modal=true.

      This is a problem only in IE (6 & 7) and not on Firefox and Opera
      where the autocomplete works fine, no matter the modal state of the
      panel. I've tryed all the possible combinations of queryDelay,
      useIFrame, useShadow, minQueryLength, maxCacheEntries and on all
      combinations the IE keeps to deny to show the autocomplete, after the
      hide action of a modal panel.

      It seems that the Autocomplete is not fired up, after the hide action
      of the modal panel, because on IE, it never enters at the
      formatResult function.

      Any possible solution ?

      --- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@...>
      wrote:
      >
      > Hi there,
      >
      > By definition, your modal Panel instance should not allow
      interaction
      > with any other page elements, including AutoComplete. The behavior
      you
      > are seeing is to be expected.
      >
      > Regards,
      > Jenny
      >
      >
      >
      >
      >
      > --- In ydn-javascript@yahoogroups.com, "langzi.tech" <langzi.tech@>
      > wrote:
      > >
      > > if you have a autocomplete and a panel.
      > > the modal of panel is true.
      > >
      > > if you show panel,then the autocomplete will can't show dropdown
      box.
      > >
      > > i test this issue in the yui's examples.
      > >
      > > if show panel1(modal=false),the autocomplete work fine.
      > >
      > > if show panel2(modal=true),the autocomplet work not fine.
      > >
      > > code:
    • langzi.tech
      Hi,jenny: My modal Panel instance don t interaction to any other elements. I just put 2 panels and 1 Autocomplete into a page,and their work is indie. If the
      Message 2 of 7 , Jan 4, 2007
      • 0 Attachment
        Hi,jenny:

        My modal Panel instance don't interaction to any other elements.
        I just put 2 panels and 1 Autocomplete into a page,and their
        work is indie.
        If the Panel's modal is true,Autocomplete will don't work fine
        after the panel show once.


        --- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@...>
        wrote:
        >
        > Hi there,
        >
        > By definition, your modal Panel instance should not allow
        interaction
        > with any other page elements, including AutoComplete. The behavior
        you
        > are seeing is to be expected.
        >
        > Regards,
        > Jenny
        >
        >
        >
        >
        >
        > --- In ydn-javascript@yahoogroups.com, "langzi.tech" <langzi.tech@>
        > wrote:
        > >
        > > if you have a autocomplete and a panel.
        > > the modal of panel is true.
        > >
        > > if you show panel,then the autocomplete will can't show dropdown
        box.
        > >
        > > i test this issue in the yui's examples.
        > >
        > > if show panel1(modal=false),the autocomplete work fine.
        > >
        > > if show panel2(modal=true),the autocomplet work not fine.
        > >
        > > code:
        > >
        > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
        > > 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
        > >
        > > <html>
        > >
        > > <head>
        > >
        > > <title>Example: AutoComplete - JavaScript Array (YUI Library)
        </title>
        > >
        > > <link type="text/css" rel="stylesheet"
        > > href="../../build/reset/reset.css">
        > >
        > > <link type="text/css" rel="stylesheet"
        > > href="../../build/fonts/fonts.css">
        > >
        > > <link type="text/css" rel="stylesheet"
        > > href="../../build/logger/assets/logger.css">
        > >
        > > <link type="text/css" rel="stylesheet" href="./css/examples.css">
        > >
        > > <link type="text/css" rel="stylesheet"
        > > href="../../docs/assets/dpSyntaxHighlighter.css">
        > >
        > >
        > >
        > > <style type="text/css">
        > >
        > > #statesmod {position:relative;}
        > >
        > > #statesautocomplete, #statesautocomplete2
        > > {position:relative;width:15em;margin-bottom:1em;}/* set width of
        > > widget here*/
        > >
        > > #statesautocomplete {z-index:9000} /* for IE z-index of
        absolute
        > > divs inside relative divs issue */
        > >
        > > #statesinput, #statesinput2
        > > {_position:absolute;width:100%;height:1.4em;z-index:0;} /* abs
        for
        > > ie quirks */
        > >
        > > #statescontainer, #statescontainer2
        > > {position:absolute;top:1.7em;width:100%}
        > >
        > > #statescontainer .yui-ac-content, #statescontainer2 .yui-ac-
        > > content {position:absolute;width:100%;border:1px solid
        > > #404040;background:#fff;overflow:hidden;z-index:9050;}
        > >
        > > #statescontainer .yui-ac-shadow, #statescontainer2 .yui-ac-
        > > shadow
        > > {position:absolute;margin:.3em;width:100%;background:#a0a0a0;z-
        > > index:9049;}
        > >
        > > #statescontainer ul, #statescontainer2 ul {padding:5px
        > > 0;width:100%;}
        > >
        > > #statescontainer li, #statescontainer2 li {padding:0
        > > 5px;cursor:default;white-space:nowrap;}
        > >
        > > #statescontainer li.yui-ac-highlight, #statescontainer2
        li.yui-
        > > ac-highlight {background:#ff0;}
        > >
        > > #statescontainer li.yui-ac-prehighlight,#statescontainer2
        li.yui-
        > > ac-prehighlight {background:#FFFFCC;}
        > >
        > > </style>
        > >
        > > </head>
        > >
        > >
        > >
        > > <body>
        > >
        > > <div id="hd">
        > >
        > > <h1><img src="./img/logo.gif" class="logo" alt="Y!"/><a
        > > href="./">AutoComplete Widget</a> :: JavaScript Array</h1>
        > >
        > > </div>
        > >
        > >
        > >
        > > <div id="bd">
        > >
        > > <!-- Logger begins -->
        > >
        > > <div id="logger"></div>
        > >
        > > <!-- Logger ends -->
        > >
        > >
        > >
        > > <!-- AutoComplete begins -->
        > >
        > > <div id="statesmod">
        > >
        > > <form onsubmit="return
        YAHOO.example.ACJSArray.validateForm
        > > ();">
        > >
        > > <h3>Find a state:</h3>
        > >
        > > <div id="statesautocomplete">
        > >
        > > <input id="statesinput">
        > >
        > > <div id="statescontainer"></div>
        > >
        > > </div>
        > >
        > > <h3>Find an area code</h3>
        > >
        > > <div id="statesautocomplete2">
        > >
        > > <input id="statesinput2">
        > >
        > > <div id="statescontainer2"></div>
        > >
        > > </div>
        > > <div>
        > > <button id="show1">Show panel1</button>
        > > <button id="hide1">Hide panel1</button>
        > > </div>
        > >
        > > <div id="panel1">
        > > <div class="hd">Panel #1 from Markup</div>
        > > <div class="bd">This is a Panel that was
        > > marked up in the document.</div>
        > > <div class="ft">End of Panel #1</div>
        > > </div>
        > >
        > > <div>
        > > <button id="show2">Show panel2</button>
        > > <button id="hide2">Hide panel2</button>
        > > </div>
        > > </form>
        > >
        > > </div>
        > >
        > > <!-- AutoComplete ends -->
        > >
        > >
        > >
        > > <!-- Content begins -->
        > >
        > > <p>There are two AutoComplete widgets on this page that each
        > > point to a
        > >
        > > different DS_JSArray DataSource instance. Driving each
        > > DataSource is a local
        > >
        > > JavaScript array of strings: <code>statesArray</code> and
        > > <code>areaCodesArray</code>.
        > >
        > > By pointing to arrays that are already loaded into memory
        the
        > > widget is
        > >
        > > very fast to return data. Therefore, both AutoComplete
        instances
        > > are
        > >
        > > configured to have a query delay of zero
        > >
        > > seconds.</p>
        > >
        > >
        > >
        > > <p>A few configurations have also been made to aid
        usability.
        > > The properties
        > >
        > > <code>autoHighlight</code> and <code>typeAhead</code> have
        been
        > > enabled to
        > >
        > > help reduce the number of user interactions. Enabling the
        > >
        > > <code>prehighlightClassName</code> paramter provides
        > > supplemental visual
        > >
        > > feedback for mouse events.</p>
        > >
        > >
        > >
        > > <p>The <code>formatResult</code> method of the second
        > > AutoComplete instance
        > >
        > > has been enhanced to display two data fields in the
        container,
        > > and the
        > >
        > > <code>forceSelection</code> property has been enabled to
        prevent
        > > the user from
        > >
        > > typing in a free-form selection.</p>
        > >
        > >
        > >
        > > <!-- Sample code begins -->
        > >
        > > <div id="code">
        > >
        > > <h3>Sample Code</h3>
        > >
        > >
        > >
        > > <p>CSS:</p>
        > >
        > >
        > >
        > > <textarea name="code" class="HTML" cols="60" rows="1">
        > >
        > > #statesmod {position:relative;}
        > >
        > > #statesautocomplete, #statesautocomplete2
        > > {position:relative;width:15em;margin-bottom:1em;}/* set width of
        > > widget here*/
        > >
        > > #statesautocomplete {z-index:9000} /* for IE z-index
        of
        > > absolute divs inside relative divs issue */
        > >
        > > #statesinput, #statesinput2
        > > {_position:absolute;width:100%;height:1.4em;z-index:0;} /* abs
        for
        > > ie quirks */
        > >
        > > #statescontainer, #statescontainer2
        > > {position:absolute;top:1.7em;width:100%}
        > >
        > > #statescontainer .yui-ac-content,
        #statescontainer2 .yui-
        > > ac-content {position:absolute;width:100%;border:1px solid
        > > #404040;background:#fff;overflow:hidden;z-index:9050;}
        > >
        > > #statescontainer .yui-ac-shadow,
        #statescontainer2 .yui-
        > > ac-shadow
        > > {position:absolute;margin:.3em;width:100%;background:#a0a0a0;z-
        > > index:9049;}
        > >
        > > #statescontainer ul, #statescontainer2 ul
        {padding:5px
        > > 0;width:100%;}
        > >
        > > #statescontainer li, #statescontainer2 li {padding:0
        > > 5px;cursor:default;white-space:nowrap;}
        > >
        > > #statescontainer li.yui-ac-highlight,
        #statescontainer2
        > > li.yui-ac-highlight {background:#ff0;}
        > >
        > > #statescontainer li.yui-ac-
        > > prehighlight,#statescontainer2 li.yui-ac-prehighlight
        > > {background:#FFFFCC;}
        > >
        > > </textarea>
        > >
        > >
        > >
        > > <p>Markup:</p>
        > >
        > >
        > >
        > > <textarea name="code" class="HTML" cols="60" rows="1">
        > >
        > > <!-- AutoComplete begins -->
        > >
        > > <div id="statesmod">
        > >
        > > <form onsubmit="return
        > > YAHOO.example.ACJSArray.validateForm();">
        > >
        > > <h3>Find a state:</h3>
        > >
        > > <div id="statesautocomplete">
        > >
        > > <input id="statesinput">
        > >
        > > <div id="statescontainer"></div>
        > >
        > > </div>
        > >
        > > <h3>Find an area code</h3>
        > >
        > > <div id="statesautocomplete2">
        > >
        > > <input id="statesinput2">
        > >
        > > <div id="statescontainer2"></div>
        > >
        > > </div>
        > >
        > > </form>
        > >
        > > </div>
        > >
        > > <!-- AutoComplete ends -->
        > >
        > > </textarea>
        > >
        > >
        > >
        > > <p>JavaScript:</p>
        > >
        > >
        > >
        > > <textarea name="code" class="JScript" cols="60" rows="1">
        > >
        > > var statesArray = [
        > >
        > > "Alabama",
        > >
        > > "Alaska",
        > >
        > > "Arizona",
        > >
        > > "Arkansas",
        > >
        > > "California",
        > >
        > > "Colorado",
        > >
        > > "Connecticut",
        > >
        > > "Delaware",
        > >
        > > "Florida" // Entire array not shown
        > >
        > > ];
        > >
        > >
        > >
        > > var areacodesArray = [
        > >
        > > ["201", "New Jersey"],
        > >
        > > ["202", "Washington, DC"],
        > >
        > > ["203", "Connecticut"],
        > >
        > > ["204", "Manitoba, Canada"],
        > >
        > > ["205", "Alabama"],
        > >
        > > ["206", "Washington"],
        > >
        > > ["207", "Maine"] // Entire array not shown
        > >
        > > ];
        > >
        > >
        > >
        > > // Instantiate first JS Array DataSource
        > >
        > > oACDS = new YAHOO.widget.DS_JSArray(statesArray);
        > >
        > >
        > >
        > > // Instantiate first AutoComplete
        > >
        > > oAutoComp = new YAHOO.widget.AutoComplete
        > > ('statesinput','statescontainer', oACDS);
        > >
        > > oAutoComp.queryDelay = 0;
        > >
        > > oAutoComp.prehighlightClassName = "yui-ac-
        prehighlight";
        > >
        > > oAutoComp.typeAhead = true;
        > >
        > > oAutoComp.useShadow = true;
        > >
        > >
        > >
        > > // Instantiate second JS Array DataSource
        > >
        > > oACDS2 = new YAHOO.widget.DS_JSArray(areacodesArray);
        > >
        > >
        > >
        > > // Instantiate second AutoComplete
        > >
        > > oAutoComp2 = new YAHOO.widget.AutoComplete
        > > ('statesinput2','statescontainer2', oACDS2);
        > >
        > > oAutoComp2.queryDelay = 0;
        > >
        > > oAutoComp2.prehighlightClassName = "yui-ac-
        prehighlight";
        > >
        > > oAutoComp2.typeAhead = true;
        > >
        > > oAutoComp2.useShadow = true;
        > >
        > > oAutoComp2.forceSelection = true;
        > >
        > > oAutoComp2.formatResult = function(oResultItem,
        sQuery) {
        > >
        > > var sMarkup = oResultItem[0] + " (" + oResultItem
        [1]
        > > + ")";
        > >
        > > return (sMarkup);
        > >
        > > };
        > >
        > > </textarea>
        > >
        > > </div>
        > >
        > > <!-- Code sample ends -->
        > >
        > > </div>
        > >
        > > <!-- Content ends -->
        > >
        > >
        > >
        > > <!-- Libary begins -->
        > >
        > > <script type="text/javascript"
        > > src="../../build/yahoo/yahoo.js"></script>
        > >
        > > <script type="text/javascript"
        src="../../build/dom/dom.js"></script>
        > >
        > > <script type="text/javascript" src="../../build/event/event-
        > > debug.js"></script>
        > >
        > > <script type="text/javascript"
        > > src="../../build/animation/animation.js"></script>
        > >
        > > <script type="text/javascript"
        > > src="../../build/autocomplete/autocomplete-debug.js"></script>
        > >
        > > <script type="text/javascript"
        > > src="../../build/logger/logger.js"></script>
        > >
        > > <script type="text/javascript"
        > > src="../../build/dragdrop/dragdrop.js" ></script>
        > >
        > > <script type="text/javascript"
        > > src="../../build/container/container.js"></script>
        > > <link type="text/css" rel="stylesheet"
        > > href="../../build/container/assets/container.css">
        > >
        > > <!-- Library ends -->
        > >
        > >
        > >
        > > <!-- In-memory JS array begins-->
        > >
        > > <script type="text/javascript">
        > >
        > > var statesArray = [
        > >
        > > "Alabama",
        > >
        > > "Alaska",
        > >
        > > "Arizona",
        > >
        > > "Arkansas",
        > >
        > > "California",
        > >
        > > "Colorado",
        > >
        > > "Connecticut",
        > >
        > > "Delaware",
        > >
        > > "Florida",
        > >
        > > "Georgia",
        > >
        > > "Hawaii",
        > >
        > > "Idaho",
        > >
        > > "Illinois",
        > >
        > > "Indiana",
        > >
        > > "Iowa",
        > >
        > > "Kansas",
        > >
        > > "Kentucky",
        > >
        > > "Louisiana",
        > >
        > > "Maine",
        > >
        > > "Maryland",
        > >
        > > "Massachusetts",
        > >
        > > "Michigan",
        > >
        > > "Minnesota",
        > >
        > > "Mississippi",
        > >
        > > "Missouri",
        > >
        > > "Montana",
        > >
        > > "Nebraska",
        > >
        > > "Nevada",
        > >
        > > "New Hampshire",
        > >
        > > "New Jersey",
        > >
        > > "New Mexico",
        > >
        > > "New York",
        > >
        > > "North Dakota",
        > >
        > > "North Carolina",
        > >
        > > "Ohio",
        > >
        > > "Oklahoma",
        > >
        > > "Oregon",
        > >
        > > "Pennsylvania",
        > >
        > > "Rhode Island",
        > >
        > > "South Carolina",
        > >
        > > "South Dakota",
        > >
        > > "Tennessee",
        > >
        > > "Texas",
        > >
        > > "Utah",
        > >
        > > "Vermont",
        > >
        > > "Virginia",
        > >
        > > "Washington",
        > >
        > > "West Virginia",
        > >
        > > "Wisconsin",
        > >
        > > "Wyoming"
        > >
        > > ];
        > >
        > > var areacodesArray = [
        > >
        > > ["201", "New Jersey"],
        > >
        > > ["202", "Washington, DC"],
        > >
        > > ["203", "Connecticut"],
        > >
        > > ["204", "Manitoba, Canada"],
        > >
        > > ["205", "Alabama"],
        > >
        > > ["206", "Washington"],
        > >
        > > ["207", "Maine"],
        > >
        > >
        > >
        > > ["208", "Idaho"],
        > >
        > > ["209", "California"],
        > >
        > > ["210", "Texas"],
        > >
        > > ["212", "New York"],
        > >
        > > ["213", "California"],
        > >
        > > ["214", "Texas"],
        > >
        > >
        > >
        > > ["215", "Pennsylvania"],
        > >
        > > ["216", "Ohio"],
        > >
        > > ["217", "Illinois"],
        > >
        > > ["218", "Minnesota"],
        > >
        > > ["219", "Indiana"],
        > >
        > > ["224", "Illinois"],
        > >
        > >
        > >
        > > ["225", "Louisiana"],
        > >
        > > ["227", "Maryland"],
        > >
        > > ["228", "Mississippi"],
        > >
        > > ["229", "Georgia"],
        > >
        > > ["231", "Michigan"],
        > >
        > > ["234", "Ohio"],
        > >
        > >
        > >
        > > ["239", "Florida"],
        > >
        > > ["240", "Maryland"],
        > >
        > > ["242", "Bahamas"],
        > >
        > > ["246", "Barbados"],
        > >
        > > ["248", "Michigan"],
        > >
        > > ["250", "British Columbia"],
        > >
        > >
        > >
        > > ["251", "Alabama"],
        > >
        > > ["252", "North Carolina"],
        > >
        > > ["253", "Washington"],
        > >
        > > ["254", "Texas"],
        > >
        > > ["256", "Alabama"],
        > >
        > > ["260", "Indiana"],
        > >
        > >
        > >
        > > ["262", "Wisconsin"],
        > >
        > > ["264", "Anguilla"],
        > >
        > > ["267", "Pennsylvania"],
        > >
        > > ["268", "Antigua and Barbuda"],
        > >
        > > ["269", "Michigan"],
        > >
        > > ["270", "Kentucky"],
        > >
        > >
        > >
        > > ["276", "Virginia"],
        > >
        > > ["281", "Texas"],
        > >
        > > ["283", "Ohio"],
        > >
        > > ["284", "British Virgin Islands"],
        > >
        > > ["289", "Ontario"],
        > >
        > > ["301", "Maryland"],
        > >
        > >
        > >
        > > ["302", "Delaware"],
        > >
        > > ["303", "Colorado"],
        > >
        > > ["304", "West Virginia"],
        > >
        > > ["305", "Florida"],
        > >
        > > ["306", "Saskatchewan, Canada"],
        > >
        > > ["307", "Wyoming"],
        > >
        > >
        > >
        > > ["308", "Nebraska"],
        > >
        > > ["309", "Illinois"],
        > >
        > > ["310", "California"],
        > >
        > > ["312", "Illinois"],
        > >
        > > ["313", "Michigan"],
        > >
        > > ["314", "Missouri"],
        > >
        > >
        > >
        > > ["315", "New York"],
        > >
        > > ["316", "Kansas"],
        > >
        > > ["317", "Indiana"],
        > >
        > > ["318", "Louisiana"],
        > >
        > > ["319", "Iowa"],
        > >
        > > ["320", "Minnesota"],
        > >
        > >
        > >
        > > ["321", "Florida"],
        > >
        > > ["323", "California"],
        > >
        > > ["330", "Ohio"],
        > >
        > > ["331", "Illinois"],
        > >
        > > ["334", "Alabama"],
        > >
        > > ["336", "North Carolina"],
        > >
        > >
        > >
        > > ["337", "Louisiana"],
        > >
        > > ["339", "Massachusetts"],
        > >
        > > ["340", "US Virgin Islands"],
        > >
        > > ["345", "Cayman Islands"],
        > >
        > > ["347", "New York"],
        > >
        > > ["351", "Massachusetts"],
        > >
        > >
        > >
        > > ["352", "Florida"],
        > >
        > > ["360", "Washington"],
        > >
        > > ["361", "Texas"],
        > >
        > > ["386", "Florida"],
        > >
        > > ["401", "Rhode Island"],
        > >
        > > ["402", "Nebraska"],
        > >
        > >
        > >
        > > ["403", "Alberta, Canada"],
        > >
        > > ["404", "Georgia"],
        > >
        > > ["405", "Oklahoma"],
        > >
        > > ["406", "Montana"],
        > >
        > > ["407", "Florida"],
        > >
        > > ["408", "California"],
        > >
        > >
        > >
        > > ["409", "Texas"],
        > >
        > > ["410", "Maryland"],
        > >
        > > ["412", "Pennsylvania"],
        > >
        > > ["413", "Massachusetts"],
        > >
        > > ["414", "Wisconsin"],
        > >
        > > ["415", "California"],
        > >
        > >
        > >
        > > ["416", "Ontario, Canada"],
        > >
        > > ["417", "Missouri"],
        > >
        > > ["418", "Quebec, Canada"],
        > >
        > > ["419", "Ohio"],
        > >
        > > ["423", "Tennessee"],
        > >
        > > ["424", "California"],
        > >
        > >
        > >
        > > ["425", "Washington"],
        > >
        > > ["434", "Virginia"],
        > >
        > > ["435", "Utah"],
        > >
        > > ["440", "Ohio"],
        > >
        > > ["441", "Bermuda"],
        > >
        > > ["443", "Maryland"],
        > >
        > >
        > >
        > > ["445", "Pennsylvania"],
        > >
        > > ["450", "Quebec, Canada"],
        > >
        > > ["464", "Illinois"],
        > >
        > > ["469", "Texas"],
        > >
        > > ["470", "Georgia"],
        > >
        > > ["473", "Grenada"],
        > >
        > >
        > >
        > > ["475", "Connecticut"],
        > >
        > > ["478", "Georgia"],
        > >
        > > ["479", "Arkansas"],
        > >
        > > ["480", "Arizona"],
        > >
        > > ["484", "Pennsylvania"],
        > >
        > > ["501", "Arkansas"],
        > >
        > >
        > >
        > > ["502", "Kentucky"],
        > >
        > > ["503", "Oregon"],
        > >
        > > ["504", "Louisiana"],
        > >
        > > ["505", "New Mexico"],
        > >
        > > ["506", "New Brunswick, Canada"],
        > >
        > > ["507", "Minnesota"],
        > >
        > >
        > >
        > > ["508", "Massachusetts"],
        > >
        > > ["509", "Washington"],
        > >
        > > ["510", "California"],
        > >
        > > ["512", "Texas"],
        > >
        > > ["513", "Ohio"],
        > >
        > > ["514", "Quebec, Canada"],
        > >
        > >
        > >
        > > ["515", "Iowa"],
        > >
        > > ["516", "New York"],
        > >
        > > ["517", "Michigan"],
        > >
        > > ["518", "New York"],
        > >
        > > ["519", "Ontario, Canada"],
        > >
        > > ["520", "Arizona"],
        > >
        > >
        > >
        > > ["530", "California"],
        > >
        > > ["540", "Virginia"],
        > >
        > > ["541", "Oregon"],
        > >
        > > ["551", "New Jersey"],
        > >
        > > ["557", "Missouri"],
        > >
        > > ["559", "California"],
        > >
        > >
        > >
        > > ["561", "Florida"],
        > >
        > > ["562", "California"],
        > >
        > > ["563", "Iowa"],
        > >
        > > ["564", "Washington"],
        > >
        > > ["567", "Ohio"],
        > >
        > > ["570", "Pennsylvania"],
        > >
        > >
        > >
        > > ["571", "Virginia"],
        > >
        > > ["573", "Missouri"],
        > >
        > > ["574", "Indiana"],
        > >
        > > ["580", "Oklahoma"],
        > >
        > > ["585", "New York"],
        > >
        > > ["586", "Michigan"],
        > >
        > >
        > >
        > > ["601", "Mississippi"],
        > >
        > > ["602", "Arizona"],
        > >
        > > ["603", "New Hampshire"],
        > >
        > > ["604", "British Columbia, Canada"],
        > >
        > > ["605", "South Dakota"],
        > >
        > > ["606", "Kentucky"],
        > >
        > >
        > >
        > > ["607", "New York"],
        > >
        > > ["608", "Wisconsin"],
        > >
        > > ["609", "New Jersey"],
        > >
        > > ["610", "Pennsylvania"],
        > >
        > > ["612", "Minnesota"],
        > >
        > > ["613", "Ontario, Canada"],
        > >
        > >
        > >
        > > ["614", "Ohio"],
        > >
        > > ["615", "Tennessee"],
        > >
        > > ["616", "Michigan"],
        > >
        > > ["617", "Massachusetts"],
        > >
        > > ["618", "Illinois"],
        > >
        > > ["619", "California"],
        > >
        > >
        > >
        > > ["620", "Kansas"],
        > >
        > > ["623", "Arizona"],
        > >
        > > ["626", "California"],
        > >
        > > ["630", "Illinois"],
        > >
        > > ["631", "New York"],
        > >
        > > ["636", "Missouri"],
        > >
        > >
        > >
        > > ["641", "Iowa"],
        > >
        > > ["646", "New York"],
        > >
        > > ["647", "Ontario, Canada"],
        > >
        > > ["649", "Turks and Caicos Islands"],
        > >
        > > ["650", "California"],
        > >
        > > ["651", "Minnesota"],
        > >
        > >
        > >
        > > ["660", "Missouri"],
        > >
        > > ["661", "California"],
        > >
        > > ["662", "Mississippi"],
        > >
        > > ["664", "Montserrat"],
        > >
        > > ["667", "Maryland"],
        > >
        > > ["670", "CNMI"],
        > >
        > >
        > >
        > > ["671", "Guam"],
        > >
        > > ["678", "Georgia"],
        > >
        > > ["682", "Texas"],
        > >
        > > ["701", "North Dakota"],
        > >
        > > ["702", "Nevada"],
        > >
        > > ["703", "Virginia"],
        > >
        > >
        > >
        > > ["704", "North Carolina"],
        > >
        > > ["705", "Ontario, Canada"],
        > >
        > > ["706", "Georgia"],
        > >
        > > ["707", "California"],
        > >
        > > ["708", "Illinois"],
        > >
        > > ["709", "Newfoundland, Canada"],
        > >
        > >
        > >
        > > ["712", "Iowa"],
        > >
        > > ["713", "Texas"],
        > >
        > > ["714", "California"],
        > >
        > > ["715", "Wisconsin"],
        > >
        > > ["716", "New York"],
        > >
        > > ["717", "Pennsylvania"],
        > >
        > >
        > >
        > > ["718", "New York"],
        > >
        > > ["719", "Colorado"],
        > >
        > > ["720", "Colorado"],
        > >
        > > ["724", "Pennsylvania"],
        > >
        > > ["727", "Florida"],
        > >
        > > ["731", "Tennessee"],
        > >
        > >
        > >
        > > ["732", "New Jersey"],
        > >
        > > ["734", "Michigan"],
        > >
        > > ["737", "Texas"],
        > >
        > > ["740", "Ohio"],
        > >
        > > ["754", "Florida"],
        > >
        > > ["757", "Viriginia"],
        > >
        > >
        > >
        > > ["758", "St. Lucia"],
        > >
        > > ["760", "California"],
        > >
        > > ["763", "Minnesota"],
        > >
        > > ["765", "Indiana"],
        > >
        > > ["767", "Dominica"],
        > >
        > > ["770", "Georgia"],
        > >
        > >
        > >
        > > ["772", "Florida"],
        > >
        > > ["773", "Illinois"],
        > >
        > > ["774", "Massachusetts"],
        > >
        > > ["775", "Nevada"],
        > >
        > > ["778", "British Columbia, Canada"],
        > >
        > > ["780", "Alberta, Canada"],
        > >
        > >
        > >
        > > ["781", "Massachusetts"],
        > >
        > > ["784", "St. Vincent & Gren."],
        > >
        > > ["785", "Kansas"],
        > >
        > > ["786", "Florida"],
        > >
        > > ["787", "Puerto Rico"],
        > >
        > >
        > >
        > > ["801", "Utah"],
        > >
        > > ["802", "Vermont"],
        > >
        > > ["803", "South Carolina"],
        > >
        > > ["804", "Virginia"],
        > >
        > > ["805", "California"],
        > >
        > > ["806", "Texas"],
        > >
        > >
        > >
        > > ["807", "Ontario, Canada"],
        > >
        > > ["808", "Hawaii"],
        > >
        > > ["809", "Dominican Republic"],
        > >
        > > ["810", "Michigan"],
        > >
        > > ["812", "Indiana"],
        > >
        > > ["813", "Florida"],
        > >
        > >
        > >
        > > ["814", "Pennsylvania"],
        > >
        > > ["815", "Illinois"],
        > >
        > > ["816", "Missouri"],
        > >
        > > ["817", "Texas"],
        > >
        > > ["818", "California"],
        > >
        > > ["819", "Quebec, Canada"],
        > >
        > >
        > >
        > > ["828", "North Carolina"],
        > >
        > > ["830", "Texas"],
        > >
        > > ["831", "California"],
        > >
        > > ["832", "Texas"],
        > >
        > > ["835", "Pennsylvania"],
        > >
        > > ["843", "South Carolina"],
        > >
        > >
        > >
        > > ["845", "New York"],
        > >
        > > ["847", "Illinois"],
        > >
        > > ["848", "New Jersey"],
        > >
        > > ["850", "Florida"],
        > >
        > > ["856", "New Jersey"],
        > >
        > > ["857", "Massachusetts"],
        > >
        > >
        > >
        > > ["858", "California"],
        > >
        > > ["859", "Kentucky"],
        > >
        > > ["860", "Connecticut"],
        > >
        > > ["862", "New Jersey"],
        > >
        > > ["863", "Florida"],
        > >
        > > ["864", "South Carolina"],
        > >
        > >
        > >
        > > ["865", "Tennessee"],
        > >
        > > ["867", "Yukon, NW Territories, Canada"],
        > >
        > > ["868", "Trinidad and Tobago"],
        > >
        > > ["869", "St. Kitts & Nevis"],
        > >
        > > ["870", "Arkansas"],
        > >
        > >
        > >
        > > ["872", "Illinois"],
        > >
        > > ["876", "Jamaica"],
        > >
        > > ["878", "Pennsylvania"],
        > >
        > > ["901", "Tennessee"],
        > >
        > > ["902", "Nova Scotia, Canada"],
        > >
        > > ["903", "Texas"],
        > >
        > >
        > >
        > > ["904", "Florida"],
        > >
        > > ["905", "Ontario, Canada"],
        > >
        > > ["906", "Michigan"],
        > >
        > > ["907", "Alaska"],
        > >
        > > ["908", "New Jersey"],
        > >
        > > ["909", "California"],
        > >
        > >
        > >
        > > ["910", "North Carolina"],
        > >
        > > ["912", "Georgia"],
        > >
        > > ["913", "Kansas"],
        > >
        > > ["914", "New York"],
        > >
        > > ["915", "Texas"],
        > >
        > > ["916", "California"],
        > >
        > >
        > >
        > > ["917", "New York"],
        > >
        > > ["918", "Oklahoma"],
        > >
        > > ["919", "North Carolina"],
        > >
        > > ["920", "Wisconsin"],
        > >
        > > ["925", "California"],
        > >
        > > ["928", "Arizona"],
        > >
        > >
        > >
        > > ["931", "Tennessee"],
        > >
        > > ["936", "Texas"],
        > >
        > > ["937", "Ohio"],
        > >
        > > ["939", "Puerto Rico"],
        > >
        > > ["940", "Texas"],
        > >
        > > ["941", "Florida"],
        > >
        > >
        > >
        > > ["947", "Michigan"],
        > >
        > > ["949", "California"],
        > >
        > > ["952", "Minnesota"],
        > >
        > > ["954", "Florida"],
        > >
        > > ["956", "Texas"],
        > >
        > > ["959", "Connecticut"],
        > >
        > >
        > >
        > > ["970", "Colorado"],
        > >
        > > ["971", "Oregon"],
        > >
        > > ["972", "Texas"],
        > >
        > > ["973", "New Jersey"],
        > >
        > > ["975", "Missouri"],
        > >
        > > ["978", "Massachusetts"],
        > >
        > >
        > >
        > > ["979", "Texas"],
        > >
        > > ["980", "North Carolina"],
        > >
        > > ["984", "North Carolina"],
        > >
        > > ["985", "Louisiana"],
        > >
        > > ["989", "Michigan"]
        > >
        > > ];
        > >
        > > </script>
        > >
        > > <!-- In-memory JS array ends-->
        > >
        > >
        > >
        > >
        > >
        > > <script type="text/javascript">
        > >
        > > YAHOO.example.ACJSArray = function() {
        > >
        > > var mylogger;
        > >
        > > var oACDS,oACDS2;
        > >
        > > var oAutoComp,oAutoComp2;
        > >
        > > return {
        > >
        > > init: function() {
        > >
        > > //Logger
        > >
        > > mylogger = new YAHOO.widget.LogReader("logger");
        > >
        > >
        > >
        > > // Instantiate first JS Array DataSource
        > >
        > > oACDS = new YAHOO.widget.DS_JSArray(statesArray);
        > >
        > >
        > >
        > > // Instantiate first AutoComplete
        > >
        > > oAutoComp = new YAHOO.widget.AutoComplete
        > > ('statesinput','statescontainer', oACDS);
        > >
        > > oAutoComp.queryDelay = 0;
        > >
        > > oAutoComp.prehighlightClassName = "yui-ac-
        prehighlight";
        > >
        > > oAutoComp.typeAhead = true;
        > >
        > > oAutoComp.useShadow = true;
        > >
        > >
        > >
        > > // Instantiate second JS Array DataSource
        > >
        > > oACDS2 = new YAHOO.widget.DS_JSArray(areacodesArray);
        > >
        > >
        > >
        > > // Instantiate second AutoComplete
        > >
        > > oAutoComp2 = new YAHOO.widget.AutoComplete
        > > ('statesinput2','statescontainer2', oACDS2);
        > >
        > > oAutoComp2.queryDelay = 0;
        > >
        > > oAutoComp2.prehighlightClassName = "yui-ac-
        prehighlight";
        > >
        > > oAutoComp2.typeAhead = true;
        > >
        > > oAutoComp2.useShadow = true;
        > >
        > > oAutoComp2.forceSelection = true;
        > >
        > > oAutoComp2.formatResult = function(oResultItem,
        sQuery) {
        > >
        > > var sMarkup = oResultItem[0] + " (" + oResultItem
        [1]
        > > + ")";
        > >
        > > return (sMarkup);
        > >
        > > };
        > >
        > >
        > > var onItemSelect = function
        > > (oAutoComp2,oSelectItem,oData)
        > > {
        > > debugger;
        > > } ;
        > >
        > > oAutoComp2.itemSelectEvent.subscribe
        > > (onItemSelect);
        > >
        > >
        > >
        > > },
        > >
        > >
        > >
        > > validateForm: function() {
        > >
        > > // Validate form inputs here
        > >
        > > return false;
        > >
        > > }
        > >
        > > };
        > >
        > > }();
        > >
        > >
        > >
        > > YAHOO.util.Event.addListener
        > > (this,'load',YAHOO.example.ACJSArray.init);
        > >
        > > </script>
        > >
        > >
        > >
        > > <script type="text/javascript"
        > > src="../../docs/assets/dpSyntaxHighlighter.js"></script>
        > >
        > > <script type="text/javascript">
        > >
        > > dp.SyntaxHighlighter.HighlightAll('code');
        > >
        > > </script>
        > >
        > > <script>
        > > YAHOO.namespace
        > > ("example.container");
        > >
        > > function init() {
        > > // Instantiate a Panel
        > > from markup
        > >
        > > YAHOO.example.container.panel1 = new YAHOO.widget.Panel
        > > ("panel1", {fixedcenter:true, width:"300px", visible:false,
        > > constraintoviewport:true } );
        > >
        > > YAHOO.example.container.panel1.render();
        > >
        > > // Instantiate a Panel
        > > from script
        > >
        > > YAHOO.example.container.panel2 = new YAHOO.widget.Panel
        > > ("panel2", {fixedcenter:true, width:"300px",
        > > visible:false,modal:true, draggable:true, close:true } );
        > >
        > > YAHOO.example.container.panel2.setHeader("Panel #2 from
        > > Script");
        > >
        > > YAHOO.example.container.panel2.setBody("This is a
        > > dynamically generated Panel.");
        > >
        > > YAHOO.example.container.panel2.setFooter("End of Panel #2");
        > >
        > > YAHOO.example.container.panel2.render(document.body);
        > >
        > >
        > > YAHOO.util.Event.addListener("show1", "click",
        > > YAHOO.example.container.panel1.show,
        YAHOO.example.container.panel1,
        > > true);
        > >
        > > YAHOO.util.Event.addListener("hide1", "click",
        > > YAHOO.example.container.panel1.hide,
        YAHOO.example.container.panel1,
        > > true);
        > >
        > >
        > > YAHOO.util.Event.addListener("show2", "click",
        > > YAHOO.example.container.panel2.show,
        YAHOO.example.container.panel2,
        > > true);
        > >
        > > YAHOO.util.Event.addListener("hide2", "click",
        > > YAHOO.example.container.panel2.hide,
        YAHOO.example.container.panel2,
        > > true);
        > > }
        > >
        > > YAHOO.util.Event.addListener
        > > (window, "load", init);
        > >
        > >
        > > </script>
        > >
        > >
        > > </body>
        > >
        > > </html>
        > >
        >
      • jennykhan
        Hi there, Thank you for the additional information. However, I am still not able to reproduce the issue. If anyone could post a link to an online reproducible
        Message 3 of 7 , Jan 5, 2007
        • 0 Attachment
          Hi there,

          Thank you for the additional information. However, I am still not able
          to reproduce the issue. If anyone could post a link to an online
          reproducible case, it would be much appreciated.

          Thanks,
          Jenny




          --- In ydn-javascript@yahoogroups.com, "takitzis" <takitzis@...> wrote:
          >
          > I believe the problem is the same as mine.
          >
          > We have an AutoComplete.
          > We also have a panel with modal=true.
          > The autocomplete works fine until I show the panel and then hide it.
          > After the hide action, the autocomplete is stops working.
          >
          > If the same panel has the option modal=false, If I show and then hide
          > the panel the autocomplete works fine, after the hide action.
          >
          > So, the major problem is after the show/hide action of a panel with
          > modal=true.
          >
          > This is a problem only in IE (6 & 7) and not on Firefox and Opera
          > where the autocomplete works fine, no matter the modal state of the
          > panel. I've tryed all the possible combinations of queryDelay,
          > useIFrame, useShadow, minQueryLength, maxCacheEntries and on all
          > combinations the IE keeps to deny to show the autocomplete, after the
          > hide action of a modal panel.
          >
          > It seems that the Autocomplete is not fired up, after the hide action
          > of the modal panel, because on IE, it never enters at the
          > formatResult function.
          >
          > Any possible solution ?
          >
          > --- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@>
          > wrote:
          > >
          > > Hi there,
          > >
          > > By definition, your modal Panel instance should not allow
          > interaction
          > > with any other page elements, including AutoComplete. The behavior
          > you
          > > are seeing is to be expected.
          > >
          > > Regards,
          > > Jenny
          > >
          > >
          > >
          > >
          > >
          > > --- In ydn-javascript@yahoogroups.com, "langzi.tech" <langzi.tech@>
          > > wrote:
          > > >
          > > > if you have a autocomplete and a panel.
          > > > the modal of panel is true.
          > > >
          > > > if you show panel,then the autocomplete will can't show dropdown
          > box.
          > > >
          > > > i test this issue in the yui's examples.
          > > >
          > > > if show panel1(modal=false),the autocomplete work fine.
          > > >
          > > > if show panel2(modal=true),the autocomplet work not fine.
          > > >
          > > > code:
          >
        • langzi.tech
          Hi,jennykhan: If you want to reproduce the issue,you can use any yui s examples. The problem is you must trigger the Panel to Show with ShowModal at
          Message 4 of 7 , Jan 5, 2007
          • 0 Attachment
            Hi,jennykhan:

            If you want to reproduce the issue,you can use any yui's
            examples.

            The problem is you must trigger the Panel to Show
            with "ShowModal" at first,then the AutoComplete will can't work
            fine,if not,it work fine.

            --- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@...>
            wrote:
            >
            > Hi there,
            >
            > Thank you for the additional information. However, I am still not
            able
            > to reproduce the issue. If anyone could post a link to an online
            > reproducible case, it would be much appreciated.
            >
            > Thanks,
            > Jenny
            >
            >
            >
            >
            > --- In ydn-javascript@yahoogroups.com, "takitzis" <takitzis@>
            wrote:
            > >
            > > I believe the problem is the same as mine.
            > >
            > > We have an AutoComplete.
            > > We also have a panel with modal=true.
            > > The autocomplete works fine until I show the panel and then hide
            it.
            > > After the hide action, the autocomplete is stops working.
            > >
            > > If the same panel has the option modal=false, If I show and then
            hide
            > > the panel the autocomplete works fine, after the hide action.
            > >
            > > So, the major problem is after the show/hide action of a panel
            with
            > > modal=true.
            > >
            > > This is a problem only in IE (6 & 7) and not on Firefox and
            Opera
            > > where the autocomplete works fine, no matter the modal state of
            the
            > > panel. I've tryed all the possible combinations of queryDelay,
            > > useIFrame, useShadow, minQueryLength, maxCacheEntries and on all
            > > combinations the IE keeps to deny to show the autocomplete,
            after the
            > > hide action of a modal panel.
            > >
            > > It seems that the Autocomplete is not fired up, after the hide
            action
            > > of the modal panel, because on IE, it never enters at the
            > > formatResult function.
            > >
            > > Any possible solution ?
            > >
            > > --- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@>
            > > wrote:
            > > >
            > > > Hi there,
            > > >
            > > > By definition, your modal Panel instance should not allow
            > > interaction
            > > > with any other page elements, including AutoComplete. The
            behavior
            > > you
            > > > are seeing is to be expected.
            > > >
            > > > Regards,
            > > > Jenny
            > > >
            > > >
            > > >
            > > >
            > > >
            > > > --- In ydn-javascript@yahoogroups.com, "langzi.tech"
            <langzi.tech@>
            > > > wrote:
            > > > >
            > > > > if you have a autocomplete and a panel.
            > > > > the modal of panel is true.
            > > > >
            > > > > if you show panel,then the autocomplete will can't show
            dropdown
            > > box.
            > > > >
            > > > > i test this issue in the yui's examples.
            > > > >
            > > > > if show panel1(modal=false),the autocomplete work fine.
            > > > >
            > > > > if show panel2(modal=true),the autocomplet work not fine.
            > > > >
            > > > > code:
            > >
            >
          • jennykhan
            Sorry, but this is still not enough information. Using the code you originally sent, I m able to show and then hide the modal panel and then successfully use
            Message 5 of 7 , Jan 30, 2007
            • 0 Attachment
              Sorry, but this is still not enough information. Using the code you
              originally sent, I'm able to show and then hide the modal panel and
              then successfully use both AutoComplete widgets. If you are still
              seeing a problem, please post a reproducible example online with
              specific test case steps so we can try to troubleshoot.

              Thanks,
              Jenny



              --- In ydn-javascript@yahoogroups.com, "langzi.tech" <langzi.tech@...>
              wrote:
              >
              > Hi,jennykhan:
              >
              > If you want to reproduce the issue,you can use any yui's
              > examples.
              >
              > The problem is you must trigger the Panel to Show
              > with "ShowModal" at first,then the AutoComplete will can't work
              > fine,if not,it work fine.
              >
              > --- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@>
              > wrote:
              > >
              > > Hi there,
              > >
              > > Thank you for the additional information. However, I am still not
              > able
              > > to reproduce the issue. If anyone could post a link to an online
              > > reproducible case, it would be much appreciated.
              > >
              > > Thanks,
              > > Jenny
              > >
              > >
              > >
              > >
              > > --- In ydn-javascript@yahoogroups.com, "takitzis" <takitzis@>
              > wrote:
              > > >
              > > > I believe the problem is the same as mine.
              > > >
              > > > We have an AutoComplete.
              > > > We also have a panel with modal=true.
              > > > The autocomplete works fine until I show the panel and then hide
              > it.
              > > > After the hide action, the autocomplete is stops working.
              > > >
              > > > If the same panel has the option modal=false, If I show and then
              > hide
              > > > the panel the autocomplete works fine, after the hide action.
              > > >
              > > > So, the major problem is after the show/hide action of a panel
              > with
              > > > modal=true.
              > > >
              > > > This is a problem only in IE (6 & 7) and not on Firefox and
              > Opera
              > > > where the autocomplete works fine, no matter the modal state of
              > the
              > > > panel. I've tryed all the possible combinations of queryDelay,
              > > > useIFrame, useShadow, minQueryLength, maxCacheEntries and on all
              > > > combinations the IE keeps to deny to show the autocomplete,
              > after the
              > > > hide action of a modal panel.
              > > >
              > > > It seems that the Autocomplete is not fired up, after the hide
              > action
              > > > of the modal panel, because on IE, it never enters at the
              > > > formatResult function.
              > > >
              > > > Any possible solution ?
              > > >
              > > > --- In ydn-javascript@yahoogroups.com, "jennykhan" <jennyhan@>
              > > > wrote:
              > > > >
              > > > > Hi there,
              > > > >
              > > > > By definition, your modal Panel instance should not allow
              > > > interaction
              > > > > with any other page elements, including AutoComplete. The
              > behavior
              > > > you
              > > > > are seeing is to be expected.
              > > > >
              > > > > Regards,
              > > > > Jenny
              > > > >
              > > > >
              > > > >
              > > > >
              > > > >
              > > > > --- In ydn-javascript@yahoogroups.com, "langzi.tech"
              > <langzi.tech@>
              > > > > wrote:
              > > > > >
              > > > > > if you have a autocomplete and a panel.
              > > > > > the modal of panel is true.
              > > > > >
              > > > > > if you show panel,then the autocomplete will can't show
              > dropdown
              > > > box.
              > > > > >
              > > > > > i test this issue in the yui's examples.
              > > > > >
              > > > > > if show panel1(modal=false),the autocomplete work fine.
              > > > > >
              > > > > > if show panel2(modal=true),the autocomplet work not fine.
              > > > > >
              > > > > > code:
              > > >
              > >
              >
            Your message has been successfully submitted and would be delivered to recipients shortly.