Jack
Jack

Reputation: 15872

Updating jQuery from 1.6 to 1.7 broke my code

I have recently updated jQuery from 1.6 to 1.7 and the following has stopped working:

Question:

None of the elements are being updated, is there something wrong with my code? Or am I using something which could have been affected through updating jQuery?

JavaScript function call to update a set of elements using jQuery:

function NGUIM_updateCard(data)
{      
  var id = data._id;
  var deadline = data.deadline;
  var description = data.description;
  var roi = data.roi;
  var sp = data.sp;
  var value = data.value;
  var type = data.type;
  var title = data.title;
  var developers = data.developers;

  console.log(
    id + "\n" +
    deadline + "\n" +
    description + "\n" +
    roi + "\n" +
    sp + "\n" +
    value + "\n" +
    type + "\n" +
    title + "\n" +
    developers + "\n"
  );

  var developerString = "";
  for(var i = 0; i < developers.length; i++)
  {
    if(i == 0){
      developerString += developers[i] + ',';
    } else {
      developerString += developers[i];
    }
  }

  var card = $("span[data-id="+id+"]").parent().parent();
      card.find('.card-title').text(title);
      card.find('.card-description').text(description);


  card.find('.card-attributes')
      .attr('data-deadline', deadline)
      .attr('data-sp', sp)
      .attr('data-value', value)
      .attr('data-roi', roi)
      .attr('data-devs', developerString);


  card.find('.card-attr-deadline').text(deadline);
  card.find('.card-attr-value').text("Value: " + value);
  card.find('.card-attr-sp').text("SP: " + sp);
  card.find('.card-attr-roi').text("ROI: " + roi);

  if(card.hasClass("improvement")){
    if(type == "fix"){
      card.removeClass("improvement")
          .addClass(type);
    } else if (type == "story"){
      card.removeClass("improvement")
          .addClass(type);
    }
  } else if (card.hasClass("fix")){
    if(type == "improvement"){
      card.removeClass("fix")
          .addClass(type);
    } else if (type == "story"){
      card.removeClass("fix")
          .addClass(type);          
    }
  } else {
    if(type == "fix"){
      card.addClass(type);
    } else if (type == "improvement"){
      card.addClass(type);
    }
  }
}

Console.logs output their expected values, however the elements aren't being updated. No errors are appearing inside the Chrome developer console.

Output from console.log(card);:

<li class="story">
  <header>
    <h1 class="card-title">abcd</h1>
    <p class="card-attr-deadline">10/10/2010</p>
    <span class="edit-card"></span>
    <span class="card-developers"></span>
    <span class="card-attributes" data-value="5" data-roi="1.00" data-sp="5" data-deadline="10/10/2010" data-id="0WndpeAmnzWRVQw15zizanU0" data-devs="a,brownj2"></span>
  </header>
  <section class="card-description">...</section>
  <p class="card-attr-sp">SP: 5</p>
  <p class="card-attr-value">Value: 5</p>
  <p class="card-attr-roi">ROI: 1.00</p>
</li>

Upvotes: 2

Views: 739

Answers (1)

Meligy
Meligy

Reputation: 36594

Try changing

card.find('.card-attributes')
  .attr('data-deadline', deadline)
  .attr('data-sp', sp)
  .attr('data-value', value)
  .attr('data-roi', roi)
  .attr('data-devs', developerString);

to

card.find('.card-attributes').first()
  .data('deadline', deadline)
  .data('sp', sp)
  .data('value', value)
  .data('roi', roi)
  .data('devs', developerString);

Upvotes: 2

Related Questions