index.php
<!doctype html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
table,
td,
th {
border: 1px solid black;
}
table {
width: 100%;
border-collapse: collapse;
}
#result {
margin-top: 30px;
padding: 20px;
}
</style>
</head>
<body>
<form id="contactForm1" action="ajax.php" method="post">
<input type="text" name="kod[]" value="01"> <br>
<input type="text" name="cinsi[]" value="Köşelik"> <br>
<input type="text" name="fiyat[]" value="1.5"> <br>
<hr>
<input type="text" name="kod[]" value="02"> <br>
<input type="text" name="cinsi[]" value="Perde"> <br>
<input type="text" name="fiyat[]" value="1.2"> <br>
<hr>
<input type="text" name="kod[]" value="03"> <br>
<input type="text" name="cinsi[]" value="Tabure"> <br>
<input type="text" name="fiyat[]" value="1.1"> <br>
<button type="submit" style="margin-top: 15px;">Yolla</button>
</form>
<div id="result"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$("#contactForm1").on("submit", function(e) {
e.preventDefault();
$.ajax({
type: $(this).attr('method'),
url: $(this).attr('action'),
data: $(this).serialize(),
error: data => {
console.log('Hata');
console.log(data);
}
}).done(e => {
$("#result").html(e)
})
})
</script>
</body>
</html>ajax.php
<?php $p = $_POST;
$data = json_encode($p, JSON_UNESCAPED_UNICODE);
// $data değişkenini direkt olarak veri tabanına kaydedin. Tablo göstermek istediğiniz yerde veri tabanından çekerek json_decode edin ve aşağıdaki gibi tablo oluşturun
?>
<table>
<tr>
<th>Kod</th>
<th>Cinsi</th>
<th>Fiyat</th>
</tr>
<?php foreach ($p['kod'] as $k => $v) { ?>
<tr>
<td><?= $v ?></td>
<td><?= $p['cinsi'][$k] ?></td>
<td><?= $p['fiyat'][$k] ?></td>
</tr>
<?php } ?>
</table> 
