Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jul 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Prototype/Scriptaculous Autocompleter IE Issue

    Hello all. I am attempting to add to the DOM using the following function, which utilizes Scriptaculous's Builder and Autocompleter libraries:

    Code:
    var add_number = 1;
    function addInput() {	
        if (add_number <= 4) {
            var element = Builder.node('div', [
                Builder.node('label'),
                Builder.node('input',
                    {type: 'text',
                     id: 'searchterm' + add_number,
                     className: 'text',
                     name: 'searchterm' + '[' + add_number + ']'}),
                Builder.node('div', { id: 'hint' + add_number, className: 'autocomplete' }),
                Builder.node('input',
                    {type: 'hidden',
                     id: 'class_id' + add_number,
                     name: 'class_id' + '[' + add_number + ']'}),
            ]);
            var js = Builder.node('script');
            // the following must be done to appease IE, since IE does not like appending <script>s to the DOM
            js.type = 'text/javascript';
            js.text = 'new Ajax.Autocompleter("searchterm' + add_number + '", "hint' + add_number + '", "class_search.php", {minChars: 2, afterUpdateElement : getSelectedId' + add_number + ', parameters : \'num=' + add_number + '\'}); function getSelectedId' + add_number + '(text, li) { $(\'' + 'class_id' + add_number + '\').value=li.id; }';
            var rlink = Builder.node('a', { href: '#' }, 'Remove');
            rlink.onclick = function() {$(element).remove(); add_number--;}
            element.appendChild(js);
            element.appendChild(rlink);
    
            $('moreClasses').appendChild(element);
            add_number++;
        }
    }
    This function is used to add up to 4 text inputs to the page, each creating a new Ajax.Autocompleter. This code works great in Firefox and Safari, but in IE, the Autocompleter is messed up. I tried rewriting the function using Javascript's DOM functions (createElement, setAttribute, etc.), but had the same problem. Any suggestions? Thanks in advance!

    -JoeT

  • #2
    Senior Coder
    Join Date
    Sep 2005
    Posts
    1,791
    Thanks
    5
    Thanked 36 Times in 35 Posts
    you don't need to insert a new script tag, you can just create the autocompleters along with the rest of your code
    My thoughts on some things: http://codemeetsmusic.com
    And my scrapbook of cool things: http://gjones.tumblr.com

  • #3
    New to the CF scene
    Join Date
    Jul 2008
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I got it, thanks!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •