Load a data from a page to another page using jquery ajax

Question

I have two pages, index.php and block1.php I wanted to load a data from block1.php to a div #details in index.php

here's my code

index.php

<div id="pop_box">
  <div class="close"><span id="close">&times;</span></div>
  <div id="block"></div>
  <div id="details"></div>
</div>

block1.php

<script>
$(document).ready(function() {
  var lnk;
  $('[href]').click(function() {
    lnk = '';
    lnk = $(this).attr('href');
    if (lnk.charAt(1) == "b") {
      var lot = lnk;
      $.ajax({
        url: "2dmap_func.php",
        method: "POST",
        dataType: "text",
        data: {
          lot: lot
        },
        success: function(data) {
          //alert(data);
          $('index.php #pop_box #details').load(data);
        }
      });
    }
  });
});
</script>

as you can see I want to load the data from block1.php to index.php's div#details and this code doesn't work.

 $('index.php #pop_box #details').load(data);

Answer 1

In you index.php add following line:

<?php include_once 'block1.php' ?> 

In your block1.php change following line:

$('index.php #pop_box #details').load(data);

to

$('#details').html(data); // if data is valid html