I have the following problem I'm working on.
I'm having an app, with a table on:
<table>
<tr>
<th>bla</th>
<th>bla</th>
<th>bla</th>
</tr>
<?php foreach($bla as $b){ ?>
<tr>
<tr><?=$b["bla"];?></tr>
<tr><?=$b["bla"];?></tr>
<tr><?=$b["bla"];?></tr>
</tr>
<?php }?>
</table>
So I have this table, which always has a header and some rows (depending on the variable $bla
). The variable $bla
comes from a db and just reads all lines from a table in my db.
What I want to implement now is a search, so somebody can enter his search query in an input field and then the SQL
-Query is executed again with a LIKE
in it to perform the search and then only display the rows that contain the word searched for. Alternatively I could think of simply filtering the array that I have from before, so I already have all rows in a variable and I could simply temporarily delete all the other array elements, that not contain the word searched for.
Now two questions: What do you think would be more performant? Data will probably not go above 10.000 rows soon, just as a measure. Will it be better to query the database always when the user has finished typing, search in the db and directly display that data or will it be better to filter the consisting array?
2nd question: How can I implement this? I mean, the "array filtering"-method might be not that hard, although I'm not sure on how to filter the elements if its multidimensional (and it is, as there is the first level for every row in db and the second for every column in db). Edit: also: I would have the same problem as for the second (db-)solution: how would I get this filtered data in the table, as the table is also loaded just once, would need some javascript over there, just like on the second solution, I guess.
But the method to get the data from db is a bit harder I think. What I thought of is sending an AJAX request and on success I could deliver the array searched for. BUT: How can I then "reload" the table? I definetely don't want to reload the whole page, I want a kind of live search, so page should in general stay the same, only the table should reload and show the content of the variable passed from AJAX. How can I do this? I mean I could theoretically just echo
the whole foreach
with the new data in the PHP file that AJAX sends the data to, and then set the "old" foreach to display:none
and use a new div underneath and give it display:block
and the data
passed as html
attribute, but this is really not elegant, and there must be a better solution I think.
Any ideas?