jQuery Forum

See http://myownmealplanner.com/mealplans/add/5 for the example

If you drag a meal tile to the right side of the page then it should stay there after you click on <a href="/mealplans/add">Go back to list of meal tiles</a> but of course it doesn't because the entire page gets refreshed. I tried adding an anchor for just the mealplan tiles (like a back to top button) but still the entire page gets refreshed. I can't think of any way to do this with jquery, javascript or php. Any ideas? You're supposed to be able to add tiles from the 500 calorie list and then for example the 300 cal list. Right now I only have 500 calorie tiles but you can see how it's supposed to work. This was made with the cakephp framework but it's principally the same as for a normal website. 

I'm trying to add all of the calorie contents in my javascript like this:

total = parseFloat(myInt1 + myInt2 + myInt3);

$('#response').append(total);

Instead of adding the variables they get concatenated. I've tried using parseInt, parseFloat, and Number but I still just get concatenation and not addition. Please look at the view source at http://maureenmoore.com/momp_112412/121912_800.html

At http://maureenmoore.com/momp_112412/112412.html I am trying to make an array of the divs that were dragged into the droppable box. Please see the view source. 

I use $.post to send the divs to the php file process.php and it gives me 1 to 3 arrays depending on how many divs I dragged instead of just one combined array. I want to push the $_REQUEST object (i.e., the dropped div) into an array using 

but it gives me 1 to 3 arrays each with the key of zero. How do I get one array out of for example 3 dragged divs?

I want the ids of the draggable divs to show up as a comma separated list in the alert button if they were dropped into the droppable_box. Instead there is an alert for each dragged div one after the other instead of as one list. 

<script type="text/javascript">

   $(document).ready(function(){

    $( "#draggable1" ).draggable({ grid: [ 20,20 ] });

    $( "#draggable2" ).draggable({ grid: [ 20,20 ] });

$( "#draggable3" ).draggable({ grid: [ 20,20 ] });

 

        $( "#droppable_box" ).droppable({

  

            drop: function( event, ui ) {

        var currentId = $(ui.draggable).attr('id');

var stuff = [];

$.each($(ui.draggable), function(i,e) {

  stuff.push(e.id);

});

var energy = stuff.join(", ");

var data = "X-Requested-With=XMLHttpRequest";

$('#myId').click(function(){

$.post (

"process.php",

data,

function(data)

{

alert(energy);

},

'html'

);

});

}

});

});

</script>

In the html there are 3 draggable divs

<div id="draggable1" class="draggable_meal"></div>

<div id="draggable2" class="draggable_meal"></div>

<div id="draggable3" class="draggable_meal"></div>