How to integrate query in link button?

Hey - I am building up a search preview + a search button. I the user clicks on the search button, he / she should be redirected to the full search site with a http://…/search?q={{{query}}} URL.
How can I create a button that always have the current query?
Using Instantsearch (guess 1.2), JavaScript, frontend only.

Hi Marco,

Did you tried to use the queryHook function?

      container: '#queries',
      hitsPerPage: 4,
      templates: {
        empty: '',
        item: document.getElementById('hit-template').innerHTML
      escapeHits: true,
      queryHooks: function(query, search){

Other possible solution is to surround the input with a form tag with method=“get” and action=“http://…/search”. The button could be transformed into a <button type="submit"></button> and programatically to handle the “search-input” parameter as the “q” parameter


Tried both options… the second way seems to be the better way, but cannot bring it to work. Guess I integrated the dynamic parameter wrong? At the moment its interpreting the dynamic “+search-imput” at the end as a query instead as a dynamic placeholder.
Any idea how to fix that?

Can’t you use document.querySelector('your-searchbox').value on the button?

Hm? where exactly?

<div class="searchbarblock">
          <div class="w-form">
            <form id="wf-form-Email-Form" name="wf-form-Email-Form" data-name="Email Form" data-redirect="/search?q=+search-input/search?q=+search-input" redirect="/search?q=+search-input/search?q=+search-input"><div class="ais-search-box"><input type="text" class="ais-search-box ais-search-box-largesearch-w-input-ais-search-box--input w-input ais-search-box--input" maxlength="256" name="Search" data-name="Search" placeholder="Enter your name" id="search-input" autocapitalize="off" autocomplete="off" autocorrect="off" role="textbox" spellcheck="false" value="Python"></div><input type="submit" value="Search" data-wait="Please wait..." class="search-button w-button"></form>
            <div class="w-form-done">
              <div>Thank you! Your submission has been received!</div>
            <div class="w-form-fail">
              <div>Oops! Something went wrong while submitting the form.</div>

.ais-search-box input