On 21/02/07, Sam Collett <[EMAIL PROTECTED]> wrote:
> 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;
> });
That should be:
$('#todoList a.deleteTDItem').click( function() {
$(this).parents("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/