related to #1465 Search action done in ajax, still need to construct response properly

admin/history.php

@@ -161,7 +161,8 @@ history_tabsheet();
 $template->assign(
   array(
     'U_HELP' => get_root_url().'admin/popuphelp.php?page=history',
-    'F_ACTION' => get_root_url().'admin.php?page=history'
+    'F_ACTION' => get_root_url().'admin.php?page=history',
+    'API_METHOD' => 'ws.php?format=json&method=pwg.history.search'
     )
   );
 
@@ -182,6 +183,7 @@ SELECT rules
 
   $page['search'] = unserialize($serialized_rules);
 
+  // Used when filtering on a specific user from displayed lines
   if (isset($_GET['user_id']))
   {
     if (!is_numeric($_GET['user_id']))
@@ -212,6 +214,7 @@ INSERT INTO '.SEARCH_TABLE.'
 
   $page['nb_lines'] = count($data);
 
+  //Number of ids of each kind
   $history_lines = array();
   $user_ids = array();
   $username_of = array();
@@ -435,7 +438,8 @@ SELECT
         }
       }
     }
-
+    
+    // Put in ajax response
     $template->append(
       'search_results',
       array(
@@ -480,6 +484,7 @@ SELECT
     $member_strings[] = $member_string;
   }
 
+  // Put in ajax response
   $template->assign(
     'search_summary',
     array(

admin/themes/default/js/history.js

@@ -0,0 +1,42 @@
+$(document).ready(() => {
+  
+  $(".filter").submit(function (e) {
+    e.preventDefault();
+
+    var dataArray = $(this).serializeArray()
+    console.log(dataArray);
+    dataObj = {};
+
+    dataObj["types"] = [];
+    $(dataArray).each(function(i, field){
+      if (field.name == "types[]") {
+        dataObj["types"].push(field.value);
+      } else {
+        dataObj[field.name] = field.value;
+      }
+    });
+
+    $.ajax({
+      url: API_METHOD,
+      method: "POST",
+      data: {
+        start: dataObj['start'],
+        end: dataObj['end'],
+        types: dataObj['types'],
+        user: dataObj['user'],
+        image_id: dataObj['image_id'],
+        filename: dataObj['filename'],
+        ip: dataObj['ip'],
+        display_thumbnail: dataObj['display_thumbnail'],
+      },
+      success: function (data) {
+        console.log(data);
+      },
+      error: function (e) {
+        console.log("Something went wrong: " + e);
+      }
+    })
+
+    console.log(dataObj);
+  })
+})

admin/themes/default/template/history.tpl

@@ -5,11 +5,19 @@
 jQuery(function(){ {* <!-- onLoad needed to wait localization loads --> *}
   jQuery('[data-datepicker]').pwgDatepicker();
 });
+
+const API_METHOD = "{$API_METHOD}";
 {/footer_script}
 
+{combine_script id='common' load='footer' path='admin/themes/default/js/common.js'}
+{combine_script id='history' load='footer' path='admin/themes/default/js/history.js'}
+
+{combine_script id='jquery.confirm' load='footer' require='jquery' path='themes/default/js/plugins/jquery-confirm.min.js'}
+{combine_css path="admin/themes/default/fontello/css/animation.css" order=10} {* order 10 is required, see issue 1080 *}
+
 <h2>{'History'|@translate} {$TABSHEET_TITLE}</h2>
 
-<form class="filter" method="post" name="filter" action="{$F_ACTION}">
+<form class="filter" method="post" name="filter" action="">
 <fieldset class="with-border">
   <legend><span class="icon-filter icon-green"></span>{'Filter'|@translate}</legend>
   <ul>