drayarms - Viewing Profile

drayarms's Profile User Rating:

Reputation: 3 Apprentice

Group:: Active Members
Active Posts:: 170 (0.23 per day)
Joined:: 18-May 11
Profile Views:: 1,002
Last Active:: Apr 06 2013 06:57 PM
Currently:: Offline

Previous Fields

Dream Kudos:: 0

drayarms has not set their status

Posts I've Made

In Topic: jQuery UI draggable problemI can't seem to understand where I went

Posted 29 Mar 2013

andrewsw, on 29 March 2013 - 01:12 PM, said:

Well both those links are correct and I just copied and ran the standard draggable sample-code:

<!doctype html>
 
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Draggable - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <style>
  #draggable { width: 150px; height: 150px; padding: 0.5em; }
  </style>
  <script>
  $(function() {
    $( "#draggable" ).draggable();
  });
  </script>
</head>
<body>
 
<div id="draggable" class="ui-widget-content">
  <p>Drag me around</p>
</div>
 
 
</body>
</html>

and it works fine. So, other than that I assume you are loading the jQuery firstly, before the UI library?, I would run this sample code yourself (to prove that it works) and compare it to your code.

You could re-post your current code..

I wouldn't use find():

    $('#box2').find('.card').
    // just use..
    $('#box2 .card').

[find() is unnecessary a lot of the time.]

Point taken about the use of find(); Thanks for that bit. As far as trying the standard draggable code goes, I already tied that and got the same "object has no method draggable" error. I copied it word for word straight from the test draggable site just like you have it on here, well with the exception of the <link rel="stylesheet" href="/resources/demos/style.css" /> line since it is not an absolute url. Here's a repost of my current code









<!DOCTYPE html> 


<html> 




	<head> 


		<script type = "text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"> </script>

		<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>



		<script type="text/javascript">


			$(document).ready(function(){


				function play(){


					$('#box2').find('.card').draggable({

						helper: 'clone',

    						cursor: 'pointer',

      						revert: true


					});




					$('#box1').droppable({

     						accept: '#box2 .card' 


					});


				}//End player go board function


				play();//Parse the function


			});//End document ready




		</script>



		<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> 


		<title>Test Draggable</title> 


	</head>




        <body>


		<div id = "box1" style = "height:200px;width:600px;background:green"> 

		</div>


		<div id = "box2" style = "height:200px;width:600px;background:orange">  

			<div> <img class = "card" src = "images/new_deck/11h.png"/> </div> 

		</div>


	</body>



</html>

In Topic: jQuery UI draggable problemI can't seem to understand where I went

Posted 29 Mar 2013
andrewsw, on 25 March 2013 - 03:37 PM, said:
```
<script type = "text/javascript" src="http://code.jquery.com/jquery-latest.js"> </script>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
```
are requests for two copies of the jQuery library.
I took care of the obvious problems(the redundant commas and the document ready method). Then I linked the following libraries

<script type = "text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"> </script>

<script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

This time around, I get an error message

Uncaught TypeError: Object [object Object] has no method 'draggable'

I'm now at a total loss. What's the right way to include the relevant jQui libraries? Anyone?
In Topic: jQuery UI draggable problemI can't seem to understand where I went

Posted 25 Mar 2013
andrewsw, on 25 March 2013 - 03:37 PM, said:
```
<script type = "text/javascript" src="http://code.jquery.com/jquery-latest.js"> </script>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
```
are requests for two copies of the jQuery library.
I see. Thanks for that.
In Topic: jQuery UI draggable problemI can't seem to understand where I went

Posted 25 Mar 2013
andrewsw, on 25 March 2013 - 12:29 AM, said:
You must only load one version of jQuery.

Remove the extra commas, such as the one at the end of this code:
```
        revert: true, // remove this comma, and the one further down
    });
```
Your play() function-call should occur within the document-ready event, as the elements will not be available until then. The first few pages of the jQuery documentation will tell you this. Or you could place your code at the bottom of the page, before the closing body tag.
Ok thanks for pointing out the extra commas and the absence of the document ready method. But I don't understand what you meant by only one version on jQ. Do I have versions up there?
In Topic: jQuery UI draggable problemI can't seem to understand where I went

Posted 24 Mar 2013

e_i_pi, on 24 March 2013 - 09:47 PM, said:
I imagine one of your primary problems is that you are loading the latest version of jQuery, as well as v1.9.1, as well as v1.5.2 via the file j.js. Try loading one instance of jQuery.

But don't I need those other two in order for the ui plugin to work at all? Or are you suggesting I delete the link to the latest version of jqeury?

My Information

Member Title:: D.I.C Head
Age:: Age Unknown
Birthday:: Birthday Unknown
Gender:

Contact Information

E-mail:: Click here to e-mail me

Friends

drayarms hasn't added any friends yet.

Comments

drayarms has no profile comments yet. Why not say hello?