evercode1 · February 12, 2017 22:15 · Feb 12, 2017 · Feb 12, 2017
diff --git a/LessonCreateCategory.vue b/LessonCreateCategory.vue
@@ -71,8 +71,7 @@
             filterSubcategories () {
 
                 this.suboptions = this.subcategories
-                .filter(subcategories =>
-                subcategories.category_id == this.selected);
+                .filter(subcategories => subcategories.category_id == this.selected);
 
             }
 

diff --git a/LessonCreateCategory.vue b/LessonCreateCategory.vue
@@ -0,0 +1,97 @@
+<template>
+    <div>
+
+        <!-- Category Select Form -->
+
+        <div class="form-group">
+
+            <label for="category_id">Category Name:</label>
+
+            <select v-model="selected"
+                    class="form-control"
+                    name="category_id">
+
+                <option value="">Please Choose One</option>
+
+                <option  v-for="catoption in catoptions"
+                         v-bind:value="catoption.id"
+                         >{{ catoption.name }}</option>
+
+            </select>
+
+
+        </div>
+
+        <!-- Subcategory Select Form -->
+
+        <div class="form-group" v-if="selected > 0">
+
+        <label for="subcategory_id">Subcategory Name:</label>
+
+        <select class="form-control" name="subcategory_id">
+
+            <option value="">Please Choose One</option>
+
+            <option v-for="suboption in suboptions"
+                    v-bind:value=" suboption.id ">
+                    {{ suboption.name }}</option>
+
+        </select>
+
+        </div>
+
+    </div>
+
+</template>
+
+<script>
+
+    export default {
+
+        props: ['subcategories', 'categories'],
+
+        data () {
+
+            return {
+
+
+                selected : '',
+
+                suboptions: [],
+
+                catoptions: []
+
+
+            }
+
+        },
+
+        methods: {
+
+            filterSubcategories () {
+
+                this.suboptions = this.subcategories
+                .filter(subcategories =>
+                subcategories.category_id == this.selected);
+
+            }
+
+        },
+
+        watch: { 'selected': function() {
+
+                this.filterSubcategories();
+
+                }
+
+        },
+
+
+        created () {
+
+            this.catoptions = this.categories;
+
+        }
+    }
+
+</script>