A community in which webmasters can ask for help with topics such as PHP coding , MySQL , IT jobs, web design, IT security.
Current location:homephp forumphp talk in 2009 yearOnly fetch output when element is not being dragged - page 1
User InfoPosts
Only fetch output when element is not being dragged#1
How could I change the code below so that when an element is being being dragged the script will stop fetching the output file until that element was released?

$(document).ready(function() {
//$(".draggable").draggable();
$(".draggable").draggable({ containment: (#container(, scroll: false });
$(".draggable").draggable({ stack: { group: (#container(, min: 1 } });

$("*", document.body).click(function (e) {
var offset = $(this).offset();// get the offsets of the selected div
e.stopPropagation();
var theId = $(this).attr((id();// get the id of the selceted div
$("#result").text(this.tagName + " id=" + theId + " (" + offset.left + "," + offset.top +")");
//post x,y to php (and the id of the elemnt)
$.post("http://localhost/index.php", "id=" + theId + "&x=" + offset.left + "&y=" + offset.top);
});

var req = function () {
$.ajax({
url: "out.php",
cache: false,
success: function(html){
$("#stuff").empty().append(html);
var css_attr = html.split(",");
$((#1().css((left(, css_attr[0] + (px().css((top(, css_attr[1] + (px();
},
complete: function(){
req();
}
});
};
req();
});


Note: This script is dependent on the following JavaScript sources:

jquery.js
http://jqueryui.com/latest/ui/ui.core.js
http://jqueryui.com/latest/ui/ui.draggable.js
http://jqueryui.com/latest/ui/ui.droppable.js


Anything Helps...Thanks.

posted date: 2009-04-11 20:33:00


Re: Only fetch output when element is not being dragged#2
I had made out the solution of this problem. click to view my topic...

hope that hepls.

posted date: 2009-04-11 20:33:01


Re: Only fetch output when element is not being dragged#3
Maybe you can associate it with the mouseup event?http://docs.jquery.com/Events/mouseup#fnInstead of associating the draggable object directly with the AJAX call, associate it with a trigger which you can use to activate the mouseleave.

posted date: 2009-04-11 21:03:00


Re: Only fetch output when element is not being dragged#4
Draggables has options to allow you to associate functions with the start and stop of the drag. (see http://api.jquery.com/, click jQuery UI at the top for docs). So you can use that and perhaps have a global boolean that gets set when the drag starts and unset when the drag ends. Have your req() function check this boolean and exit if it(s set. Something like:var halt_request = 0;$(".draggable").draggable({ containment: (#container(, scroll: false, start: function(){ halt_request = 1; }, stop: function(){ halt_request = 0; }});...var req = function () { if (halt_request) { sleep(10); // so you(re not looping too quickly req(); return; } $.ajax({ url: "out.php",...And better yet, instead of having req() call itself, have it use setTimeout. Have the timeout as a global and have the start/stop functions clear/set the timeout.

posted date: 2009-04-14 05:18:00


Re: Only fetch output when element is not being dragged#5
You can even take kbosak(s idea a bit further:var req = function () {...$(".draggable").draggable({ containment: (#container(, scroll: false, stop: req});In other words, create a draggable that calls the function "req" when dragging stops.Also, you can also totally rewrite this in a more standard form:function req () {...and it will be the exact same thing. Also, you can do:$(function() {instead of:$(document).ready(function() {and you can merge your two draggable calls. So ... if I were writing it, the final code would be:function req () { ...*insert code for req here*...};$(function() { $(".draggable").draggable({ containment: (#container(, scroll: false, stack: { group: (#container(, min: 1 }, stop: req }); $("*", document.body).click(function (e) { var offset = $(this).offset();// get the offsets of the selected div e.stopPropagation(); var theId = $(this).attr((id();// get the id of the selceted div $("#result").text(this.tagName + " id=" + theId + " (" + offset.left + "," + offset.top +")"); //post x,y to php (and the id of the elemnt) $.post("http://localhost/index.php", "id=" + theId + "&x=" + offset.left + "&y=" + offset.top); }); req();});

posted date: 2009-04-14 09:25:00


select page: « 1 »
Copyright ©2008-2017 www.momige.com, all rights reserved.