how to include the variables inside hx-vals?

I have an input tag that i use for searching.

<input id="keyword" type="search" name="keyword" th:value="${keyword}">

Now I have a hx-get in a div.

 <div hx-trigger="load, every 15s" 
     hx-get="/user-list" hx-vals='{"keyword":"admin"'
      hx-target="this"></div>

generated url: /user-list?keyword=admin

This is working since the value of keyword is static. But when I'm trying to pass the keyword variable to the hx-vals it's not generating params.

<div hx-trigger="load, every 15s" 
     hx-get="/user-list" hx-vals='{"keyword":${keyword}}'
      hx-target="this"></div>

generated url:/user-list

My question is, how to properly add the variable in the value of hx-vals?

UPDATE:

I tried this but still not working

<div hx-trigger="load, every 15s" hx-get="/user-list" 
hx-vals='js:{"keyword":htmx.values(htmx.find("#keyword"))}'
      hx-target="this"></div>

Solution

If you simply want to include a value of an html tag, you can use a rather simpler approach hx-include:

<div hx-trigger="load, every 15s" 
    hx-get="/user-list" 
    hx-include="#keyword" 
     hx-target="this">
</div>