Restore the test status dropdown for datatables 2

We have to query a new element id (dt-length-0 instead of results_length)
since the old one is no longer available and select/input elements
always have ID-s so they are more reliable across updates. We also
follow the approach in datatables to provide ID for the added status
select element and reuse the dt-search class for the new div element
with the only exception that we need extra right margin to distance
a colon appended "status" from the select element (only the input
element will inherit the right marging from dt-search).

Signed-off-by: Plamen Dimitrov <plamen.dimitrov@intra2net.com>

Author: pevogam

optional_plugins/html/avocado_result_html/templates/avocado_html.js

@@ -13,18 +13,17 @@
 
   function onDatatablesInitialized() {
     var statusColumn = this.api().column(4);
-    var select = $('<select class="form-control input-sm"><option value="">ALL</option></select>')
+    var select = $('<select id="dt-status-0" class="form-control input-sm"><option value="">ALL</option></select>')
       .on('change', function () {
         statusColumn.search($(this).val().trim()).draw();
       });
 
-    $('#results_length').wrap('<div class="row"><div class="col-sm-4"></div></div>');
-    $('#results_length').parent().parent()
+    $('#dt-length-0').parent().parent()
       .append(
-        $('<div class="col-sm-8"></div>')
+        $('<div class="dt-search"></div>')
         .append(
-          $('<label class="font-weight-normal">Status </label>').append(select)
-        )
+          $('<label for="dt-status-0" style="margin-right: 0.5em;">Status:</label>')
+        ).append(select)
       );
 
     // Add all possible status to the select