---
title:                                  QuickSearch
tagline:                                Find documents this Site by keyword
description:                            QuickSearch

tags:                                   [ Quick, Search ]
index:                                  []
categories:                             [ pages ]

permalink:                              /pages/public/about/quick_search/
regenerate:                             true

resources:                              [ data_tables ]
resource_options:
  # - masthead:
  #     opacity:                          0.5
      # slides:
      #   - url:                          /assets/images/master_header/clark-tibbs-do-something.jpg
      #     caption:                      Photo by Clark Tibbs on Unsplash
      #     caption_href:                 https://unsplash.com/@clarktibbs
      #     caption_color:                rgba_lighten_800
      #     transition:                   fadeInOut
---

== QuickSearch

lorem:sentences[3]

++++
<div class="mt-5 mb-5">
  <table id="ajax_table" class="display" cellspacing="0" width="100%">
    <thead>
      <tr>
        <th style="width=3rem;">title</th>
        <th>tagline</th>
        <th>tags</th>
        <th>excerpt</th>
      </tr>
    </thead>
  </table>
</div>
++++

++++
<script>
  $(document).ready(function() {

    function load_json_data() {
      // Returns the j1_colors object
      return $.ajax({
          url:      '/assets/data/search.json',
          success:  function (data) {
            if (typeof data == 'string') {
              json_data = JSON.parse(data);
            }
            if (typeof data == 'object') {
              json_data = data;
            }
          }
      });
    };

    $.when( load_json_data() ).done (
      function( json_data ) {
        var data_array  = [];

        for (var i = 0; i < json_data.length-1; i++) {
          var data            = json_data[i];
          var record_array    = [];
          var data_json; 
          var link = '<a href="' +data.url+ '" target="' +data.target+ '">' +data.title+ '</a>';

          record_array.push(link);
          record_array.push(data.tagline);
          record_array.push(data.tags);
          record_array.push(data.excerpt);

          data_array[i] = record_array;
        }

        //data_json         = JSON.stringify( data_array );

        $('#ajax_table').DataTable({
          "lengthMenu": [5, 10, 20],
          "info":     true,
          //"ordering": false,
          data: data_array,          
          columns: [
            { "title": 'title' },            
            { "title": "tagline" },        
            { "title": "tags" },
            { "title": "excerpt" }
          ]
        }); // end DataTable

    });
  });
</script>
++++