This document will call into the search server and expand it to a proper list in the web page.The search is done from a input field and a search button. The input works by write and press enter. The button by write in the input field and press the button.

<div class="search-form">
   <input id="search" type="text" placeholder="Search the docs..." name="search" class="form-control search-input">
   <button id="searchfordoc" class="btn search-btn" value="Search"><i class="fas fa-search"></i></button>
</div>
<div id="maincontent" class="container"></div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script type="text/javascript" src="/deserver/dataeaseconnect.js"></script>
<script  type="text/javascript">
    var deconnect = new DataEaseConnect();
    $("#searchfordoc").on('click',function(e){
      var search = $("#search").val();
      dosearch(search);
    });
    $("#search").on('keypress',function(e){
      if (e.keyCode ==13){
        var search = $("#search").val();
        dosearch(search);
      }
    });
    function dosearch(query){
      if (query.length==0)
        return;
      deconnect.getdata('/search/' + query, function(jdata){
        var rcount = 0;
        if ('data' in jdata){
          var data = jdata.data;
          if (data)
            rcount = data.length;
        }
        var html = '<div class="container text-center mt-2"><h2>Search ' + rcount + ' results for ' + query + '<h2></div><div class="container">';
        if (data){
          var data = jdata.data;
          for (var idx=0; idx<data.length;idx++){
            var rec = data[idx];
            var starr = rec.title.split('\n');
            var title = starr[0];
            html += '<div class="row"><div class="container mt-2"><h5><a class="text-dark" href="' + rec.url + '">' + title + '</a></h5></div>';
            if (starr.length>1){
              var i=1;
              while (starr.length>i && starr[i]=='')
                i++;
              if (starr.length>i)
                html += '<div class="container">' + '<p><a class="text-muted" href="' + rec.url + '">' + starr[i] + '</a></p></div>';
            }
            html += '</div>';
          }
        } else 
          html += '<br><br><p>No result found</p>';
        html += '</div>'
        $("#maincontent").html(html);
      },null,true);
    }
</script>

The html part is the input and button. Then there is a script that use the deconnect from DataEase server to get the results. Then the result is expanded and added to the main region in the page as links with extracts. The indexer used here is the custom one that takes a title and adds the first 200 chars of the body as text.