Click here to Skip to main content
13,043,092 members (52,121 online)
Rate this:
Please Sign up or sign in to vote.
See more:
I want to use drag and drop javascript function but want to put condition in this javascript.

I will count a area or column from mysql database.
And javascipt drag and drop function will run this count times

for ex: from database count=3 javascript drag and drop run 3 times not run greater than 3.not dropped or not draggin

how can I do?
İs there any javascript code?(conditional drag and drop)

thanks a lot.
Posted 21-Jan-13 22:15pm

1 solution

Rate this: bad
Please Sign up or sign in to vote.

Solution 1

The Logic is will be as follows

1. Store the number of iteration fetched from mysql in a javascript variable.
2. Declare a javascript counter which will be incremented for each set of drag and drop.
3. Compare the number of interation from mysql with the drag and drop counter variable after the completion of each drop event and if both values got matched then unbind the particular drag and drop event from the control. Something like this

if(iteration_variable == counter_variable){
//... Code to unbind the drag-drop event

I hope this might work. If you can post the code snippets of the partcular javascript function then I can help you apply the same logic in your code.

Please let me know if the above logic is useful for you.

Happy Programming.
Member-2338430 22-Jan-13 4:34am
$(function() {
$( "#draggable" ).draggable();
$( "#droppable" ).droppable({
drop: function( event, ui ) {
$( this )
.addClass( "ui-state-highlight" )
.find( "p" )
.html( "Dropped!" );

<div id="draggable" class="ui-widget-content">
<p>Drag me to my target</p>

<div id="droppable" class="ui-widget-header">
<p>Drop here</p>


for ex here
Member-2338430 22-Jan-13 4:38am
there are js libraries
A Patra 22-Jan-13 4:49am
$(function() {
var drop-cnt = 0;
var iteration-cnt = @Model.DataIteration;//Replace the @Model.DataIteration with your logic to get the mysql fetched value

$( "#draggable" ).draggable();
$( "#droppable" ).droppable({
drop: function( event, ui ) {

if(drop-cnt <= iteration-cnt){
$( this )
.addClass( "ui-state-highlight" )
.find( "p" )
.html( "Dropped!" );
//unbinding the events

This might work for you. Please let me know what are the outcomes for this.
Member-2338430 22-Jan-13 4:57am
thank you for this I will try
A Patra 22-Jan-13 5:00am
If you found this answer as useful then please mark is as correct.

Member-2338430 22-Jan-13 7:58am
I assign iteration-cnt =3
this is not a answer because after first drag second drag and third drag not running may be page must be refresh every drag but if page refresh count again start and drop-ct=0 not goes to iteration count these are anytime equal..
Avishek Pat 22-Jan-13 23:12pm
Are you refreshing your page in each drag and drop? If so then the counter will reset so you cannot take a count the number of iteration values for each movement. I suggest you not to do the refresh operation instead of that you can call an ajax call operation if you require some server side operation after each drop. Else you can put the iteration values in session so the iteration values wont get resetted.

Please let me know if that helps.
Member-2338430 23-Jan-13 2:48am
how to do that each drag and drop I will count how many times I draged and droped
so if 3 times draged and droped alert ok this is 3 times so willnot drag and drop
Member-2338430 23-Jan-13 2:49am
really this is very important for mee I didnt do
Avishek Pat 23-Jan-13 3:10am
When you're dragging or dropping then is your counter is getting incremented for each iteration ? like for first drop its 1 for second iteration its 2 and so on ? And you are sure the page is not making any postback event ?

Please let me know the same so I can share some more other options.
Member-2338430 23-Jan-13 4:30am
yes page not making any postback
Member-2338430 23-Jan-13 4:44am
increment after every dropped dropcnt++ but first dropped it says only dropped nothing do anythink
again must be previus version again you will drag and drop so on
how long dropcnt=iterationcnt so break I think every drag and drop it must be previous version (not drag and drop state increment dropcnt)but how to restore previous version without page refresh

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month

Advertise | Privacy | Mobile
Web02 | 2.8.170713.1 | Last Updated 22 Jan 2013
Copyright © CodeProject, 1999-2017
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100