CODEWITHSUNDEEP
javascriptjquery
Mujahid
Mujahid

Reputation: 1237

how to get dynamic id values of div

I have a combo box. When I select a value from combobox, it prints some results below. I have a link to delete every single results. So when I click 'Delete' link, the particular result should be deleted. I am using jquery to delete process. What I really want is, the results are generated dynamically, so every single delete link will have particular id values. I wanna know how can I get the particular result to delete when I click particular 'Delete' link as every result will have a unique id. how can i get it from jquery.

PHP Code:

<?php
  include("db.php");
  $make_id = $_GET['make_id'];
  $sql = mysql_query("select model_id, model from models where make_ID = $make_id");
  while ($row = mysql_fetch_array($sql)) {
      echo "<tr>";
      echo "<td id='" . $row['model_id'] . "' class='model_id_class' width='200'>" . $row['model'] . "</td>";
      echo "<td width='50'>" . "<a href='delete_model.php' id='delete_class'>" . "Delete" . "</a>" . "</td>";
      echo "</tr>";
  }
?>

Upvotes: 2

Views: 1637

Answers (4)

Benbob
Benbob

Reputation: 14264

I have a link to delete every single results. Does this mean a delete link for each thing you want to delete? That's what I'm assuming here.

I used this on some recent work. It uses .live, otherwise you would need to bind click events every time you add something that has a delete button. Basically clicking anything with class="remove" will remove the parent row.

$('a.remove').live('click', function() {
       $(this).parent('tr').fadeOut(500, function() {
           $(this).remove();
       });

});

Upvotes: 0

VinayC
VinayC

Reputation: 49245

Typically, doing such stuff in j-query, you should try to relate link and result - that makes it simpler. Something like

<div class="container">

   <div class="resultArea">
     ....
   </div>

   <a href="#" class="deleteLink">Delete</a>

</div>

And then script such as below would link them together

$('.container').each(function() {

  var container = $(this);
  var result = container.find('.resultArea');
  var link = container.find('.deleteLink');

  link.onClick(function() { // code to remove });

});

Upvotes: 0

Stuart Burrows
Stuart Burrows

Reputation: 10814

Based on the code in your comment your output might be something like this:

<tr>
  <td id="x">
    result
  </td>
  <td>
    <a class="delete_class">delete</a>
  </td>
</tr>

Since it's all in the same tr:

$('.delete_class').live('click',function(){
  $(this).parents('tr').remove();
}

Upvotes: 1

Scott Evernden
Scott Evernden

Reputation: 39986

if you create a <a> delete link inside the dynamically produced content (say a <span>) created you could do something like

<span>A result generated dynamically 
      <a href='#' onclick='$(this).parent().remove()'>delete this result</a>
</span>

Dunno if this comes close to answering your question...

Upvotes: 1

Related Questions