Highlighted

jQuery 3: get sibling of a parent

LEGEND ,
May 29, 2018

Copy link to clipboard

Copied

Hello, all,

Trying to get the sibling of a parent, and keep getting a "not defined" message.

<span><button type="button" class="delBtn">DELETE</button></span>

<span>Results</span>

...

$('.delBtn').click(function(){

     $.post("components/APP.cfc?method=deleteUser",{user_id: "{a users id}"}).done(function(data){

                                                                              alert($(this).parent().siblings().length); // Always reports length of zero

                                                                              });

     });

I do not see where I am going wrong, here.  Please help.

V/r,

^ _ ^

Views

356

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

jQuery 3: get sibling of a parent

LEGEND ,
May 29, 2018

Copy link to clipboard

Copied

Hello, all,

Trying to get the sibling of a parent, and keep getting a "not defined" message.

<span><button type="button" class="delBtn">DELETE</button></span>

<span>Results</span>

...

$('.delBtn').click(function(){

     $.post("components/APP.cfc?method=deleteUser",{user_id: "{a users id}"}).done(function(data){

                                                                              alert($(this).parent().siblings().length); // Always reports length of zero

                                                                              });

     });

I do not see where I am going wrong, here.  Please help.

V/r,

^ _ ^

Views

357

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
May 29, 2018 0
LEGEND ,
May 30, 2018

Copy link to clipboard

Copied

Looks to me as though you're trying to do someting like below?

<div class="delete">

<button class="delBtn">Delete</button>

<p>Sibling 1</p>

<p>Sibling 2</p>

<p>Sibling 3</p>

<p>Sibling 4</p>

</div>

<!-- end delete -->

<div class="response"></div>

JQuery:

$(document).ready(function(){

$(".delBtn").click(function(){

var count = $(this).parent().children().length-1;

alert(count);

$.post({

url: "get_info.php",

data: {count: count},

success: function(response){

$(".response").html(response);

}

});

});

});

get_info.php: (I know you use CF but it will give you an idea.

<?php

$count = $_POST['count'];

echo $count;

?>

Just to clarify a 'sibling' is an element that FOLLOWS, NOT one which is INCLUDED, that's a child/children. So asking to return the number of siblings in a parent isnt going to work as they are children.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 30, 2018 0
LEGEND ,
May 30, 2018

Copy link to clipboard

Copied

osgood_  wrote

Looks to me as though you're trying to do someting like below?

No.  If you take a closer look at my pseudo-code, there are two spans that are siblings.  The first one contains a button that when clicked is supposed to delete a user from a database.  The second one will display the returned results from the function that deletes the user.

I can't use ID for this because there will be more than one, and it's dynamically created.  That's why I'm trying to go the parent/sibling route.  My logic is "click the button, delete the user, and display returned value in sibling of parent of button clicked."  But I don't see where I've gone agley.

V/r,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 30, 2018 0
LEGEND ,
May 30, 2018

Copy link to clipboard

Copied

WolfShade  wrote

osgood_   wrote

Looks to me as though you're trying to do someting like below?

No.  If you take a closer look at my pseudo-code, there are two spans that are siblings.  The first one contains a button that when clicked is supposed to delete a user from a database.  The second one will display the returned results from the function that deletes the user.

I can't use ID for this because there will be more than one, and it's dynamically created.  That's why I'm trying to go the parent/sibling route.  My logic is "click the button, delete the user, and display returned value in sibling of parent of button clicked."  But I don't see where I've gone agley.

V/r,

^ _ ^

I dont think you can pass a  $.POST unless you get it back from the coldfusion page dynamically.

If you call for the length of the siblings outside of the $.POST function youll get your answer back.

Plus you can use id:

<button class="delBtn" data-id="<?php echo $row['id']; ?>">Delete</button>

<button class="delBtn" data-id="<?php echo $row['id']; ?>">Delete</button>

<button class="delBtn" data-id="<?php echo $row['id']; ?>">Delete</button>

var id = $(this).attr('data-id');

Pass the id to the cf page and delete it from the database? Then get the response and pass it back to 'results'? Is that not doable?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 30, 2018 1
LEGEND ,
May 30, 2018

Copy link to clipboard

Copied

osgood_  wrote

If you call for the length of the siblings outside of the $.POST function youll get your answer back.

It took me a while, but you did give me a nudge in the right direction.  I defined the sibling span outside of the $.post(), before it, and then used the var to indicate which sibling was supposed to receive/display the return message from the server.

Thanks!

V/r,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 30, 2018 0
osgood_ LATEST
LEGEND ,
May 30, 2018

Copy link to clipboard

Copied

WolfShade  wrote

osgood_   wrote

If you call for the length of the siblings outside of the $.POST function youll get your answer back.

It took me a while, but you did give me a nudge in the right direction.  I defined the sibling span outside of the $.post(), before it, and then used the var to indicate which sibling was supposed to receive/display the return message from the server.

Yep, way to go. Glad you got it sorted.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 30, 2018 0