• Divyesh Lotia
  • NEWBIE
  • 0 Points
  • Member since 2014

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 0
    Questions
  • 1
    Replies

I am trying to create an autocomplete field on a Visualforce page using jQuery autocomplete. Everything works fine in Firefox and Chrome. Everything works fine in IE, until some other AJAX calls make it onto the page (i.e. putting a rerender attribute on a commandButton, adding an actionRegion tag, etc) I'm not sure why. I'm getting no javascript errors in Firefox or IE. Anyone have any ideas or a workaround?

 

Here's some sample code:

 

 

<apex:page controller="TestController">

	<apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-1.4.2.min.js')}" />
	<apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.8.5.custom.min.js')}" />
    <apex:stylesheet value="{!URLFOR($Resource.jQuery, 'css/cupertino/jquery-ui-1.8.5.custom.css')}"/>

	<script type="text/javascript">
	var j$ = jQuery.noConflict();
	
    j$(function() {  

        j$("#autoc").autocomplete({
        
            source: function(request, response) {
                    j$.getJSON("{!$Page.lookup}", {
                        term: request.term
                    }, response);
                },
        minLength: 2
            
        });
    });
    </script>

<apex:form >

    <apex:sectionHeader title="jQuery Test" />

    <apex:pageblock id="pb">
		<apex:pageBlockSection title="Block One">
			Account Autocomplete: <input type="text" id="autoc" />
			<apex:commandButton value="Do Something" action="{!doSomething}" rerender="pb" />
		</apex:pageBlocksection>
    </apex:pageblock>
    
</apex:form>
</apex:page>

The lookup page just returns JSON formatted data based on the entered text.

 

Take away the rerender attribute on the button and everything works fine in all browsers. Add it back and it fails only in IE.

 

  • October 08, 2010
  • Like
  • 0