CODEWITHSUNDEEP
javascriptjquery
user3618198
user3618198

Reputation: 1

jquery function doesn't trigger

My resizeAreas function doesn't trigger in $(document).ready function. Here's the link to the app. I have also tried $(document).load but same result.

This problem is not consistent. But most of the time the page doesn't load correctly. If the list of task have the same height and 4 equal(as height) lists on the row then they are loaded correctly else they're not. To make sure that you see how it must look you can move a task element from one list to another. I don't have the reputation to post images.

Here is most of the javascript code: 

function makeDropArea() {
  var widthArea = $(".taskListing").width() / 2 - 55;
  var heightArea = $(".taskListing").height(); 

  $('.dropArea').width(widthArea);
  $('.dropArea').css('margin-left', 5 + 'px');
  $('.generalInfo').css('margin-left', 5 + 'px');
  $('.generalInfo').css('width', widthArea * 2 + 220 - 45);
  $('.subTaskHeader').css('width', widthArea + 25);
}

function makeDropElement(){
  var widthEl = $('.dropArea').width() + 25 ;
  $('.task').width(widthEl);
}

function taskListingSize(){

  var width = getWidth();
  var height = getHeight() * 80 / 100;
  $('.taskListing').css('width', width);
}


function resizeAreas() {
   $('.taskListing').each(function(){  

     var highestBox = 0;
     $('.dropArea', this).each(function(){

       if($(this).height() > highestBox) 
         highestBox = $(this).height(); 
     });  

     $('.dropArea',this).css('min-height', highestBox);  
   });    
}

$(document).ready(function () {
  menu();
  taskListingSize();
  makeDropArea();
  makeDropElement();
  resizeAreas();  //<-- this is the one with the problems

  $(".dropArea").resize(resizeAreas());

  $( window ).resize(function() {
    taskListingSize();
    makeDropArea();
    makeDropElement();
  });
});

Thanks.

Update 1:

I've done some more testing and this bug is only on chrome and firefox but not on IE. The problem appears only on the openshift platform.

Upvotes: 0

Views: 89

Answers (2)

fat fantasma
fat fantasma

Reputation: 7613

I think it should be

 $(".dropArea").resize(resizeAreas);

Or

 $(".dropArea").resize(function(){
       resizeAreas();
  });

Upvotes: 0

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167172

Either change:

$(".dropArea").resize(resizeAreas());

To:

$(".dropArea").resize("resizeAreas");

Or:

$(".dropArea").resize(function(){
  resizeAreas();
});

Upvotes: 1

Related Questions