How to generate dynamic tables with jquery by receiving json response from php

Question

I want my output in following format. My design should be follows.

I want help to design the above method. Please can anyone help me. I am storing rollno in student table and marks in marks table. Mark table contains a reference to student rollno .

How can I send the json value to jquery ajax using php and assign the response to the page?

Or if you have any other method to do this. Please suggest that also. Thanks in advance.

Answer 1

Try it like,

$(function(){
    $.ajax({
       url:'getStudMarks.php',
       data:{rollNo:'19GH24'},// get marks of student 19GH24 
       type:'POST',
       success:function(data){
          $('table tbody').html(data);
       }
    });
});

And in getStudMarks.php page return your data like,

<tr><td>C</td><td>90</td><td>98</td></tr>;

For multiple tables you needt to give table id like

<table id="table-19GH24">
    <thead>
       ....
    </thead>
    <tbody>....</tbody>
</table>

And in success callback use the rollno like,

$('#table-19GH24 tbody').html(data);