jQuery 3: get sibling of a parent

[WolfShade]

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,

^ _ ^

[osgood_]

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.

[WolfShade]

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,

^ _ ^

[osgood_]

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?

[WolfShade]

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,

^ _ ^

[osgood_]

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.