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

Re: autocomplete, browser issues? IE/Safari

Expand Messages
  • jennykhan
    Oops, thanks for catching that, Dan. What would be really helpful is if you could post a link to a live instance of the problem page. If not then, perhaps you
    Message 1 of 9 , May 30, 2006
    • 0 Attachment
      Oops, thanks for catching that, Dan. What would be really helpful is
      if you could post a link to a live instance of the problem page. If
      not then, perhaps you could paste in all the relevant source code, not
      only to the HTML, but also the server side code that returns the JSON.
      Without a reproducible case to work with, I'm afraid I'm working blind.

      Thanks,
      Jenny

      --- In ydn-javascript@yahoogroups.com, "Dan Levine" <dslevine@...> wrote:
      >
      > Thanks again for the reply Jenny!
      >
      > I tried removing the extra commas with no change.
      >
      > BTW, the example on the page has extra trainling commas in the JSON
      example:
      > http://developer.yahoo.com/yui/autocomplete/index.html#json
      >
      > Dan
      >
      >
      > On 5/30/06, jennykhan <jennyhan@...> wrote:
      > >
      > > Hi Dan,
      > >
      > > Try removing the commas within each result object. Since each object
      > > only has one param/value pair, the comma is unnecessary. So, like
      this:
      > >
      > >
      > > {"ResultSet":
      > > {"Result": [
      > >
      > > {"keyword":"christian"},
      > >
      > > {"keyword":"christianity"},
      > >
      > > {"keyword":"christmas"},
      > >
      > > {"keyword":"christ"},
      > >
      > >
      > >
      > > Jenny
      > >
      > >
      > >
      > >
      > >
      > >
      > > --- In ydn-javascript@yahoogroups.com, "Dan Levine" <dslevine@> wrote:
      > > >
      > > > Hey Jenny,
      > > >
      > > > I tried setting the response Content Type to that with no change
      -- no
      > > > luck. I appreciate your reply though! There's obviously a HUGE
      > > queue of
      > > > questions coming through with this JS codebase. I'll include my
      > > JSON code
      > > > below and see if that triggers any thoughts:
      > > >
      > > >
      > > > {"ResultSet":
      > > > {"Result": [
      > > >
      > > > {"keyword":"christian",
      > > > },
      > > >
      > > > {"keyword":"christianity",
      > > > },
      > > >
      > > > {"keyword":"christmas",
      > > > },
      > > >
      > > > {"keyword":"christ",
      > > > },
      > > >
      > > > {"keyword":"christa belle",
      > > > },
      > > >
      > > > {"keyword":"christian right",
      > > > },
      > > >
      > > > {"keyword":"christmas cookies",
      > > > },
      > > >
      > > > ]}
      > > > }
      > > >
      > > >
      > > > Again, my schema init: var mySchema =
      ["ResultSet.Result","keyword"];
      > > >
      > > > Full code copied way down below...
      > > >
      > > > Thanks!
      > > >
      > > > dan
      > > >
      > > >
      > > >
      > > >
      > > > On 5/30/06, jennykhan <jennyhan@> wrote:
      > > > >
      > > > > Hi Dan,
      > > > >
      > > > > Perhaps there is something about your JSON response that is
      causing
      > > > > the problem. For the implementation examples, the server
      response MIME
      > > > > type has been set to "application/x-javascript" for JSON data.
      > > > >
      > > > > Hope that helps,
      > > > > Jenny
      > > > >
      > > > >
      > > > >
      > > > >
      > > > > --- In ydn-javascript@yahoogroups.com, "Dan Levine"
      <dslevine@> wrote:
      > > > > >
      > > > > > Thank you for releasing this suite of tools. I picked
      > > Autocomplete as
      > > > > > a feature to try out and see how quickly and easily it came
      > > together.
      > > > > > The short answer is: it almost all came together great, but
      when it
      > > > > > got stuck I wasn't sure how to debug. (CSS/DHTML debugging is
      > > > > > difficult enough when you write the source yourself!) So
      I'll post
      > > > > > here and see if maybe someone else has had this issue.
      > > > > >
      > > > > > It works fine on Firefox 1.5, but not on IE or Safari. The ajax
      > > call
      > > > > > *does* ping the server correctly, and recieve back correct
      results.
      > > > > > But from there I get no browser display except on Firefox.
      > > > > >
      > > > > > Any thoughts, or any recommendations for how to debug this
      type of
      > > > > > issue within the yahoo framework?
      > > > > >
      > > > > > client code snips below for my tagging widgets below.
      > > > > >
      > > > > > FORM:
      > > > > >
      > > > > > <form method="POST" action="/addTag.htm?obj_id=${object.id}">
      > > > > > <div id="searchdiv">
      > > > > > <input type="text" id="keywordInput" name="keyword"
      > > class="textBox">
      > > > > > <div id="searchshadow"><div
      id="searchContainer"></div></div>
      > > > > > </div>
      > > > > > <input type="submit" class="submitBut" value="add tag">
      > > > > > </form>
      > > > > >
      > > > > > JS includes + CSS styles:
      > > > > >
      > > > > > <%-- put this at the bottom of the page above the footer for the
      > > page
      > > > > > where the autocomplete lives --%>
      > > > > > <style type="text/css">
      > > > > > #searchdiv {position:relative; width: 200px;} /* set
      width of
      > > > > > widget here*/
      > > > > > #keywordInput {position:relative;}
      > > > > > #searchContainer
      > > > > > {position:relative;bottom:2px;right:2px;border:1px solid
      > > > > > #999999;background:#FFFFFF;font-size:13px; color: #666666;
      > > > > > overflow:hidden;display:none;}
      > > > > > #searchContainer ul {position:relative; margin: 0px;
      > > > > > width:200px;padding: 0px;list-style:none;}
      > > > > > #searchContainer li
      > > > > >
      > > > >
      > > > >
      > >
      > >
      {padding:2px;cursor:default;white-space:nowrap;display:list-item;color:#666666}
      > > > > > #searchContainer li.highlight {background:#316ac5;
      > > color:#FFFFFF}
      > > > > > #searchshadow
      > > > > >
      > >
      {position:absolute;width:100%;margin:2px;z-index:5;background:#cecece;}
      > > > > > </style>
      > > > > > <!-- Dependencies -->
      > > > > > <script src="/js/yui/build/yahoo/yahoo.js"></script>
      > > > > > <script src="/js/yui/build/dom/dom.js"></script>
      > > > > > <script src="/js/yui/build/event/event.js"></script>
      > > > > > <script src="/js/yui/build/connection/connection.js"></script>
      > > > > > <script src="/js/yui/build/animation/animation.js"></script>
      > > > > > <script
      > > src="/js/yui/build/autocomplete/autocomplete-min.js"></script>
      > > > > > <!-- -->
      > > > > >
      > > > > >
      > > > > > MY JS for YAHOO OBJECTS:
      > > > > >
      > > > > >
      > > > > > // An XHR DataSource
      > > > > > var myServer = "/tagQuery.htm";
      > > > > > var mySchema = ["ResultSet.Result","keyword"]; //["?", "|"];
      > > > > > //["ResultItem", "KeyDataField"];
      > > > > > var myDataSource = new YAHOO.widget.DS_XHR(myServer, mySchema);
      > > > > >
      > > > > >
      > > > > > // Increase the cache size
      > > > > > //myDataSource.maxCacheEntries = 60
      > > > > >
      > > > > > // Match case sensitivity
      > > > > > myDataSource.queryMatchCase = false;
      > > > > >
      > > > > > // Match results that *contain* the query string as well as
      results
      > > > > > that start with query string
      > > > > > myDataSource.queryMatchContains = false;
      > > > > >
      > > > > > // Match results of query strings that are *subsets* of the
      current
      > > > > > query string
      > > > > > // myDataSource.queryMatchSubset = true;
      > > > > >
      > > > > > // Will now send http://url?key=foo
      > > > > > myDataSource.scriptQueryParam = "key";
      > > > > >
      > > > > > YAHOO.widget.AutoComplete.prototype.formatResult =
      > > > > > function(aResultItem, sQuery) {
      > > > > > var sResult = aResultItem[0];
      > > > > > if(sResult) {
      > > > > > return sResult;
      > > > > > }
      > > > > > else {
      > > > > > return "";
      > > > > > }
      > > > > > };
      > > > > > var myAutoComp = new
      > > > > > YAHOO.widget.AutoComplete('keywordInput','searchContainer',
      > > > > myDataSource);
      > > > > > // comas may delimited queries...
      > > > > > myAutoComp.delimChar = ",";
      > > > > > // Require user to type at least 1 characters before triggering
      > > a query
      > > > > > myAutoComp.minQueryLength = 1;
      > > > > > // Container will expand and collapse vertically
      > > > > > myAutoComp.animVert = false;
      > > > > > // Container will expand and collapse horizontally
      > > > > > myAutoComp.animHoriz = false;
      > > > > >
      > > > >
      > > > >
      > > > >
      > > > >
      > > > >
      > > > >
      > > > >
    Your message has been successfully submitted and would be delivered to recipients shortly.