CODEWITHSUNDEEP
jqueryasp.net
Karthik
Karthik

Reputation: 2399

'$' is undefined javascript error

<script type="text/javascript">
    $(function() {
        $('#WaterMark').draggable(
                    {
                        start: function(e, ui) {
                        },
                        cursor: 'move',
                        zIndex: 2700,
                        revert: 'invalid',
                        containment: '#OriginalImageContainer'
                    });
        $('#OriginalImage').droppable({
            hoverClass: 'DroppableOver',
            drop: InitializeWaterMark
        })
    });

    var InitializeWaterMark = function() {
        var position = $('#WaterMark').position();
        var imgPosition = $('#OriginalImageContainer').position();
        document.getElementById('xpos').value = position.left - imgPosition.left;
        document.getElementById('ypos').value = position.top - imgPosition.top;

    }
    </script>

this is a sample javascript code i got regarding drag and drop of images in a asp.net webpage...But it returns a error stating '$' is undefined..please help me out

Upvotes: 3

Views: 11140

Answers (3)

Tim B James
Tim B James

Reputation: 20364

Include your jQuery and jQuery UI scripts in the page. I tend to use the jQuery and jQuery UI files from a CDN (Content Delivery Network) http://www.asp.net/ajaxlibrary/cdn.ashx Also I have a backup for when the CDN might be down.

<script src="//ajax.aspnetcdn.com/ajax/jquery/jquery-1.6.2.min.js"></script>
<script> window.jQuery || document.write('<script src="/scripts/jquery-1.6.2.min.js"><\/script>')

Then the same with the jQuery UI library.

If the CDN goes down, then it checks to see if jQuery exists and will then use the local version if not.

Upvotes: 2

Phil.Wheeler
Phil.Wheeler

Reputation: 16848

At a guess, I'd say you were missing the library to support that script (probably jQuery).

You need to include a reference to the JavaScript framework in order to get the draggable functionality you're looking for.

Try adding the following to your page (before the script block in your example):

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.7.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/jquery-ui.js"></script>

Upvotes: 5

Niranjan Singh
Niranjan Singh

Reputation: 18290

if it is jquery include problem then put this tag in head of your aspx page and edit the src attribute in the script tag to point to your copy of jquery.js. For example, if jquery.js is in the same directory as your HTML file, you can use:

You can download your own copy of jQuery from the Downloading jQuery page

if you have done correct then explain the scenario little more..

Upvotes: 1

Related Questions