Question

I run this jquery code inside sharepoint webpart and got this error on the webpage at runtime as object doesn't support this property or method in javascript

I have properly added reference to the js files.

    <script src="../../Style Library/Styles/jquery-1.7.1.js" type="text/javascript"></script>
    <script type="text/javascript" src="../../Style Library/Styles/jquery.imagemapster.min.js"></script>
<script>
     $(document).ready(function () {
            var image = $("#ImageMap1");
            image.mapster({
                fillOpacity: 0.4,
                fillColor: "d42e16",
                stroke: true,
                strokeColor: "3320FF",
                strokeOpacity: 0.8,
                strokeWidth: 4,
                singleSelect: true,
                mapKey: 'shape',
                listKey: 'shape'
            });
</script>

I think it is because of id of the control getting rendered, i tried to pass client id but still i get the same issue and it doesn’t work. The above jquery works fine if used on normal asp.net application

Anyone help me.

Answer 1

Try to wrap you script like this :

ExecuteOrDelayUntilScriptLoaded(
    function() {
        $(document).ready(function () {
            var image = $("#ImageMap1");
            image.mapster({
                fillOpacity: 0.4,
                fillColor: "d42e16",
                stroke: true,
                strokeColor: "3320FF",
                strokeOpacity: 0.8,
                strokeWidth: 4,
                singleSelect: true,
                mapKey: 'shape',
                listKey: 'shape'
            });
    }

, "sp.js");

this will wait for the SharePoint javascript mess stuff to be loaded and executed