Question

I'm having a hard time getting a value from the sibling of a checkbox. My click function sees the checkbox click, but then I get undefined for my variable. It doesn't matter if I declare it with var. I've tried siblings, children, children of siblings, with and without "input[name=info]" What's the obvious thing I'm missing? Thanks for the help.

Here's a fiddle: http://jsfiddle.net/charliemagee/eBZ9G/

<ul class="goalsinprogress goalsection">
  <li class="inprogress">
    <span class="goaltitle">study after dinner</span>
    <span class="goalstatus"><input type="checkbox"/></span>
    <span class="gatherinfo"><input type="text" name="info" class="info"/></span>
  </li>
  <li class="inprogress" data-info="['66','77']">
    <span class="goaltitle">keep locker tidy</span>
    <span class="goalstatus" data-goal="keep locker tidy"><input type="checkbox"/></span>
    <span class="gatherinfo"><input type="text" name="info" class="info"/></span>
  </li>
</ul>

$(".goalsinprogress").delegate("input[type=checkbox]", "click", function() {
  var newinfo = $(this).siblings().children().val();
  return console.log(newinfo + '  what the');
});
Was it helpful?

Solution

Try this, using .closest() to get the li parent and then .find() to get the input.info:

$(".goalsinprogress").delegate("input[type=checkbox]", "click", function() {
  newinfo = $(this).closest('li').find('input.info').val();
  console.log(newinfo + '  what the?');
  return updateStatus = 'completed';
});

Fiddle

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top