add option to select previous menuitems

templates/food_vendor/show.html.twig

@@ -7,10 +7,6 @@
 
     <table class="table">
         <tbody>
-            <tr>
-                <th>Id</th>
-                <td>{{ food_vendor.id }}</td>
-            </tr>
             <tr>
                 <th>Name</th>
                 <td>{{ food_vendor.name }}</td>

templates/order_item/new.html.twig

@@ -7,5 +7,24 @@
 
     {{ include('order_item/_form.html.twig') }}
 
+    <div>
+       <b>click a button to select a given menuitem</b>
+    </div>
+    <div>
+        {% for menuItem in menuItems %}
+            <button data-menu-item>{{ menuItem.name }}</button>
+        {% endfor %}
+    </div>
+
+    <hr />
+
     <a class="button" href="{{ path('app_food_order_show', { 'id': food_order.id}) }}">back to list</a>
+
+    <script>
+        document.querySelectorAll('[data-menu-item]').forEach(function(element) {
+            element.addEventListener('click', function(e) {
+                document.getElementById('order_item_name').value = e.target.textContent
+            });
+        });
+    </script>
 {% endblock %}