On 21/02/07, [EMAIL PROTECTED] <[EMAIL PROTECTED]> wrote:
>
> > -------Original Message-------
> > From: Chris Ovenden <[EMAIL PROTECTED]>
> > Subject: Re: [jQuery] How to get the ID of the parent node?
> > Sent: Feb 21 '07 16:04
> >
> > On 2/21/07, SAM COLLETT <[LINK: mailto:[EMAIL PROTECTED]
> > [EMAIL PROTECTED]> wrote: On 21/02/07, [LINK:
> > mailto:[EMAIL PROTECTED] [EMAIL PROTECTED] <[LINK:
> > mailto:[EMAIL PROTECTED] [EMAIL PROTECTED]> wrote:
> > > Hi,
> > >
> > > Following up from a question I asked yesterday, I wanted to get the
> > closest parent DIV given an arbitrary nested element. But when I request
> > the ".id" of that element, i repeatedly get an "undefined" message, even
> > though this call, "$(this).parent(" div.sidebarToDo")" yields an object.
> > >
> > > $('#todoList
> > a.deleteTDItem').each(function(index) {
> > > var divId =
> > $(this).parent("div.sidebarToDo").id;
> > > alert(divId); // alwasy gives
> > 'undefined'
> > > $(this).click = function() { $('#' +
> > divId).remove(); };
> > > });
> > >
> > > This is the HTML in question:
> > >
> > > <div class="sidebarToDo" width="100%" id="dToDo3">
> > > <table cellpadding="0" cellspacing="0" border="0" width="100%">
> > > <tr>
> > > <td><input id="cbTdId3" onClick="var textDecor = (this.checked ?
> > 'line-through' : 'none');
> > $('#textId3').css('text-decoration', textDecor);"
> > type="checkbox" id="tdcb3" ></td>
> > >
> > > <td id="textId3" class="sidebarText" style="text-decoration:
> > none">Start Work</td>
> > > <td align="right"><a class="editTDItem" href='#'><img
> > src="images/edit.gif" alt="Edit" border="0"></a></td>
> > > <td align="right"><a class="deleteTDItem"
> > href="javascript:toggleDiv('dToDo3');"><img
> > src="images/deleteLink.gif" alt="Delete" border="0"></a></td>
> > > </tr>
> > > </table>
> > > </div>
> > >
> > > Thanks, - Dave
> >
> > You can get the id via attr:
> >
> > $(this).parent("div.sidebarToDo").attr("id")
> >
> >
> > To spell it out a little more clearly, the API for attributes has changed
> > in jQuery 1.0.3+ and shortcuts like .id() no longer work
> >
> > --
> > Chris Ovenden
> >
> > [LINK: http://thepeer.blogspot.com] http://thepeer.blogspot.com
> > "Imagine all the people / Sharing all the world"
>
> Thanks, but I'm still getting "undefined" even though I can an object for my
> reference to the DIV. Any ideas on how to troubleshoot? here's the JS:
>
> $('#todoList a.deleteTDItem').each(function(index) {
> var divId =
> $(this).parent("div.sidebarToDo").attr("id");
> alert($(this).parent("div.sidebarToDo") + " id:" +
> divId);
> $(this).click = function() { $('#' + divId).remove();
> };
> });
>
I would have thought that would have worked.. you could always try:
$(this).parent("div.sidebarToDo")[0].id
I think I have an idea of what you are trying to do - hide the todo
item when delete is clicked, and put a line through the task if the
checkbox is checked (i.e. task completed). In that case, the HTML can
be tidied up a bit (I've removed the id's to improve readability, and
also noticed that you had two defined on the checkbox):
<div class="sidebarToDo" width="100%" id="dToDo3">
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td><input type="checkbox" name="completed"></td>
<td class="sidebarText">Start Work</td>
<td align="right"><a class="editTDItem" href='#'><img
src="images/edit.gif" alt="Edit" border="0"></a></td>
<td align="right"><a class="deleteTDItem" href='#'><img
src="images/deleteLink.gif" alt="Delete" border="0"></a></td>
</tr>
</table>
</div>
And the following JavaScript used:
$('#todoList a.deleteTDItem').click( function() {
alert("clicked");
$(this).parent("div.sidebarToDo").remove();
return false;
});
$('#todoList :checkbox').click( function() {
var textDecor = (this.checked ? 'line-through' : 'none');
$(this).parent().find("td.sidebarText").css('text-decoration',
textDecor);
});
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
