CODEWITHSUNDEEP
javascriptphpjqueryajaxtwitter-bootstrap
user6390829
user6390829

Reputation:

Pass id of a row in the modal

I wish to pass the id of a particular row into a modal

code for link

<a href="#myModal" class="btn btn-default btn-small" id="custId" data-toggle="modal" data-id="<? echo $row['id']; ?>">Resume</a>

Code for modal

<div id="myModal" class="modal fade" tabindex="-1" data-width="760">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
    <h4 class="modal-title">Update profile</h4>
  </div>
  <div class="modal-body">
    <div class="row">
      <div class="col-md-12">
        <div class="fetched-data"></div>
      </div>
    </div>
  </div>
  <div class="modal-footer">
    <button type="button" data-dismiss="modal" class="btn btn-default">Close</button>
    <button type="submit" name="register" alt="Login" value="Submit" class="btn blue">Save changes</button>
 </div>
</div>

Code for script

<script>
$(document).ready(function(){
    $('#myModal').on('show.bs.modal', function (e) {
        var rowid = $(e.relatedTarget).data('id');
        $.ajax({
            type : 'post',
            url : 'fetch.php', //Here you will fetch records 
            data :  'rowid='+ rowid, //Pass $id
            success : function(data){
            $('.fetched-data').html(data);//Show fetched data from database
            }
        });
     });
});
</script>

Code for fetch.php

<?php
  $editId = $_POST['rowid'];
  echo $editId;
?>

I am supposed to get the id but instead i am getting undefined value in the modal, can anyone please tell why this is happening

Upvotes: 1

Views: 2733

Answers (1)

Sam
Sam

Reputation: 1381

Try this code

<a href="#myModal" class="btn btn-default btn-small ListId" id="custId" data-toggle="modal" data-id="<? echo $row['id']; ?>">Resume</a>

<div id="myModal" class="modal fade" tabindex="-1" data-width="760">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
            <h4 class="modal-title">Update profile</h4>
    </div>
    <div class="modal-body">
        <div class="row">
            <div class="col-md-12">
                <span class='ShowData'> </span>
            </div>
        </div>
    </div>

    <div class="modal-footer">
        <button type="button" data-dismiss="modal" class="btn btn-default">Close</button>
        <button type="submit" name="register" alt="Login" value="Submit" class="btn blue">Save changes</button>
    </div>
</div>

Script Code

<script>
$('.ListId').click(function()
    {
        var Id=$(this).attr('data-id');
        $.ajax({url:"fetch.php?Id="+Id,cache:false,success:function(result)
            {
                $(".ShowData").html(result);
            }});
    });
</script>

fetch.php Code

$id=$_GET['Id'];
echo $id;

Upvotes: 1

Related Questions