AutoSuggest Styling not working in IE

conklirb's Avatar

conklirb

23 Jun, 2010 11:49 PM

I've downloaded your latest autoSuggest zip from your website. Everything works and looks great in FF and Chrome. IE works, but looks terrible. I've simplified it to this basic HTML.:



AutoSuggest Test



  1. 1 Posted by conklirb on 23 Jun, 2010 11:55 PM

    conklirb's Avatar

    Sorry, didn't indent the code, here it is:

    <html><head> 
    <link rel=stylesheet href='/css/autoSuggest.css' type='text/css'> 
    <script type='text/javascript' src='/js/jquery-1.3.2.min.js'></script>
    <script type='text/javascript' src='/js/jquery.autoSuggest.js'></script> 
    <script type='text/javascript'> 
    $(function() {
      $("[class*='autoS']").each(function() {
        var myJSONObj = eval('{items: [' + $(this).attr('value') + ']};');
        $(this).autoSuggest($(this).attr('AJAXURL'), {
          preFill: myJSONObj,
          selectedItemProp: "name",
          searchObjProps: "name",
          minChars: 2,
          asHtmlID: $(this).attr('class')
        });
      });
    }); 
    </script> 
    <title>Test</title></head>        
    <body>  
    <input name=test class='autoS' AJAXURL=../cgi-ldap/AULJ.cgi value='{ name: "conklin, robert b.", value: "12"}'>
    </body>
    </html>
    
  2. conklirb closed this discussion on 24 Jun, 2010 04:08 PM.

  3. conklirb re-opened this discussion on 24 Jun, 2010 04:08 PM

  4. 2 Posted by Peter Donker on 06 Sep, 2010 12:58 PM

    Peter Donker's Avatar

    Did anyone resolve this yet? I'm seeing the same thing.

    Peter

  5. 3 Posted by Eduo on 08 Feb, 2011 08:59 AM

    Eduo's Avatar

    Has anyone found a fix for this?

  6. 4 Posted by conklirb on 08 Feb, 2011 11:23 AM

    conklirb's Avatar

    I never got a response from Drew on this...

  7. 5 Posted by AdamElevate on 11 May, 2011 09:52 PM

    AdamElevate's Avatar

    I figured it out....
    you'll need to change line 341 in the function add_selected_item
    org_li.before(item.html('<span>'+data[opts.selectedItemProp]+'</span>').append(close));

    This will wrap the inside text in a span, leaving free text next to a floated item is not good for ie. Then you need to change the css on 2 things:
    ul.as-selections li.as-selection-item a.as-close {float: left;} and
    ul.as-selections li.as-selection-item span {float left}

    and bam you got a fix. Haven't tested in it in all browsers but ie 7/8 and Chrome work.

  8. 6 Posted by conklirb on 20 Jun, 2011 08:23 PM

    conklirb's Avatar

    Implemented your suggestions, and although it looks better, still isn't quite right. The elements do not stay in the input element. Once again, Chrome and FF are perfect. I'm using IE v8.0.6001... please see attached.

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Already uploaded files

  • IELooksBad.jpg 68.1 KB

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac