SQL Query won't run after pressing button - html

Question

I am trying to run the searchSQL query with the input from the searchbar after pressing the button. The 'sql' query runs on start.
When pressing the button it won't update the images according to the input from the search?
#using WebMatrix.Data
#{
var db = Database.Open("MTGDecks");
var sql = "SELECT * FROM Cards WHERE isPopular <> 0";
var searchSQL = "SELECT * FROM Cards WHERE cardName LIKE CONCAT ('%', #0, '%')";
var searchValue = Request.Form["searchBox"];
if (IsPost)
{
var searching = db.Query(searchSQL, searchValue);
}
var output = db.Query(sql);
}
<link href="~/Content/Site.css" rel="stylesheet" />
<h2>All Cards</h2>
<form method="post" action="/Home/Index">
<input type="text" name="searchBox" />
<button type="submit" class="btn">Search</button>
Make New Deck
<div class="row">
<div class="row justify-content-center">
#foreach (var row in output)
{
<div class="col-4">
<div class="card">
<img src="#row.imageURL" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">#row.cardName</h5>
<p class="card-text">#row.oracleText</p>
Details
</div>
</div>
</div>
}
</div>
</div>
</form>
I'm unsure of what to do.

Answer 1

ok, going out on a limb here... your "button" is the href that redirects you to the details of the #row.cardID
In your code block you have it set up to do some stuff, but you never actually call it... If I were doing this in Blazor (razor syntax) the solution would be something like
#page "/myPage/{int: cardID}
HTML HERE
//Pseudocode, don't copy/paste
#code
{
public override void OnParametersSet ()
{
if (cardID != null)
Run The COde!!
}
}
So, basically, you're missing wiring up some kind of page event. There's a TON wrong with everything you're doing, but... hopefully this will get you to the next logical question.