Child Rows are not showing by click on Parent Row

sowmya03

Link to test case:
I followed the tutorial https://datatables.net/examples/api/row_details.html. I got the "Parent Row" data, by click on that "td" element my required output is showing in console window, but it is showing in UI. I used ajax call to get the Child Row data. Here I am adding my code
Debugger code (debug.datatables.net):

  $(document).ready(function(){
  var table = $('#indentTable').DataTable();

  $('#indentTable tbody').on('click','td.details-control',function(){
      var PRNO = $(this).data('id');
      var PrId = $(this).data('refid'); // these 2 variables I have to make use in ajax call
      
      var tr = $(this).closest(tr);
      var row = table.row(tr);

      if(row.child.isShown()){
          row.child.hide();
          tr.removeClass('shown');
      }
      else{
          alert('Came to else part');  //This alert is coming
          row.child('hello').show(); //For Test added, but no use
          format(PRNO,PrId,row.child); // Child Table is not displaying, but showing in "Console window of Google Developer Tools"
          tr.addClass('shown');
      }
      
}); //details-control End

function format(PRNO,PrId,callback)
{
   var PRNO = PRNO;
   var PrId = PrId;
   
$.ajax({
    url : "my Url",
    type : "POST",
    data : {PRNO : PRNO,PrId: PrId},
    success : function(childdata){
        var data = JSON.parse(childdata); //Parsing my json data coming from controller
        var thead = ' ', tbody = ' ';
        for(var i=0;i<data.length;i++)
        {
           tbody+= '<tr><td>'+data[i].X+'</td></tr>'+.......+'<tr><td>'+data[i].Z+'</td></tr>;
         }
        callback($('<table>'+thead+tbody+'</table>')).show();
   }//success End
}); //ajax End
  
}//format function End
}); //document End

Error messages shown:
I didn't get any Error Messages here, But I didn't get Output.
Description of problem:
What mistake I done, really not understand. I am struggling with this from couple of weeks.
Please can anybody give suggestion... Thanks in advance

Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

kthorngren

See if the solution in this ajax fetched child rows blog helps. If you still have troubles please post a link to your page or a test case replicating the problem so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin