2

I'm trying to implement the https://github.com/googlemaps/js-store-locator into a website, however something really strange seems to occur. When I load the Jquery file

<script src="<?php echo $this->getSkinUrl(); ?>js/jquery/2.1.3/jquery.min.js"></script>

the functionalities seem to work, (it loads the data) but it messes up other JS and with that, my layout. On top of that, it returns errors. I've used all of the exact same files from the store locator github.

![working but broken layout (showing searchbar and store selector so everything shows lower than it should][1]

![not fully functioning but showing correct layout][2]

So the upper image shows correct functionality but wrong layout(all of the sudden my storeselector and search bar show up) And the lower image is the correct layout, but it doesn't return any data/markers.

Does anybody have any idea what could cause this? By the way, Jquery is already loaded by default through page.xml. So in fact adding the jquery is twice which is probably why it crashes.

1

There are multiple possible issues here, and possibly more than one of them at the same time.

First of all, as you have already said that jQuery is being loaded twice, this is a likely first issue to resolve. Be aware that you may encounter errors if the libraries you are using depend on specific jQuery versions. One way you can mitigate this is using jQuery Migrate (https://github.com/jquery/jquery-migrate).

Also, ensure that jQuery noConflict mode is being used. Without this, the jQuery will conflict with the default Prototype library as they both define the $ for different purposes.

From what you have said, it sounds very much like the latter case, however both of the above can cause similar issues.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.