Wordpress Google Custom Search by search form agai

Question

sorry to distrub you guys again, i have a question still not solve yet.. How to call javascript function after search form submitted ?

the work flow should be : After I filled something inside search and click search buttom (searchform.php) , it will send form and redirect, call javascript function inside (header.php) and show the result on search page (search.php),

part of header.php:

<script>
  var renderSearchElement = function() {
    google.search.cse.element.render(
      {
        div: "default",
        tag: 'search'
      });
    google.search.cse.element.render(
      {
        div: "test",
        attributes: {
          disableWebSearch: true,
          enableHistory: true},
        tag: 'search'
      });
  };



  window.__gcse = {
        parsetags: 'explicit',
  };



  var loadElements = function() {
    var cx = 'YYYYYYYYYYYYYYYYYYYYY:XXXXXXXXXX';
    var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//www.google.com/cse/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
  }



    var hndlr = function($response) {
      for (var i = 0; i < $response.items.length; i++) {
        var item = $response.items[i];

        // in production code, item.htmlTitle should have the HTML entities escaped.
        document.getElementById("content").innerHTML += "<br>";
        document.getElementById("content").innerHTML += "<br> Title : " + item.title;
        document.getElementById("content").innerHTML += "<br> ==================================== ";

        if(item.pagemap.hreview)
        {
            for(var j=0; j < item.pagemap.hreview.length; j++) {
                document.getElementById("content").innerHTML += "<br>" + j + ": " + item.pagemap.hreview[j].description;
            }
            document.getElementById("content").innerHTML += "<br>";
           }
      }
    }

    var curltestPHPonly = function()
    {
          $ch = curl_init(); 
        // set url 
        curl_setopt($ch, CURLOPT_URL, "https://www.googleapis.com/customsearch/v1?key=YYYYYYYYYYYYYYYYYYYYYYYYYYYYYY&cx=XXXXXXXXXXXXXXXXXXXXXX:XXXXXXX&q=wine&callback=hndlr"); 
        curl_exec($ch); 
    }

        var searchdata;



    var curltest = function() {
        searchdata = document.getElementById('curlinput');
            var urltest = document.createElement('script'); urltest.type = 'text/javascript'; urltest.async = true;
            urltest.src = 'https://www.googleapis.com/customsearch/v1?key=YYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYY&cx=XXXXXXXXXXXXXXXXXXXXXXX:XXXXXXXX&q='+searchdata.value +'&callback=hndlr';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(urltest, s);
    }



</script>

and shearform.php

<form  role="search" method="get" class="search-form"   action="<?php echo esc_url( home_url( '/' ) ); ?>" >

    <input type="search" id="curlinput" class="search-field" placeholder="search" value="" name="s" />

    <input type="submit" class="search-submit" value="submit" />
</form>

finally the search.php:

<?php


get_header(); ?>

    <section id="primary" class="content-area">
        <main id="main" class="site-main" role="main">


            <div id="content">result shows here</div>



        </main><!-- #main -->
    </section><!-- #primary -->
<?php

get_footer();
?>

many thanks !!!