filter widget with logical operators

html/admin/js/collections/arangoDocuments.js

@@ -101,30 +101,15 @@ window.arangoDocuments = Backbone.Collection.extend({
         });
       },
 
-
-
-/*
-   POST /_api/cursor
-
-   {
-   "query": "FOR u in mycollection FILTER @name1, @name2 return u",
-   "count": false,
-   "bindVars": {
-   "name1": xy,
-   "name2": xy
-   }
-   }
-*/
       getFilteredDocuments: function (colid, currpage, filter) {
         var self = this;
         this.collectionID = colid;
         this.currentPage = currpage;
         var filterstring;
-        console.log(filter);
         if(filter.length === 0){
            filterstring ="";
         } else {
-          filterstring = ' FILTER' + filter.toString();
+          filterstring = ' FILTER' + filter.join('');
         }
         var query =
             '{"query":"FOR u in ' + this.collectionID + filterstring + ' RETURN u"}';
@@ -141,14 +126,14 @@ window.arangoDocuments = Backbone.Collection.extend({
             console.log(data.result.length);
             self.documentsCount = data.result.length;
             self.totalPages = Math.ceil(self.documentsCount / self.documentsPerPage);
-        if (isNaN(this.currentPage) || this.currentPage === undefined || this.currentPage < 1) {
+            if (isNaN(this.currentPage) || this.currentPage === undefined || this.currentPage < 1) {
-          this.currentPage = 1;
+              this.currentPage = 1;
-        }
+            }
-        if (this.totalPages === 0) {
+            if (this.totalPages === 0) {
-          this.totalPages = 1;
+              this.totalPages = 1;
-        }
+            }
 
-        this.offset = (this.currentPage - 1) * this.documentsPerPage;
+            this.offset = (this.currentPage - 1) * this.documentsPerPage;
             if (self.documentsCount !== 0) {
               $.each(data.result, function(k, v) {
                 window.arangoDocumentsStore.add({
@@ -165,10 +150,12 @@ window.arangoDocuments = Backbone.Collection.extend({
             else {
               window.documentsView.initTable();
               window.documentsView.drawTable();
+              window.documentsView.renderPagination(self.totalPages);
             }
           },
           error: function(data) {
             "use strict";
+            console.error(data);
           }
         });
       },

html/admin/js/templates/documentsView.ejs

@@ -13,19 +13,14 @@
 </ul>
 
 <div id="filterHeader" style="display:none">
-    <div id="queryline">
+    <div class="queryline">
-       <label for="attribute_name">attribute name:</label><input id="attribute_name" type="text">
+       <input id="attribute_name" type="text" placeholder="Attribute name"><select name="operator" id="operator">
-       <select name="operator" id="operator">
            <option value=" == ">==</option>
            <option value=" != ">!=</option>
            <option value=" > ">&lt;</option>
            <option value=" < ">&gt;</option>
-       </select>
+       </select><input id="attribute_value" type="text" placeholder="Attribute value">
-        <label for="attribute_value">attribute value:</label><input id="attribute_value" type="text">
         <a id="addFilterItem"><i class="icon icon-white icon-plus"></i></a>
-        <a id="femoveFilterItem"><i class="icon icon-white icon-minus"></i></a>
-    </div>
-    <div id="sendFilter">
         <button id="filterSend">Filter</button>
     </div>
 </div>

html/admin/js/views/documentsView.js

@@ -23,7 +23,7 @@ var documentsView = Backbone.View.extend({
     "click #collectionNext"      : "nextCollection",
     "click #filterCollection"    : "filterCollection",
     "click #filterSend"          : "sendFilter",
-    "click #queryline #addFilterItem": "addFilterItem",
+    "click #addFilterItem"       : "addFilterItem",
     "click #confirmCreateEdge"   : "addEdge",
     "click #documentsTableID tr" : "clicked",
     "click #deleteDoc"           : "remove",
@@ -81,11 +81,19 @@ var documentsView = Backbone.View.extend({
 
   filterCollection : function () {
     $('#filterHeader').slideToggle("slow");
+    this.filter = [];
   },
 
   sendFilter : function () {
     this.filter = [];
-    console.log("hallo" + this.filter);
+    var filterlength = $('.queryline').length;
+    var i;
+    for(i=1;i<filterlength;i++){
+      if($('#attribute_name'+i).val()!=''){
+        this.filter.push(" u."+ $('#attribute_name'+i).val() + $('#operator'+i).val()+ "'" +
+        $('#attribute_value'+i).val() + "'" + $('#logicaloperator'+i).val());
+      }
+    }
     if($('#attribute_name').val()!==''){
     this.filter.push(" u." + $('#attribute_name').val() + $('#operator').val()+ "'" +
       $('#attribute_value').val() + "' ");
@@ -98,6 +106,23 @@ var documentsView = Backbone.View.extend({
   addFilterItem : function () {
     "use strict";
     // adds a line to the filter widget
+    
+    var  num = this.filter.length + 1;
+    $('#filterHeader').prepend(' <div class="queryline">'+
+       '<input id="attribute_name'+ num +'" type="text" placeholder="Attribute name">'+
+       '<select name="operator" id="operator'+ num +'">'+
+       '    <option value=" == ">==</option>'+
+       '    <option value=" != ">!=</option>'+
+       '    <option value=" > ">&lt;</option>'+
+       '    <option value=" < ">&gt;</option>'+
+       '</select>'+
+       '<input id="attribute_value' + num + '" type="text" placeholder="Attribute value">'+
+       '<select name="logicaloperator" id="logicaloperator'+ num +'">'+
+       '    <option value=" && ">and</option>'+
+       '    <option value=" || ">or</option>'+
+       '</select>'+
+       ' <a id="femoveFilterItem" data="' + num + '"><i class="icon icon-white icon-minus"></i></a>'+
+   ' </div>');
   },
 
   removeFilterItem : function (delline) {