[jquery] drag en drop na load()
Quote:
deze ga ik snel even goed maken, maar eerst de jquery draaien krijgen
Ik zou eerst het doctype toevoegen en dat goed maken en dan pas naar JS kijken. Vaak is het zo dat JS niet goed werkt doordat er een doctype mist.
Gewijzigd op 06/01/2013 00:20:58 door Wouter J
Wouter J op 06/01/2013 00:19:18:
PHP knipper, kun je toch een voorbeeldje maken met het gebruik van draggable erin? Dan kan ik misschien achterhalen wat er mis is gegaan.
Ik zou eerst het doctype toevoegen en dat goed maken en dan pas naar JS kijken. Vaak is het zo dat JS niet goed werkt doordat er een doctype mist.
Quote:
deze ga ik snel even goed maken, maar eerst de jquery draaien krijgen
Ik zou eerst het doctype toevoegen en dat goed maken en dan pas naar JS kijken. Vaak is het zo dat JS niet goed werkt doordat er een doctype mist.
uiteraard maak ik eerst mijn css goed ( en de doctype blijft natuurlijk ook staan "sla goede raad nooit in de wind" )
ik ga proberen op de home (het groot rechter veld dat ook wordt geladen met de load) de code van de html te zetten en de jquery na de load weer.
Toevoeging op 06/01/2013 00:37:23:
css, html en jquery is toegevoegd
Code (php)
1
GET 404 | http://codejqu+ery.com/ui/1.9.2/themes/base/jquery-ui.css
Wat als je nou jQuery UI download (wat ik bij UI sowieso aanraad) en die gebruikt?
Sorry, had het zelf niet door, ik was aan het zien of die css niet rommelde met mijn css maar was vergeten die + er weer af te halen. Uiteraard veranderd.
Nu zitten alles (jquery + html) waar het zou moeten zitten maar het werkt nog steeds niet
jquery ==> in de head zijn ze geinclude en in mijn jquery zit de drag en drop code
html ==> in de startpagina het onderste item heb ik de html code geplaatst.
en wat moet ik nu doen? ik weet zelf niet wat er fout gaat bij de jquery ui?
Wat raad u aan?
Gewijzigd op 06/01/2013 17:09:57 door php knipper
ik zit zelf ook naar een mogelijke oplossing te zoeken en ook al naar alternatieven. Echter lukt het me gewoon niet om het drag en drop aan de praat te krijgen, Als dat zou lukken zou ik weer verder kunnen.
Gewijzigd op 07/01/2013 18:52:51 door php knipper
Breng anders alles terug naar de code van 1 van de 2 demo's van mij, werkt het dan wel?
RobertJan Keizer op 05/01/2013 23:19:47:
Maar kijk dit is een werkende code:
nou dan kunt u deze toch in stapjes uitbreiden naar wat u wil.
dan kunt u precies vertellen wat er fout gaat en kunnen wij u antwoorden wat er misschien fout zou gaan.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Droppable - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<style>
#draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
#droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
</style>
<script>
$(function() {
$( "#draggable" ).draggable();
$( "#droppable" ).droppable({
drop: function( event, ui ) {
$( this )
.addClass( "ui-state-highlight" )
.find( "p" )
.html( "Dropped!" );
}
});
});
</script>
</head>
<body>
<div id="draggable" class="ui-widget-content">
<p>Drag me to my target</p>
</div>
<div id="droppable" class="ui-widget-header">
<p>Drop here</p>
</div>
</body>
</html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Droppable - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<style>
#draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
#droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
</style>
<script>
$(function() {
$( "#draggable" ).draggable();
$( "#droppable" ).droppable({
drop: function( event, ui ) {
$( this )
.addClass( "ui-state-highlight" )
.find( "p" )
.html( "Dropped!" );
}
});
});
</script>
</head>
<body>
<div id="draggable" class="ui-widget-content">
<p>Drag me to my target</p>
</div>
<div id="droppable" class="ui-widget-header">
<p>Drop here</p>
</div>
</body>
</html>
nou dan kunt u deze toch in stapjes uitbreiden naar wat u wil.
dan kunt u precies vertellen wat er fout gaat en kunnen wij u antwoorden wat er misschien fout zou gaan.
Wouter dat zei ik ook al hoor
Maar het is nu al 2 keer voorgekomen dat ik wat zeg en dat hij het pas doet als jij het zegt. Alleen beetje vreemd?
Ben ik dan niet duidelijk genoeg? Ik vraag het me gwn af hoor.
Gewijzigd op 07/01/2013 20:39:12 door Keizer Webdesign
tevens krijg ik de volgende error en na wat zoeken zou de fout zijn dat jquery niet wordt ingeladen
Code (php)
1
Uncaught TypeError: Object [object Object] has no method 'draggable'
Gewijzigd op 07/01/2013 20:58:50 door php knipper