parvez parvez - 21 days ago 6
PHP Question

Dynamic table formatting is not working

I'm trying to create dynamic table with limited columns (depends on requirements).

So I have 2 pages.

results.php

This page have some list of results with add to compare check box like in image:

enter image description here

when user click on add to compare check box a small div pop up with compare button like shown in image:

after click add to compare checkbox this happens

Now when user click on compare button it will take user on next page and shows compare results in table like shown in image:

compare results

My problem is, I want compare result like this:

how can i display my headers along with row

My code for table is:

<?php
$sql = mysqli_query($conn,"SELECT c.course_title,c.course_description,c.course_fee,c.course_duration,i.instructor_name,u.university_name,m.course_provider_name from course_info_table c inner join instructor_ref_table i on c.course_instructor_id = i.instructor_id inner join university_ref_table u on c.university_id = u.university_id inner join course_provider_table m on c.course_provider_id = m.course_provider_id and (course_id = '$course_1' or '$course_2')") or die(mysqli_error($conn));
?>
<table>

<tr>
<th>Course Title</th>
<th>Description</th>
<th>Fee</th>
<th>duration</th>
<th>university</th>
<th>instructor</th>
<th>Mooc Provider</th>
</tr>


<?php
while($row = mysqli_fetch_array($sql))
{
?>

<tr>
<td><?php echo $row['course_title'];?></td>
<td><?php echo $row['course_description'];?></td>
<td><?php echo $row['course_fee'];?></td>
<td><?php echo $row['course_duration'];?></td>
<td><?php echo $row['university_name'];?></td>
<td><?php echo $row['instructor_name'];?></td>
<td><?php echo $row['course_provider_name'];?></td>
</tr>

</table>
<?php
}
}
?>

Answer

Try the following it should be work:

$sql = mysqli_query($conn,"SELECT c.course_title,c.course_description,c.course_fee,c.course_duration,i.instructor_name,u.university_name,m.course_provider_name from course_info_table c inner join instructor_ref_table i on c.course_instructor_id = i.instructor_id inner join university_ref_table u on c.university_id = u.university_id inner join course_provider_table m on c.course_provider_id = m.course_provider_id and (course_id = '$course_1' or '$course_2')") or die(mysqli_error($conn));


$compare_rows = array();

$compare_count = 0;
while($row = mysqli_fetch_array($sql))
{
    if($compare_count == 0){
        $compare_rows[0] = '<th>Course Title</th>';
        $compare_rows[1] = '<th>Description</th>';
        $compare_rows[2] = '<th>Fee</th>';
        $compare_rows[3] = '<th>duration</th>';
        $compare_rows[4] = '<th>university</th>';
        $compare_rows[5] = '<th>instructor</th>';
        $compare_rows[6] = '<th>Mooc Provider</th>';
    }
    $compare_rows[0] .= "<td>".$row['course_title']."</td>";
    $compare_rows[1] .= "<td>".$row['course_description']."</td>";
    $compare_rows[2] .= "<td>".$row['course_fee']."</td>";
    $compare_rows[3] .= "<td>".$row['course_duration']."</td>";
    $compare_rows[4] .= "<td>".$row['university_name']."</td>";
    $compare_rows[5] .= "<td>".$row['instructor_name']."</td>";
    $compare_rows[6] .= "<td>".$row['course_provider_name']."</td>";
    $compare_count++;
}

if(!empty($compare_rows)){
    echo "<table>";
    foreach($compare_rows as $compare_row){
        echo "<tr>".$compare_row."</tr>";
    }
    echo "</table>";
}

jQuery: for add/remove comparison of jsfiddle.net/47jev3f4

$(".compare").change(function() {
    var check = $(this).val();      
    if(this.checked) {  
        $('#compare_box').show();       
        $.ajax({
            type: 'POST',
            url: 'compare.php',
            dataType : "JSON",
            data:{value : check},
            success: function(data)
            {
                console.log(data);   
                console.log(data.id);
                var output = "<div class='col-md-3 photo-grid js-compare-check js-compare-"+check+"' style='float:left'>";
                output += "<div id='course_title' class='well well-sm'>";
                output += "<h4>"+data.title+"</h4>";
                output+="<textarea class='hidden' id='hidden_title' name='course_title[]' value=>"+data.title+"</textarea>";
                output+="</div>";
                output+="<input type='hidden' id='hidden_id' name='course_id[]' value="+data.id+">";
                output+="</div>";
                $('#result').append(output); 
            }
        });
    }else{
        $(".js-compare-"+check).remove(); 

        if($(".js-compare-check").length == 0){
            $('#compare_box').hide();       
        }       
    }
});