From 313df4551fa05d18c8b7a1a27ab054b8a2696a9d Mon Sep 17 00:00:00 2001
From: Eric <eric.espie@combodo.com>
Date: Tue, 17 Nov 2020 09:42:26 +0100
Subject: [PATCH] =?UTF-8?q?N=C2=B02847=20-=20Datatable=20Fix=20selection?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 application/cmdbabstract.class.inc.php        |  32 +--
 application/ui.extkeywidget.class.inc.php     |   4 +-
 js/extkeywidget.js                            |  52 ++--
 js/linkswidget.js                             |   5 +-
 .../Component/DataTable/DataTableFactory.php  |   1 +
 templates/components/datatable/layout.js.twig | 223 +++++++++++-------
 6 files changed, 169 insertions(+), 148 deletions(-)

diff --git a/application/cmdbabstract.class.inc.php b/application/cmdbabstract.class.inc.php
index c114942bb..39ca5fd4d 100644
--- a/application/cmdbabstract.class.inc.php
+++ b/application/cmdbabstract.class.inc.php
@@ -21,18 +21,20 @@ use Combodo\iTop\Application\Search\SearchForm;
 use Combodo\iTop\Application\UI\Component\Alert\AlertFactory;
 use Combodo\iTop\Application\UI\Component\Button\Button;
 use Combodo\iTop\Application\UI\Component\Button\ButtonFactory;
+use Combodo\iTop\Application\UI\Component\DataTable\DataTableFactory;
 use Combodo\iTop\Application\UI\Component\DataTable\DataTableSettings;
 use Combodo\iTop\Application\UI\Component\Field\Field;
 use Combodo\iTop\Application\UI\Component\FieldSet\FieldSet;
 use Combodo\iTop\Application\UI\Component\Form\Form;
 use Combodo\iTop\Application\UI\Component\Input\InputFactory;
+use Combodo\iTop\Application\UI\Component\Panel\Panel;
 use Combodo\iTop\Application\UI\Component\Title\TitleFactory;
 use Combodo\iTop\Application\UI\Component\Toolbar\Toolbar;
 use Combodo\iTop\Application\UI\Layout\MultiColumn\Column\Column;
 use Combodo\iTop\Application\UI\Layout\MultiColumn\MultiColumn;
-use Combodo\iTop\Application\UI\Layout\UIContentBlock;
 use Combodo\iTop\Application\UI\Layout\Object\ObjectFactory;
-use Combodo\iTop\Application\UI\Component\Panel\Panel;
+use Combodo\iTop\Application\UI\Layout\UIContentBlock;
+use Combodo\iTop\Renderer\Console\ConsoleFormRenderer;
 
 define('OBJECT_PROPERTIES_TAB', 'ObjectProperties');
 
@@ -58,9 +60,6 @@ require_once(APPROOT.'sources/application/search/criterionconversionabstract.cla
 require_once(APPROOT.'sources/application/search/criterionconversion/criteriontooql.class.inc.php');
 require_once(APPROOT.'sources/application/search/criterionconversion/criteriontosearchform.class.inc.php');
 
-use Combodo\iTop\Application\UI\Component\DataTable\DataTableFactory;
-use Combodo\iTop\Renderer\Console\ConsoleFormRenderer;
-
 /**
  * Class cmdbAbstractObject
  */
@@ -1086,10 +1085,8 @@ HTML
 	/**
 	 * Get the HTML fragment corresponding to the display of a table representing a set of objects
 	 *
-	 * @see DisplayBlock to get a similar table but with the JS for pagination & sorting
-	 *
 	 * @param WebPage $oPage The page object is used for out-of-band information (mostly scripts) output
-	 * @param CMDBObjectSet $oSet The set of objects to display
+	 * @param \DBObjectSet $oSet The set of objects to display
 	 * @param array $aExtraParams key used :
 	 *      <ul>
 	 *          <li>view_link : if true then for extkey will display links with friendly name and make column sortable, default true
@@ -1102,24 +1099,21 @@ HTML
 	 * @return String The HTML fragment representing the table of objects. <b>Warning</b> : no JS added to handled
 	 *     pagination or table sorting !
 	 *
-	 * @throws \CoreException*@throws \Exception
-	 * @throws \ApplicationException
+	 * @see DisplayBlock to get a similar table but with the JS for pagination & sorting
+	 *
 	 * @deprecated 3.0.0 use GetDisplaySetBlock
 	 */
-	public static function GetDisplaySet(WebPage $oPage, CMDBObjectSet $oSet, $aExtraParams = array())
+	public static function GetDisplaySet(WebPage $oPage, DBObjectSet $oSet, $aExtraParams = array())
 	{
-		$oPage->AddUiBlock(static::GetDisplaySetBlock( $oPage, $oSet, $aExtraParams ));
+		$oPage->AddUiBlock(static::GetDisplaySetBlock($oPage, $oSet, $aExtraParams));
 		return "";
-		}
+	}
 
-	public static function GetDisplaySetBlock(WebPage $oPage, CMDBObjectSet $oSet, $aExtraParams = array())
+	public static function GetDisplaySetBlock(WebPage $oPage, DBObjectSet $oSet, $aExtraParams = array())
 	{
-		if (empty($aExtraParams['currentId']))
-		{
+		if (empty($aExtraParams['currentId'])) {
 			$iListId = $oPage->GetUniqueId(); // Works only if not in an Ajax page !!
-		}
-		else
-		{
+		} else {
 			$iListId = $aExtraParams['currentId'];
 		}
 
diff --git a/application/ui.extkeywidget.class.inc.php b/application/ui.extkeywidget.class.inc.php
index 3a0930756..3abfcbcfc 100644
--- a/application/ui.extkeywidget.class.inc.php
+++ b/application/ui.extkeywidget.class.inc.php
@@ -668,8 +668,8 @@ JS
 		<div style="background: #fff; border:0; text-align:center; vertical-align:middle;"><p>{$sEmptyList}</p></div>
 		</div>
 		<input type="button" id="btn_cancel_{$this->iId}" value="{$sCancel}" onClick="$('#ac_dlg_{$this->iId}').dialog('close');">&nbsp;&nbsp;
-		<input type="button" id="btn_ok_{$this->iId}" value="{$sOK}"  onClick="oACWidget_{$this->iId}.DoOk();">
-		<input type="hidden" id="count_{$this->iId}" value="0">
+		<input type="button" id="btn_ok_{$this->iId}_results" value="{$sOK}"  onClick="oACWidget_{$this->iId}.DoOk();">
+		<input type="hidden" id="count_{$this->iId}_results" value="0">
 		</form>
 		</div></div>
 HTML
diff --git a/js/extkeywidget.js b/js/extkeywidget.js
index d32df95c2..ff41cf6a9 100644
--- a/js/extkeywidget.js
+++ b/js/extkeywidget.js
@@ -276,13 +276,10 @@ function ExtKeyWidget(id, sTargetClass, sFilter, sTitle, bSelectMode, oWizHelper
 	};
 
 	this.UpdateButtons = function () {
-		var okBtn = $('#btn_ok_'+me.id);
-		if ($('#count_'+me.id).val() > 0)
-		{
+		var okBtn = $('#btn_ok_' + me.id + '_results');
+		if ($('#count_' + me.id + '_results').val() > 0) {
 			okBtn.prop('disabled', false);
-		}
-		else
-		{
+		} else {
 			okBtn.prop('disabled', true);
 		}
 	};
@@ -350,18 +347,9 @@ function ExtKeyWidget(id, sTargetClass, sFilter, sTitle, bSelectMode, oWizHelper
 	};
 
 	this.DoOk = function () {
-		var s = $('#'+me.id+'_results').find(':input[name^=storedSelection]');
-		var iObjectId = 0;
-		if (s.length > 0)
-		{
-			iObjectId = s.val();
-		}
-		else
-		{
-			iObjectId = $('#fr_'+me.id+' input[name=selectObject]:checked').val();
-		}
-		$('#ac_dlg_'+this.id).dialog('close');
-		$('#label_'+this.id).addClass('ac_dlg_loading');
+		var iObjectId = window['oSelectedItems' + me.id + '_results'][0];
+		$('#ac_dlg_' + this.id).dialog('close');
+		$('#label_' + this.id).addClass('ac_dlg_loading');
 
 		// Query the server again to get the display name of the selected object
 		var theMap = {
@@ -715,28 +703,26 @@ function ExtKeyWidget(id, sTargetClass, sFilter, sTitle, bSelectMode, oWizHelper
 			// Run the query and get the result back directly in JSON
 			me.ajax_request = $.post(AddAppContext(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php'), theMap,
 				function (data) {
-					var oTemp = $('<div>'+data.name+'</div>');
+					var oTemp = $('<div>' + data.name + '</div>');
 					var txt = oTemp.text(); // this causes HTML entities to be interpreted
 
-					$('#label_'+me.id).val(txt);
-					$('#label_'+me.id).removeClass('ac_dlg_loading');
+					$('#label_' + me.id).val(txt);
+					$('#label_' + me.id).removeClass('ac_dlg_loading');
 
-					var prevValue = $('#'+me.id).val();
-					$('#'+me.id).val(iObjectId);
-					if (prevValue != iObjectId)
-					{
-						$('#'+me.id).trigger('validate');
-						$('#'+me.id).trigger('extkeychange');
-						$('#'+me.id).trigger('change');
+					var prevValue = $('#' + me.id).val();
+					$('#' + me.id).val(iObjectId);
+					if (prevValue != iObjectId) {
+						$('#' + me.id).trigger('validate');
+						$('#' + me.id).trigger('extkeychange');
+						$('#' + me.id).trigger('change');
 					}
-					if ($('#'+me.id).hasClass('multiselect'))
-					{
-						$('#'+me.id+' option').each(function () {
+					if ($('#' + me.id).hasClass('multiselect')) {
+						$('#' + me.id + ' option').each(function () {
 							this.selected = ($(this).attr('value') == iObjectId);
 						});
-						$('#'+me.id).multiselect('refresh');
+						$('#' + me.id).multiselect('refresh');
 					}
-					$('#label_'+me.id).focus();
+					$('#label_' + me.id).focus();
 					me.ajax_request = null;
 				},
 				'json'
diff --git a/js/linkswidget.js b/js/linkswidget.js
index 40d7d8e62..791007a8a 100644
--- a/js/linkswidget.js
+++ b/js/linkswidget.js
@@ -202,14 +202,13 @@ function LinksWidget(id, sClass, sAttCode, iInputId, sSuffix, bDuplicates, oWizH
 			theMap['sRemoteClass'] = theMap['class'];  // swap 'class' (defined in the form) and 'remoteClass'
 			theMap['class'] = me.sClass;
 			$(' :input[name^=storedSelection]', context).each(function () {
-				if (theMap[this.name] == undefined)
-				{
+				if (theMap[this.name] == undefined) {
 					theMap[this.name] = [];
 				}
 				theMap[this.name].push(this.value);
 				$(this).remove(); // Remove the selection for the next time the dialog re-opens
 			});
-			theMap["storedSelection[]"]=eval("oSelectedItemsadd_"+me.id);
+			theMap["storedSelection[]"] = eval("oSelectedItemsResultsToAdd_" + me.id);
 
 			// Retrieve the 'filter' definition
 			theMap['filter'] = $(':input[name=filter]', context).val();
diff --git a/sources/application/UI/Component/DataTable/DataTableFactory.php b/sources/application/UI/Component/DataTable/DataTableFactory.php
index 1d7841f64..6696e8602 100644
--- a/sources/application/UI/Component/DataTable/DataTableFactory.php
+++ b/sources/application/UI/Component/DataTable/DataTableFactory.php
@@ -327,6 +327,7 @@ class DataTableFactory
 		$aOptions['sTableId'] = $sTableId;
 		$aOptions['bUseCustomSettings'] = $bUseCustomSettings;
 		$aOptions['bViewLink'] = $bViewLink;
+		$aOptions['sListId'] = $sListId;
 
 		$oDataTable->SetOptions($aOptions);
 		$oDataTable->SetAjaxUrl("ajax.render.php");
diff --git a/templates/components/datatable/layout.js.twig b/templates/components/datatable/layout.js.twig
index 3fa99d332..34c340de1 100644
--- a/templates/components/datatable/layout.js.twig
+++ b/templates/components/datatable/layout.js.twig
@@ -28,11 +28,11 @@ function checkAllDataTable(table, value) {
 }
 
 $('#{{ oUIBlock.GetId() }}').closest("[role=dialog]").on("dialogbeforeclose", function () {
-     $('#{{ oUIBlock.GetId() }}').DataTable().clear();
+    $('#{{ oUIBlock.GetId() }}').DataTable().clear();
 });
 
 {% if oUIBlock.GetOption("select_mode") is defined %}
-var oSelectedItems{{ oUIBlock.GetOption('sTableId') }} = [];
+var oSelectedItems{{ oUIBlock.GetOption('sListId') }} = [];
 {% endif %}
 
 if ($.fn.dataTable.isDataTable('#{{ oUIBlock.GetId() }}')) {
@@ -40,53 +40,53 @@ if ($.fn.dataTable.isDataTable('#{{ oUIBlock.GetId() }}')) {
 }
 
 var oTable{{ oUIBlock.GetId() }} = $('#{{ oUIBlock.GetId() }}').DataTable({
-    "language": {
-        "processing": "{{ 'UI:Datatables:Language:Processing'|dict_s }}",
-        "search": "{{ 'UI:Datatables:Language:Search'|dict_s }}",
-        "lengthMenu": "{{ 'UI:Datatables:Language:LengthMenu'|dict_s }}",
-        "zeroRecords": "{{ 'UI:Datatables:Language:ZeroRecords'|dict_s }}",
-        "info": "{{ 'UI:Datatables:Language:Info'|dict_s }}",
-        "infoEmpty": "{{ 'UI:Datatables:Language:InfoEmpty'|dict_s }}",
-        "infoFiltered": "({{ 'UI:Datatables:Language:InfoFiltered'|dict_s }})",
-        "emptyTable": "{{ 'UI:Datatables:Language:EmptyTable'|dict_s }}",
-        "paginate": {
-            "first": "<<",
+    language: {
+        processing: "{{ 'UI:Datatables:Language:Processing'|dict_s }}",
+        search: "{{ 'UI:Datatables:Language:Search'|dict_s }}",
+        lengthMenu: "{{ 'UI:Datatables:Language:LengthMenu'|dict_s }}",
+        zeroRecords: "{{ 'UI:Datatables:Language:ZeroRecords'|dict_s }}",
+        info: "{{ 'UI:Datatables:Language:Info'|dict_s }}",
+        infoEmpty: "{{ 'UI:Datatables:Language:InfoEmpty'|dict_s }}",
+        infoFiltered: "({{ 'UI:Datatables:Language:InfoFiltered'|dict_s }})",
+        emptyTable: "{{ 'UI:Datatables:Language:EmptyTable'|dict_s }}",
+        paginate: {
+            first: "<<",
             previous: "<i class=\"fas fa-angle-left\"></i>",
             next: "<i class=\"fas fa-angle-right\"></i>",
-            "last": ">>"
+            last: ">>"
         },
-        "aria": {
-            "sortAscending": ": {{ 'UI:Datatables:Language:Sort:Ascending'|dict_s }}",
-            "sortDescending": ": {{ 'UI:Datatables:Language:Sort:Descending'|dict_s }}"
+        aria: {
+            sortAscending: ": {{ 'UI:Datatables:Language:Sort:Ascending'|dict_s }}",
+            sortDescending: ": {{ 'UI:Datatables:Language:Sort:Descending'|dict_s }}"
         }
     },
-    "lengthMenu": [[ {{ oUIBlock.GetOptions()["iPageSize"] }},  {{ oUIBlock.GetOptions()["iPageSize"]*2 }},  {{ oUIBlock.GetOptions()["iPageSize"]*3 }}, {{ oUIBlock.GetOptions()["iPageSize"]*4 }}, -1], [ {{ oUIBlock.GetOptions()["iPageSize"] }},  {{ oUIBlock.GetOptions()["iPageSize"]*2 }},  {{ oUIBlock.GetOptions()["iPageSize"]*3 }}, {{ oUIBlock.GetOptions()["iPageSize"]*4 }}, "{{ 'Portal:Datatables:Language:DisplayLength:All'|dict_s }}"]],
-    "dom": "<'ibo-datatable-toolbar'pil>t<'ibo-datatable-toolbar'pil>",
-	{% if( oUIBlock.GetOptions()["sort"][0] is defined ) %}
-	"order": [[{{ oUIBlock.GetOptions()["sort"][0]}},'{{ oUIBlock.GetOptions()["sort"][1]}}']],
-	{% else %}
-	"order":[],
-	{% endif %}
-	"ordering": true,
+    lengthMenu: [[ {{ oUIBlock.GetOptions()["iPageSize"] }},  {{ oUIBlock.GetOptions()["iPageSize"]*2 }},  {{ oUIBlock.GetOptions()["iPageSize"]*3 }}, {{ oUIBlock.GetOptions()["iPageSize"]*4 }}, -1], [ {{ oUIBlock.GetOptions()["iPageSize"] }},  {{ oUIBlock.GetOptions()["iPageSize"]*2 }},  {{ oUIBlock.GetOptions()["iPageSize"]*3 }}, {{ oUIBlock.GetOptions()["iPageSize"]*4 }}, "{{ 'Portal:Datatables:Language:DisplayLength:All'|dict_s }}"]],
+    dom: "<'ibo-datatable-toolbar'pil>t<'ibo-datatable-toolbar'pil>",
+    {% if( oUIBlock.GetOptions()["sort"][0] is defined ) %}
+    order: [[{{ oUIBlock.GetOptions()["sort"][0] }}, '{{ oUIBlock.GetOptions()["sort"][1] }}']],
+    {% else %}
+    order: [],
+    {% endif %}
+    ordering: true,
     {% if oUIBlock.GetOption("select_mode") is defined %}
-    "select": {
-        "style": "{{ oUIBlock.GetOption("select_mode") }}"
+    select: {
+        style: "{{ oUIBlock.GetOption("select_mode") }}"
     },
-    "rowCallback": function (oRow, oData) {
+    rowCallback: function (oRow, oData) {
         // Hiding pagination if only one page
         if ($(this).closest('.ibo-panel--body').find('[name=selectionMode]') === "negative") {
-            if (!oData.id in oSelectedItems{{ oUIBlock.GetOption('sTableId') }}) {
+            if (!oData.id in oSelectedItems{{ oUIBlock.GetOption('sListId') }}) {
                 $(oRow).select();
                 $(oRow).find('td:first-child input').prop('checked', true);
             }
         } else {
-            if (oData.id in oSelectedItems{{ oUIBlock.GetOption('sTableId') }}) {
+            if (oData.id in oSelectedItems{{ oUIBlock.GetOption('sListId') }}) {
                 $(oRow).select();
                 $(oRow).find('td:first-child input').prop('checked', true);
             }
         }
     },
-    "drawCallback": function () {
+    drawCallback: function () {
         // Hiding pagination if only one page
         if ($(this).closest('.ibo-panel--body').find('[name=selectionMode]') === "negative") {
             $(this).find('[name=selectAll]').checked();
@@ -96,33 +96,33 @@ var oTable{{ oUIBlock.GetId() }} = $('#{{ oUIBlock.GetId() }}').DataTable({
         }
     },
     {% endif %}
-    "rowId": "id",
-    "filter": false,
-    "retrieve": true,
-    "destroy": true,
-    "processing": true,
-    "serverSide": true,
-    "columns": [
+    rowId: "id",
+    filter: false,
+    retrieve: true,
+    destroy: true,
+    processing: true,
+    serverSide: true,
+    columns: [
         {% if oUIBlock.GetOption("select_mode") is not empty %}
         {
-            "width": "auto",
-            "searchable": false,
-            "sortable": false,
-            "title":
+            width: "auto",
+            searchable: false,
+            sortable: false,
+            title:
                     {% if oUIBlock.GetOption("select_mode") != "single" %}
-                        '<span class="row_input"><input type="checkbox" onclick="checkAllDataTable(\'#{{ oUIBlock.GetId() }}\',this.checked);" class="checkAll" id="field_{{ oUIBlock.GetId() }}_check_all" name="field_{{ oUIBlock.GetId() }}_check_all" title="{{ 'UI:SearchValue:CheckAll'|dict_s }} / {{ 'UI:SearchValue:UncheckAll'|dict_s }}" /></span>'
-                    {% else %}
-                        '<span class="row_input"><input type="checkbox" style="display: none;" onclick="checkAllDataTable(\'#{{ oUIBlock.GetId() }}\',this.checked);" class="checkAll" id="field_{{ oUIBlock.GetId() }}_check_all" name="field_{{ oUIBlock.GetId() }}_check_all" title="{{ 'UI:SearchValue:CheckAll'|dict_s }} / {{ 'UI:SearchValue:UncheckAll'|dict_s }}" /></span>'
-                    {% endif %},
-            "type": "html",
-            "data": "",
-            "render": function (data, type, row) {
+                '<span class="row_input"><input type="checkbox" onclick="checkAllDataTable(\'#{{ oUIBlock.GetId() }}\',this.checked);" class="checkAll" id="field_{{ oUIBlock.GetId() }}_check_all" name="field_{{ oUIBlock.GetId() }}_check_all" title="{{ 'UI:SearchValue:CheckAll'|dict_s }} / {{ 'UI:SearchValue:UncheckAll'|dict_s }}" /></span>'
+            {% else %}
+            '<span class="row_input"><input type="checkbox" style="display: none;" onclick="checkAllDataTable(\'#{{ oUIBlock.GetId() }}\',this.checked);" class="checkAll" id="field_{{ oUIBlock.GetId() }}_check_all" name="field_{{ oUIBlock.GetId() }}_check_all" title="{{ 'UI:SearchValue:CheckAll'|dict_s }} / {{ 'UI:SearchValue:UncheckAll'|dict_s }}" /></span>'
+            {% endif %},
+            type: "html",
+            data: "",
+            render: function (data, type, row) {
                 var oCheckboxElem =
                         {% if oUIBlock.GetOption("select_mode") != "single" %}
-                            $('<span class="row_input"><input type="checkbox" class="selectList{{ oUIBlock.GetId() }}" name="selectObject[]" /></span>');
-                        {% else %}
-                            $('<span class="row_input"><input type="radio" class="selectList{{ oUIBlock.GetId() }}" name="selectObject[]" /></span>');
-                        {% endif %}
+                    $('<span class="row_input"><input type="checkbox" class="selectList{{ oUIBlock.GetId() }}" name="selectObject[]" /></span>');
+                {% else %}
+                $('<span class="row_input"><input type="radio" class="selectList{{ oUIBlock.GetId() }}" name="selectObject[]" /></span>');
+                {% endif %}
                 if (row.limited_access) {
                     oCheckboxElem.html('-');
                 } else {
@@ -134,33 +134,33 @@ var oTable{{ oUIBlock.GetId() }} = $('#{{ oUIBlock.GetId() }}').DataTable({
         {% endif %}
         {% for aColumn in oUIBlock.GetDisplayColumns() %}
         {
-            "width": "auto",
-            "searchable": false,
-            "sortable": true,
-            "title": "{{ aColumn["attribute_label"] }}",
-            "defaultContent": "",
-            "type": "html",
-            'metadata': {
-                'object_class': "{{ aColumn["object_class"] }}",
-                'attribute_code': "{{ aColumn["attribute_code"] }}",
-                'attribute_type': "{{ aColumn["attribute_type"] }}",
-                'attribute_label': "{{ aColumn["attribute_label"] }}"
+            width: "auto",
+            searchable: false,
+            sortable: true,
+            title: "{{ aColumn["attribute_label"] }}",
+            defaultContent: "",
+            type: "html",
+            metadata: {
+                object_class: "{{ aColumn["object_class"] }}",
+                attribute_code: "{{ aColumn["attribute_code"] }}",
+                attribute_type: "{{ aColumn["attribute_type"] }}",
+                attribute_label: "{{ aColumn["attribute_label"] }}"
             },
-            "data": "{{ aColumn["class_alias"] }}/{{ aColumn["attribute_code"] }}",
-            "render": {
-                "display": function (data, type, row) {  {{ aColumn["render"]|raw }}},
-                "_": "{{ aColumn["class_alias"] }}/{{ aColumn["attribute_code"] }}"
+            data: "{{ aColumn["class_alias"] }}/{{ aColumn["attribute_code"] }}",
+            render: {
+                display: function (data, type, row) {  {{ aColumn["render"]|raw }}},
+                _: "{{ aColumn["class_alias"] }}/{{ aColumn["attribute_code"] }}"
             }
         },
         {% endfor %}
     ],
-    "ajax": $.fn.dataTable.pipeline({
-        "url": "{{ oUIBlock.GetAjaxUrl() }}",
-        "data": {{ oUIBlock.GetAjaxData() |raw }},
-        "method": "post",
-        "pages": 5 // number of pages to cache
+    ajax: $.fn.dataTable.pipeline({
+        url: "{{ oUIBlock.GetAjaxUrl() }}",
+        data: {{ oUIBlock.GetAjaxData() |raw }},
+        method: "post",
+        pages: 5 // number of pages to cache
     }),
-    "initComplete": function() {
+    initComplete: function () {
         if (this.api().page.info().pages === 1) {
             $('.dataTables_paginate').hide();
             $('.dataTables_length').hide();
@@ -168,18 +168,20 @@ var oTable{{ oUIBlock.GetId() }} = $('#{{ oUIBlock.GetId() }}').DataTable({
     }
 });
 
+{% if oUIBlock.GetOption("select_mode") is not empty %}
+{% if oUIBlock.GetOption("select_mode") != "single" %}
 oTable{{ oUIBlock.GetId() }}.off('select').on('select', function (oEvent, dt, type, indexes) {
     var aData = oTable{{ oUIBlock.GetId() }}.rows(indexes).data().toArray();
-   // Checking input
+    // Checking input
     $('#{{ oUIBlock.GetId() }} tr[role="row"].selected td:first-child input').prop('checked', true);
     // Saving values in temp array
     for (var i in aData) {
         var iItemId = aData[i].id;
-        if (oSelectedItems{{ oUIBlock.GetOption('sTableId') }}.indexOf(iItemId) === -1) {
-            oSelectedItems{{ oUIBlock.GetOption('sTableId') }}.push(iItemId);
+        if (oSelectedItems{{ oUIBlock.GetOption('sListId') }}.indexOf(iItemId) === -1) {
+            oSelectedItems{{ oUIBlock.GetOption('sListId') }}.push(iItemId);
         }
     }
-    if ((oSelectedItems{{ oUIBlock.GetOption('sTableId') }}.length === oTable{{ oUIBlock.GetId() }}.page.info()["recordsTotal"] && $(this).closest('.ibo-panel--body').find('[name=selectionMode]').val() === "negative")) {
+    if ((oSelectedItems{{ oUIBlock.GetOption('sListId') }}.length === oTable{{ oUIBlock.GetId() }}.page.info()["recordsTotal"] && $(this).closest('.ibo-panel--body').find('[name=selectionMode]').val() === "negative")) {
         $('#btn_ok_{{ oUIBlock.GetOption('sTableId') }}').prop('disabled', true);
     } else {
         $('#btn_ok_{{ oUIBlock.GetOption('sTableId') }}').prop('disabled', false);
@@ -194,16 +196,55 @@ oTable{{ oUIBlock.GetId() }}.off('deselect').on('deselect', function (oEvent, dt
     // Saving values in temp array
     for (var i in aData) {
         var iItemId = aData[i].id;
-        if (oSelectedItems{{ oUIBlock.GetOption('sTableId') }}.indexOf(iItemId) > -1) {
-            oSelectedItems{{ oUIBlock.GetOption('sTableId') }}.splice(oSelectedItems{{ oUIBlock.GetOption('sTableId') }}.indexOf(iItemId), 1);
+        if (oSelectedItems{{ oUIBlock.GetOption('sListId') }}.indexOf(iItemId) > -1) {
+            oSelectedItems{{ oUIBlock.GetOption('sListId') }}.splice(oSelectedItems{{ oUIBlock.GetOption('sListId') }}.indexOf(iItemId), 1);
         }
     }
-    if ((oSelectedItems{{ oUIBlock.GetOption('sTableId') }}.length === 0 && $(this).closest('.ibo-panel--body').find('[name=selectionMode]').val() === "positive")) {
+    if ((oSelectedItems{{ oUIBlock.GetOption('sListId') }}.length === 0 && $(this).closest('.ibo-panel--body').find('[name=selectionMode]').val() === "positive")) {
         $('#btn_ok_{{ oUIBlock.GetOption('sTableId') }}').prop('disabled', true);
     } else {
         $('#btn_ok_{{ oUIBlock.GetOption('sTableId') }}').prop('disabled', false);
     }
 });
+{% else %}
+oTable{{ oUIBlock.GetId() }}.off('select').on('select', function (oEvent, dt, type, indexes) {
+    var aData = oTable{{ oUIBlock.GetId() }}.rows(indexes).data().toArray();
+    // Checking input
+    $('#{{ oUIBlock.GetId() }} tr[role="row"].selected td:first-child input').prop('checked', true);
+    // Saving values in temp array
+    for (var i in aData) {
+        var iItemId = aData[i].id;
+        if (oSelectedItems{{ oUIBlock.GetOption('sListId') }}.indexOf(iItemId) === -1) {
+            oSelectedItems{{ oUIBlock.GetOption('sListId') }}.push(iItemId);
+        }
+    }
+    if ((oSelectedItems{{ oUIBlock.GetOption('sListId') }}.length === oTable{{ oUIBlock.GetId() }}.page.info()["recordsTotal"] && $(this).closest('.ibo-panel--body').find('[name=selectionMode]').val() === "negative")) {
+        $('#btn_ok_{{ oUIBlock.GetOption('sListId') }}').prop('disabled', true);
+    } else {
+        $('#btn_ok_{{ oUIBlock.GetOption('sListId') }}').prop('disabled', false);
+    }
+});
+
+oTable{{ oUIBlock.GetId() }}.off('deselect').on('deselect', function (oEvent, dt, type, indexes) {
+    var aData = oTable{{ oUIBlock.GetId() }}.rows(indexes).data().toArray();
+
+    // Checking input
+    $('#{{ oUIBlock.GetId() }} tr[role="row"]:not(.selected) td:first-child input').prop('checked', false);
+    // Saving values in temp array
+    for (var i in aData) {
+        var iItemId = aData[i].id;
+        if (oSelectedItems{{ oUIBlock.GetOption('sListId') }}.indexOf(iItemId) > -1) {
+            oSelectedItems{{ oUIBlock.GetOption('sListId') }}.splice(oSelectedItems{{ oUIBlock.GetOption('sListId') }}.indexOf(iItemId), 1);
+        }
+    }
+    if ((oSelectedItems{{ oUIBlock.GetOption('sListId') }}.length === 0 && $(this).closest('.ibo-panel--body').find('[name=selectionMode]').val() === "positive")) {
+        $('#btn_ok_{{ oUIBlock.GetOption('sListId') }}').prop('disabled', true);
+    } else {
+        $('#btn_ok_{{ oUIBlock.GetOption('sListId') }}').prop('disabled', false);
+    }
+});
+{% endif %}
+{% endif %}
 
 // Handles submit button
 //$('#form_{{ oUIBlock.GetId() }} .form_buttons .form_btn_submit').off('click').on('click', function(oEvent){
@@ -238,16 +279,16 @@ $('#datatable_dlg_{{ oUIBlock.GetId() }}').dialog(
     });
 
 $aOptions = {
-    'sListId': '{{ oUIBlock.GetId() }}',
-    'oColumns': {{ oUIBlock.GetResultColumnsAsJson()|raw }},
-    'sViewLink': '{{ oUIBlock.GetOptions()["bViewLink"] }}',
-    'iPageSize': '{{ oUIBlock.GetOptions()["iPageSize"] }}',
-    'sTableId': '{{ oUIBlock.GetOptions()["sTableId"] }}',
-    "sRenderUrl": "{{ oUIBlock.GetAjaxUrl() }}",
-    "sSelectMode": "{{ oUIBlock.GetOptions()["select_mode"] }}",
-    "oData": {{ oUIBlock.GetAjaxData() |raw }},
-    'oLabels': {"moveup": "{{ 'UI:Button:MoveUp'|dict_s }}", "movedown": "{{ 'UI:Button:MoveDown'|dict_s }}"},
-    'oDefaultSettings': {{ oUIBlock.GetOptions()["oDefaultSettings"]|raw }}
+    sListId: '{{ oUIBlock.GetId() }}',
+    oColumns: {{ oUIBlock.GetResultColumnsAsJson()|raw }},
+    sViewLink: '{{ oUIBlock.GetOptions()["bViewLink"] }}',
+    iPageSize: '{{ oUIBlock.GetOptions()["iPageSize"] }}',
+    sTableId: '{{ oUIBlock.GetOptions()["sTableId"] }}',
+    sRenderUrl: "{{ oUIBlock.GetAjaxUrl() }}",
+    sSelectMode: "{{ oUIBlock.GetOptions()["select_mode"] }}",
+    oData: {{ oUIBlock.GetAjaxData() |raw }},
+    oLabels: {moveup: "{{ 'UI:Button:MoveUp'|dict_s }}", movedown: "{{ 'UI:Button:MoveDown'|dict_s }}"},
+    oDefaultSettings: {{ oUIBlock.GetOptions()["oDefaultSettings"]|raw }}
 };
 
 //if (!typeof $('#datatable_dlg_{{ oUIBlock.GetId() }}').DataTableSettings() !== "undefined")