1

I am having a problem about getting id from mysql table to modal. I got a datatable that contain data from mysql table. i put a "UPDATE" button to edit data. UPDATE button opens modal in same page. The button code is ;

<a data-toggle='modal' class='btn btn-success btn-setting' href='#myModal1'>UPDATE</a>

It works perfectly and opens modal very well. But the problem starts from there. I need to target and post the id to modal content. To do this I have to do something like **href='something.php?id={id}'**

I have href='#myModal1'> so I couldn't do it.

What I have tried ?

I have tried **href='#myModal1?kid={$list["kid"]}'** When I mouse over the button I can see that it is getting the id but when I click the button the modal is not opening. Also I have tried to search google. I think lots of people are fixing this with javascript which I dont know :) Any help will be awesome. Thanks !

MaggsWeb
  • 3,018
  • 1
  • 13
  • 23
Fxx
  • 23
  • 6

2 Answers2

0

Create one class (any class name). For ex, i created 'UpdateButton' in <a> tag. Create one 'data-OrderID' (or any name). For ex, i created 'data-OrderID' in <a> tag. Pass value of your ID in this attribute. Use in <script> tag below.

<a href='#myModal1' class='btn btn-success btn-setting UpdateButton' data-OrderID="<?echo $YourIdHere;?>"  data-toggle='modal'>
    UPDATE
</a>

Now, in <script> tag, i used 'UpdateButton' class to call modal. And, 'data-OrderID' to pass value to something.php page

<script>
    $('.UpdateButton').click(function(){
        var Id=$(this).attr('data-OrderID');
        $.ajax({url:"something.php?Id="+Id,cache:false,success:function(result){
            $(".modal-content").html(result);
        }});
    });
</script>

something.php (modal)

<?
echo $Id = $_GET['Id'];
?>

It works for me. Hope for you too.

Check Here for more info.

Community
  • 1
  • 1
Nana Partykar
  • 10,556
  • 10
  • 48
  • 77
  • I would say better use `.data()` instead `.attr()`, purpose of `data-attribute` dies if you still use `.attr()` so better is this `var Id=$(this).data('OrderID');` – Shehary Nov 03 '15 at 11:53
  • tryed all ways that you explained. Still no luck. I think i m something doing wrong :/ – Fxx Nov 05 '15 at 13:40
  • Hi @Fxx. I've answered this type of questions a lot. Even, this question is my favourite. I'm in shock, why it is not working. But, unfortunately this code didn't helped you. I'm really sorry. – Nana Partykar Nov 05 '15 at 16:48
  • 1
    i found the solution with diffrent way @Nana Partykar. it is working very well now. Thanks for trying to help ! Cheers. – Fxx Nov 06 '15 at 09:55
0

Add a data attribute in html as bellow I used "data-exid"

<a data-toggle='modal' data-exid='[YOUR ID]' class='btn btn-success btn-setting' href='#myModal1'>UPDATE</a>

and try bellow code for model box start event

jQuery('#myModal1').on('show.bs.modal', function(event) {
var button = jQuery(event.relatedTarget) // Button that triggered the modal
var exId = button.data('exid') // Extract info from data-* attributes
// If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
// Update the modal's content. We'll use jQuery here, but you could use a data binding library or 0other methods instead.

/*Add this line in local*/
var modal = jQuery(this)
modal.find('#logId').val(-1)
modal.find('#logId').val(exId)});

Here "#logId" is an id of hidden box in a model

Parag Chaure
  • 2,883
  • 2
  • 19
  • 27
  • no need to create 2 variables `var button` & `var exId`, it can be done with one variable like this `var exId = jQuery(event.relatedTarget).data('exid')` – Shehary Nov 03 '15 at 11:45