1)
den første lille ændring kunne se sådan ud:
inc_search.php
<?php
require("conn.php");
$output = '';
if (isset($_POST["query"])) {
$search = mysqli_real_escape_string($conn, $_POST["query"]);
$query = "
SELECT * FROM ordliste WHERE ord_dansk LIKE '%" . $search . "%' OR ord_engelsk LIKE '%" . $search . "%'
";
$result = mysqli_query($conn, $query);
if (mysqli_num_rows($result) > 0) {
$output .= '
<table class="table table bordered">
<tr>
<th style="width:50%">Dansk</th>
<th style="width:50%">Engelsk</th>
</tr>
';
while ($row = mysqli_fetch_array($result)) {
$output .= '
<tr>
<td>' . $row["ord_dansk"] . '</td>
<td>' . $row["ord_engelsk"] . '</td>
</tr>
';
}
echo $output;
} else {
echo 'Ingen data fundet.';
}
}
?>
der er intet ændret i din html fil.
2)
kunne se ca sådan ud
<!DOCTYPE html>
<html lang="da">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
<title>demo</title>
<style type="text/css">
</style>
<script type="text/javascript" src="
https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script>
$(document).ready(function () {
function load_data(query){
$.ajax({
url: "inc_search.php",
method: "POST",
data: {query: query},
success: function (data){
$('#result').html(data);
}
});
}
$('#soeg').click(function () {
var search = $('#search').val();
if (search != ''){
load_data(search);
}
});
});
</script>
</head>
<body>
<div id="result"></div>
<input type="text" id="search">
<button type="button" id="soeg">søg</button>
</body>
</html>
men det er en uskik at retunerer html fra AJAX, du skal kun retunerer de rå data, og lave alt html via js
en pænere og mere server effektiv løsning kunne se sådan ud:
html fil
<!DOCTYPE html>
<html lang="da">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
<title>demo</title>
<style type="text/css">
</style>
<script type="text/javascript" src="
https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script>
$(document).ready(function () {
function load_data(query){
$.ajax({
url: "inc_search.php",
method: "POST",
data: {query: query},
success: function (data){
data = jQuery.parseJSON(data);
var lng=data.length;
if(lng>0){
var html = '<table class="table table bordered"><tr><th style="width:50%">Dansk</th><th style="width:50%">Engelsk</th></tr>';
for(i=0; i<lng;i++){
html += '<tr>';
html += '<td>' + data[i]['ord_dansk'] + '</td>';
html += '<td>' + data[i]['ord_engelsk'] + '</td>';
html += '</tr>';
}
html += '</table>';
}
else{
html = 'ingen data fundet';
}
$('#result').html(html);
}
});
}
$('#soeg').click(function () {
var search = $('#search').val();
if (search != ''){
load_data(search);
}
});
});
</script>
</head>
<body>
<div id="result"></div>
<input type="text" id="search">
<button type="button" id="soeg">søg</button>
</body>
</html>
inc_search.php
<?php
require("conn.php");
$liste = array();
if (isset($_POST["query"])) {
$search = mysqli_real_escape_string($conn, $_POST["query"]);
$query = "
SELECT * FROM ordliste WHERE ord_dansk LIKE '%" . $search . "%' OR ord_engelsk LIKE '%" . $search . "%'
";
$result = mysqli_query($conn, $query);
if (mysqli_num_rows($result) > 0) {
while ($row = mysqli_fetch_assoc($result)) {
$liste[]=$row;
}
}
}
echo json_encode($liste);
?>
