From 68827073b683032447135a11c0ddc20101cb1554 Mon Sep 17 00:00:00 2001
From: Étienne Loks <etienne.loks@iggdrasil.net>
Date: Wed, 29 Nov 2017 18:37:14 +0100
Subject: UI: manage row selection with datatables

---
 ishtar_common/templates/base.html              |  6 ++++--
 ishtar_common/templates/blocks/DataTables.html | 18 +++++++++++++-----
 2 files changed, 17 insertions(+), 7 deletions(-)

(limited to 'ishtar_common')

diff --git a/ishtar_common/templates/base.html b/ishtar_common/templates/base.html
index adacfcd34..783b1c599 100644
--- a/ishtar_common/templates/base.html
+++ b/ishtar_common/templates/base.html
@@ -16,7 +16,8 @@
     <script language="javascript" type="text/javascript" src="{{JQUERY_UI_URL}}ui/i18n/jquery.ui.datepicker-{{COUNTRY}}.js?ver={{VERSION}}"></script>
     <script language="javascript" type="text/javascript" src="{{STATIC_URL}}js/chosen/chosen.jquery.min.js?ver={{VERSION}}"></script>
     {# <script language="javascript" type="text/javascript" src="{{STATIC_URL}}js/prettyPhoto/js/jquery.prettyPhoto.js?ver={{VERSION}}"></script> #}
-    <script language="javascript" type="text/javascript" src="{{STATIC_URL}}datatables/jquery.dataTables.min.js?ver={{VERSION}}"></script>
+    <script language="javascript" type="text/javascript"
+            src="{{STATIC_URL}}datatables/datatables.min.js?ver={{VERSION}}"></script>
     <script language="javascript" type="text/javascript" src="{{STATIC_URL}}datatables/dataTables.bootstrap4.min.js?ver={{VERSION}}"></script>
     <script language="javascript" type="text/javascript" src="{{STATIC_URL}}js/ishtar.js?ver={{VERSION}}"></script>
     <script language="javascript" type="text/javascript"
@@ -38,7 +39,8 @@
     <link rel="stylesheet" href="{{STATIC_URL}}js/chosen/chosen.min.css?ver={{VERSION}}">
     <link rel="stylesheet" href="{{STATIC_URL}}font-awesome/css/font-awesome.min.css?ver={{VERSION}}">
     <link rel="stylesheet" href="{{STATIC_URL}}js/prettyPhoto/css/prettyPhoto.css?ver={{VERSION}}">
-    <link rel="stylesheet" href="{{STATIC_URL}}datatables/jquery.dataTables.min.css?ver={{VERSION}}">
+    <link rel="stylesheet"
+          href="{{STATIC_URL}}datatables/datatables.min.css?ver={{VERSION}}">
     <link rel="stylesheet" href="{{STATIC_URL}}datatables/dataTables.bootstrap4.min.css?ver={{VERSION}}">
     <link rel="stylesheet" href="{{STATIC_URL}}media/styles.css?ver={{VERSION}}">
     {% for url_css in JQGRID_CSS %}<link rel="stylesheet" href="{{url_css}}?ver={{VERSION}}">{% endfor %}
diff --git a/ishtar_common/templates/blocks/DataTables.html b/ishtar_common/templates/blocks/DataTables.html
index 42b6eb8ad..38cd4f298 100644
--- a/ishtar_common/templates/blocks/DataTables.html
+++ b/ishtar_common/templates/blocks/DataTables.html
@@ -49,7 +49,7 @@
 <div id='foot_{{name}}' class="gridfooter row toolbar">
     <div class='col-md-2'>
         <div class="btn-group btn-group-sm" role="group">
-            <button class="btn btn-secondary" data-toggle="modal"
+            <button type='button' class="btn btn-secondary" data-toggle="modal"
                     data-target=".table-modal-lg">
                 {% trans "Expand table" %} <i class="fa fa-expand" aria-hidden="true"></i>
             </button>
@@ -146,6 +146,7 @@ jQuery(document).ready(function(){
         "url": "{{source}}",
         "dataSrc": "rows"
     },
+    "select": {% if multiple_select %}true{% else %}'single'{% endif %},
     "columns": [
         { "data": "id", "visible": false },
         { "data": "link", "orderable": false },{% for col in extra_cols %}
@@ -198,6 +199,8 @@ jQuery(document).ready(function(){
         }
     }
   });
+{% endcomment %}
+
 {% if multiple %}
   jQuery("#add_button_{{name}}").click(function (){
     var mygrid = jQuery("#grid_{{name}}");
@@ -235,17 +238,22 @@ jQuery(document).ready(function(){
 {% else %}
   jQuery("#submit_form").click(function (){
     var mygrid = jQuery("#grid_{{name}}");
+
+    var data = datatable_{{sname}}.rows( { selected: true } ).data();
     {% if multiple_select %}
-    jQuery("#hidden_{{name}}").val(mygrid.getGridParam('selarrrow'));
+    var value = "";
+    for (k in data){
+        if (k > 0) value += ",";
+        value += data[k]['id'];
+    }
     {% else %}
-    jQuery("#hidden_{{name}}").val(mygrid.getGridParam('selrow'));
+    var value = data[0]['id'];
     {% endif %}
+    jQuery("#hidden_{{name}}").val(value);
     return true;
   });
 {% endif %}
 
-{% endcomment %}
-
 });
 
   function get_next_table_id(c_id){
-- 
cgit v1.2.3