Pass id value from ahref to bootstrap modal php

I have a php code that creates a list from the database. One of the items I retrieve from the database is the row id. I create the list in the following code:

    <th>Cover Name</th>
      <th>Sum Insured</th>
      <th>Info</th>
      <th style="width: 3.5em;"></th>
    </tr>
  </thead>
  <tbody>
  <?php while($row = mysql_fetch_array($query_set)) { ?>
    <tr>

      <td><?php echo $row['cover_name'] ?></td>
      <td><?php echo 'R '.$row['sum_insured'] ?></td>
      <td><?php echo $row['info'] ?></td>
      <td>
          <a href="cover-type.php?id=<?php echo $row['coverid']?>"><i class="fa fa-pencil"></i></a>
         <a href="#myModal" onclick="<?php $coverid = $row['coverid'] ?>" role="button" data-toggle="modal"><i class="fa fa-trash-o"></i></a>
      </td>
    </tr>
    <?php } ?>
      </tbody>
</table>

The syntax for calling #myModal

<a href="#myModal" onclick="<?php $coverid = $row['coverid'] ?>" role="button" data-toggle="modal"><i class="fa fa-trash-o"></i></a>

as you can see the anchor #myModal and onclick

After clicking anchor I would like to pass $coverid to the following myModal pop up

    <div class="modal small fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="myModalLabel">Delete Confirmation</h3>
        </div>
        <div class="modal-body">
            <p class="error-text"><i class="fa fa-warning modal-icon"></i>Are you sure you want to delete the cover?<br>This cannot be undone.</p>
        </div>
        <div class="modal-footer">
            <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Cancel</button>
            <a href="delete-cover.php?id=<?php echo $coverid ?>" class="btn btn-danger"  >Delete</a>
        </div>
      </div>
    </div>
</div>

I under the impression that I need to have some form a hidden javascript variable in

<a href="#myModal" onclick="<?php $coverid = $row['coverid'] ?>" role="button" data-toggle="modal"><i class="fa fa-trash-o"></i></a> and pass it to myModal window, but how do I do that ?

Answer

uses a single modal
use attribute data-id to store cover id: data-id="< ?php $coverid = $row['coverid'] ?>"
add class to trash icon, for example class="trash"
add id for Delete button in modal, for example id="modalDelete"

and in JQ:

// on clik trash icon    
$('.trash').click(function(){
    //get cover id
    var id=$(this).data('id');
    //set href for cancel button
    $('#modallCancel').attr('href','delete-cover.php?id='+id);
})

http://jsfiddle.net/4j59z60e/4/

Advertisement

Answer