Google Maps MarkerClusterer v3 and jQuery autocomplete cause error

Question

I am trying to implement a Google Maps MarkerClusterer example and everything seems to be working fine, until I try to add a couple some jQuery autocomplete script. As soon as I include the following code, the MarkerClusterer stops working:

$(document).ready(function() {  
    $("#SaleCity").autocomplete( "../home/ajaxSelectCity/");
    $("#subjectproperty").autocomplete("../home/ajaxSelectSubject/");
}); 

These are the inputs on the page for the autocomplete:

  <input    type="text" 
        id="subjectproperty"                
            style="margin-left:0px;" 
            placeholder="Subject Property" 
            class="g2" />
  <input    type="text" 
        id="SaleCity" 
            placeholder="Municipality" 
            style="margin-left:0px;" 
            class="g2" 
            required 
            data-regex="^[a-zA-Z. ]+$">

The error message that I receive is:

Uncaught TypeError: Cannot read property 'autocomplete' of null

Can someone tell me what I am doing wrong? Thanks. The page in question can be found at results.ptax.ca

Answer 1

MarketClusterer must be overriding the default $ reference for jQuery. I had to pass the reference into the function like this:

jQuery(document).ready(function($) {      
  jQuery("#SaleCity").autocomplete( "../home/ajaxSelectCity/");
  jQuery("#subjectproperty").autocomplete("../home/ajaxSelectSubject/");
});

All good now.