URL is not getting the query parameter in the inputValue

When we are trying the below code in our index.ts, while we click on 'searchinput' button it's not getting the query parameter in the URL, After we click, this how the URL will be https://login.amaf.ae/SitePages/AMAF-Search.aspx?search= , the search is empty without the inputvalue as we checked with console,so please help me out, to resolve this issue.

$(document).ready(function() {
  $(".searchbutton").on("click", function() {
    let inputValue = $(".searchinput").val();
    console.log("SearchValue: " + inputValue);
    window.location.href = siteUrl + "/SitePages/AMAF-Search.aspx?search=" + encodeURIComponent(inputValue);
  });
});

We have tried with the HTML and script tag it's working. but we are using ts.

Well, your code works.

$(document).ready(function() {
  $(".searchbutton").on("click", function() {
    let inputValue = $(".searchinput").val();
    console.log("SearchValue: " + inputValue);
    let siteUrl = 'https://login.amaf.ae/SitePages/'
    alert(siteUrl + "/SitePages/AMAF-Search.aspx?search=" + encodeURIComponent(inputValue));
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="search-box"><label class="fontzero" for="adsearch">search</label> <input class="searchinput" id="adsearch" name='search' type="text" placeholder="" /> <button class="searchbutton"> Search </button>

But I think what you are looking for is how to do it react-way: https://react.dev/learn#responding-to-events