Questions regarding PHP and mootools

Question

My question is how to pull the username into the confirmation popup... would I have to change the way my php is generating the list of users or would it need some mootools coding to select the parent and then the username... if so how could I achieve that?

I have my PHP code using codeigniter to generate the following kinda things which is basically listing a username and a link to delete the user.

<div class='item'> 
<a href="http://localhost/nstrust/index.php/admin/users/delete/9" class="delete">Delete</a> <a href="http://localhost/nstrust/index.php/admin/users/view/9" class="view">Jamalia</a>
</div> 
<div class='item'> 
<a href="http://localhost/nstrust/index.php/admin/users/delete/13" class="delete">Delete</a> <a href="http://localhost/nstrust/index.php/admin/users/view/13" class="view">Timothy</a>
</div>

I have the following mootools code to pop up and confirmation to see if the user really want to delete the user

 window.addEvent('domready', function()
 {
    $$('a.delete').addEvent('click', function(event)
    {
     if (!confirm("Are you sure you want to remove this user?"))
     {
      event.stop();
     }
    });
 });

Answer 1

Assuming that your HTML will always follow the markup given above, your confirm() call could be something like:

var username = $$(event.target).getNext().text; confirm("Are you sure that you want to delete " + username + "?");

This relies on the fact that the next element after the 'delete' link will be an element containing the username being deleted.

Answer 2

The following will work nicely on your markup:

$$('a.delete').addEvent('click', function(event) {
  var username = $(event.target).getNext().get('text'); //The username is in the next tag.
  if (!confirm("Are you sure you want to remove " + username + "?")) {
    event.stop();
  }
});

Since the next link holds the user name, you can simply traverse the DOM to it and get the text value.

Answer 3

Great answers.

I personally don't like to rely on my html structure too much for this sort of thing and so I tend to store all my data in an object, or on the html elements (in fewer cases).

The first is a bit more in depth than I feel like explaining right now!

So to do the latter you could have the html spit out:

<a href="..." class="delete" rel="Jamalia">

and then use in your mootools

var username = this.get('rel');

Then you can do whatever you want to your HTML in the future. Rel is nice because it's still valid.