You can built web application and bind the material details in HTML table, so that all the material details will be showing in row wise.
Now , when you invoice material product then you will be moving material information from stock table to sold or invoice table . so, i suggest go with binding material rows in HTML table with angular or jquery and when stock reduced then reload or refresh page then automatically you will get updated stock with row deduction.
If you are expecting to remove row programmatically then use below code
$('#table > tr:last').remove();
or else if you want remove when focusing on row where you will be having invoice button then use below code
$('table tr').on("click", function(){
$(this).remove();
});
Thanks!
B.Ramana Reddy