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

A Bug:AutoComplete And Modal's Panel

Expand Messages
  • langzi.tech
    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
    Message 1 of 7 , Dec 12, 2006
    • 0 Attachment
      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, By definition, your modal Panel instance should not allow interaction with any other page elements, including AutoComplete. The behavior you are
      Message 2 of 7 , Dec 28, 2006
      • 0 Attachment
        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>
        >
      • 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 3 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 4 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 5 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 6 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 7 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.