CODEWITHSUNDEEP
phpjavascriptjqueryhtmlajax
devcoder
devcoder

Reputation: 1685

Unable to send data through AJAX to PHP file

I have a table that has anchor links for all the rows in one of the columns.

The relevant code is 

<tbody>
  <?php foreach ($rowarr as $k => $v) { ?>
    <tr>
      <td><?php echo $k ?></td>
      <td>
        <div class="divBox">                          
          <a id="vendorlink" data-toggle="modal" data-vendor="<?= $v ?>" href="#myModal"><?php echo $v; ?></a>
        </div>
      </td>
    </tr>
  <?php } ?>
</tbody>

I'm trying to send the name of the vendor from the link clicked in the table to a modal using AJAX and trying to print the name in the modal just for testing, but even that is not happening.

<script type="text/javascript">
  $('#myModal').modal('hide');
  $("#vendorlink").click(function(){
    var vendor = $(this).data('vendor');
    $('#myModal').on('shown', function(){                
        $.ajax({
          type: "GET",
          url: "ip.php",
          data:     "id=" + vendor,
          success: function(html){
            $("#modal-body").html(html);
            $('.countstable1').dataTable( {
              "sDom": "T<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
              "sPaginationType": "bootstrap",
              "oLanguage": {
                "sLengthMenu": "_MENU_ records per page"
              },
              "aaSorting":[[0, "desc"]],
              "iDisplayLength": 10,
              "oTableTools": {
                    "sSwfPath": "swf/copy_csv_xls_pdf.swf",
                    "aButtons": ["csv", "pdf"]
                  }
            });
          }
      });              
    });
  });
</script>

And the ip.php file only has this for the moment

<?php

$vendor = $_GET['id'];

echo $vendor;
?>

But in the modal I only see the default bootstrap markup code, nothing is echo'ed in there

This is the default bootstrap markup code - http://twitter.github.com/bootstrap/javascript.html#modals

What could be wrong ? why is vendor not passing to the PHP file ?

Upvotes: 0

Views: 600

Answers (2)

Jill-J&#234;nn Vie
Jill-J&#234;nn Vie

Reputation: 1841

The data property should be defined this way:

data: {id: vendor},

Edit. Oh and replace:

<a id="vendorlink" data-toggle="modal" data-vendor="<?= $v ?>" href="#myModal"><?php echo $v; ?></a>

with:

<a id="vendorlink_<?=$v?>" class="vendorlink" data-toggle="modal" href="#myModal"><?=$v?></a>

and $("#vendorlink") with $(".vendorlink") (so you'll affect all of the entries), and $(this).data('vendor'); with $(this).attr('id').replace('vendorlink_', '');.

Upvotes: 0

Daniel Figueroa
Daniel Figueroa

Reputation: 10686

You have the same id set for all the links in your html-file, that will not work as you want, you be better of adding an event to all of your links.

Upvotes: 1

Related Questions