diff --git a/app/javascript/packs/filter_grep_setting.js b/app/javascript/packs/filter_grep_setting.js
index 1c36d54..6a37959 100644
--- a/app/javascript/packs/filter_grep_setting.js
+++ b/app/javascript/packs/filter_grep_setting.js
@@ -1,4 +1,6 @@
+/* global _ */
 "use strict";
+import "lodash/lodash";
 
 import GrepContainer from "./grep_container";
 
@@ -10,7 +12,10 @@ $(document).ready(() => {
     },
     data: function() {
       return {
-        index: 0
+        containers: {
+          and: [true],
+          or: [true]
+        }
       };
     },
     mounted: function() {
@@ -19,10 +24,16 @@ $(document).ready(() => {
     },
     methods: {
       addGrepContainer: function(containerType, index) {
-        this.index += 1;
+        let found = this.containers[containerType].indexOf(false);
+        if (found < 0) {
+          this.$set(this.containers[containerType], this.containers[containerType].length, true);
+        } else {
+          this.$set(this.containers[containerType], found, true);
+        }
       },
       removeGrepContainer: function(containerType, index) {
-        this.index -= 1;
+        this.$set(this.containers[containerType], index, false);
+
       }
     }
   });
diff --git a/app/views/shared/vue/_filter_grep_setting.html.haml b/app/views/shared/vue/_filter_grep_setting.html.haml
index 95e9721..115f224 100644
--- a/app/views/shared/vue/_filter_grep_setting.html.haml
+++ b/app/views/shared/vue/_filter_grep_setting.html.haml
@@ -3,21 +3,15 @@
 = render "shared/vue/grep_container"
 
 #filter-grep-setting
-  %grep-container{"v-bind:container-type" => '"and"',
-                  "v-bind:index" => "0",
-                  "v-on:add-grep-container" => "addGrepContainer",
-                  "v-on:remove-grep-container" => "removeGrepContainer"}
-  %template{"v-for" => "n in index"}
-    %grep-container{"v-bind:container-type" => '"and"',
-                    "v-bind:index" => "n",
+  %template{"v-for" => "(enabled, i) in containers.and"}
+    %grep-container{"v-if" => "enabled",
+                    "v-bind:container-type" => '"and"',
+                    "v-bind:index" => "i",
                     "v-on:add-grep-container" => "addGrepContainer",
                     "v-on:remove-grep-container" => "removeGrepContainer"}
-  %grep-container{"v-bind:container-type" => '"or"',
-                  "v-bind:index" => "0",
-                  "v-on:add-grep-container" => "addGrepContainer",
-                  "v-on:remove-grep-container" => "removeGrepContainer"}
-  %template{"v-for" => "n in index"}
-    %grep-container{"v-bind:container-type" => '"or"',
-                    "v-bind:index" => "n",
+  %template{"v-for" => "(enabled, i) in containers.or"}
+    %grep-container{"v-if" => "enabled",
+                    "v-bind:container-type" => '"or"',
+                    "v-bind:index" => "i",
                     "v-on:add-grep-container" => "addGrepContainer",
                     "v-on:remove-grep-container" => "removeGrepContainer"}