//PHP code
while($row = $result->fetch_assoc())
{
echo '<tr>';
echo '<td style="text-align:left; width:10%;"><font size="3"><button type="button" class="part_btn" data-id="'.$row['p_received_id'].'">info</button></td>';
echo '<td style="text-align:left; width:8%;"><font size="3" color="white">'.$row['part_repair'].'</font></td>';
echo '<td style="text-align:left; width:17%;"><font size="3" color="white">'.$row['part_num'].'</font></td>';
echo "<td style='text-align:left; width:22%;'><font size='3' color='white'>".$row["provider"]."</font></td>";
echo '<td style="text-align:left; width:33%;"><font size="3" color="white">'.$row['part_description'].'</font></td>';
if(($row['part_cost'] == '0') or ($row['part_cost'] == '0.00'))
{
echo '<td colspan="1" style="text-align:left; width:15%;"><font size="3" color="yellow">'.$row["part_cost"].'</font></td>';
}
else
{
echo '<td colspan="1" style="text-align:left; width:15%;"><font size="3" color="white">$ '.$row["part_cost"].'</font></td>';
}
echo '</tr>';
echo '<tr><td colspan="4">';
echo '<div class="show_stuff" style="display:none;margin-top:2%" width="100%">';
echo '<table id="rma_details_tbl_rows" align="left" border="0" width ="50%" style="background-color:white; margin-left: 5%"></table>';
echo '</div>';
echo '</td></tr>';
echo '<tr><td colspan="6"><hr style="border: 1px dotted gray"></td></tr>';
}
echo '</tbody>';
echo '</table>';
}
//Javascript
$(".part_btn").on("click", function () { //telling dom to listen for the button click with class part_btn var p_received_id = $(this).data("id"); //get the data-id attribute [part request id] $(".show_stuff").toggle(); //display the div for the details
$("#rma_details_tbl_rows").empty(); //clear out table rows from existing request
//Get Part Details
var dataString = 'r='+ p_received_id +'&action=get_rma_details'; //set up ajax call to get the data and pass the part request id
$.ajax ({
type: 'GET',
url: 'ajax.php', //php file to run query and return data
data: dataString,
cache: false,
dataType: 'json',
success: function(html) { //with a successful call, return data.
//Build a table dynamically inside jquery
$.each(html, function(key, value)
{ //for each piece of data returned.
$('#rma_details_tbl_rows').append("<tr><td><b>Vehicle: </b>"+ value.part_year +" "+ value.part_make +" "+ value.part_model +"</td></tr><tr><td><b>Purchase Date: </b>"+ value.part_date + "</td></tr><tr><td><b>" + " Total Cost: </b>" + value.part_cost + " x " + value.part_quantity + "</td></tr><tr><td><b>" + " Notes: </b>" + value.part_notes + "</td></tr>");
//create rows for each data row retruend and append it to the html table we set up
$(".edit_contact_btn").on("click", function() {
$(".edit_p_received_id").val(value.p_received_id);
$(".edit_part_description").val(value.part_type);
});
});
}
});
});
//Ajax Call
require_once("SQL_Connect.php");
$action = $_GET['action']; $parts_id = $_GET['r'];
switch($action)
{
case 'get_rma_details':
$query = "SELECT p_received_id, part_date, part_repair, part_cost, part_year, part_make, part_model, part_notes, part_quantity
FROM parts_receive
WHERE p_received_id = '".$parts_id."'";
$result = $conn->query($query);
while($row = $result->fetch_assoc())
{
$part_details_array[] = array("p_received_id" => $row['p_received_id'], "part_date" => $row['part_date'],
"part_repair" => $row['part_repair'], "part_cost" => $row['part_cost'], "part_make" => $row['part_make'],
"part_model" => $row['part_model'], "part_year" => $row['part_year'], "part_notes" => $row['part_notes'],
"part_quantity" => $row['part_quantity']);
}
die(json_encode($part_details_array));
break;
}