i have form when i click submit button it show all the data row by row that all are work fine but my problem is how can i add this all value to mysql database when click "submit_to_database" button. please can any one help me this is my full code
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="custom.css" type="text/css">
<html lang="en">
<head>
<meta charset="utf-8">
<title>Add Sales</title>
<script type="text/javascript">
function add_values(){
if(document.getElementById('edit_guid').value==""){
if( document.getElementById('stk').value!="" ){
if(document.getElementById('stk').value!=0){
sell=document.getElementById('pric').value;
disc=document.getElementById('stk').value;
item=document.getElementById('guid').value;
roll=parseInt(document.getElementById('roll_no').value);
$('<tr id='+item+'><td><lable id='+item+'roll >'+roll+'</label></td><td><input type=text readonly="readonly" value='+sell+'></td><td><input type=text readonly="readonly" value='+disc+' ></td></tr>').fadeIn("slow").appendTo('#item_copy_final');
document.getElementById('stk').value="";
document.getElementById('pric').value="";
document.getElementById('roll_no').value=roll+1;
document.getElementById('guid').value="";
}
}else{
alert('Please Select An Item');
}}}
</script>
<body>
<form name="form1" method="post" id="form1" action="">
<input type="hidden" id="roll_no" value="1" >
<div align="center">
<input type="hidden" id="guid">
<input type="hidden" id="edit_guid">
<table class="form" >
<tr>
<td>price</td>
<td>stk</td>
</tr>
<tr>
<td><input type='text' class='form-control' id="pric" name="pric"></td>
<td><input type='text' class='form-control' id="stk" name="stk"></td>
<td><input type="button" onclick="add_values()" id="add_new_code" value="submit" class="round"></div></form></td></tr>
</table>
<div style="overflow:auto ;max-height:300px; ">
<table class="form" id="item_copy_final" style="margin-left:45px "></table>
</div>
</div>
<div class="mytable_row ">
<form>
<div align="center">
<table>
<td><input type="button" value="submit_to_database" class="round"></td>
</table>
</div>
</form>
</body>
</html>
</div>