diff options
-rw-r--r-- | view/html/recipe-edit.html | 27 |
1 files changed, 21 insertions, 6 deletions
diff --git a/view/html/recipe-edit.html b/view/html/recipe-edit.html index 18c4ab0..b5fea1d 100644 --- a/view/html/recipe-edit.html +++ b/view/html/recipe-edit.html @@ -29,14 +29,17 @@ <p> <label>Notes</label> <textarea name="notes" rows="4" cols="50">{{.Notes}}</textarea> - </p>{{range .Steps}} + </p> - <section> - <label>Text</label> - <textarea rows="4" cols="50">{{.Text}}</textarea> - <button type="button" onclick="parentNode.remove();">remove</button> - </section>{{end}} + <div id="steps">{{range .Steps}} + <section> + <label>Text</label> + <textarea rows="4" cols="50">{{.Text}}</textarea> + <button type="button" onclick="parentNode.remove();">remove</button> + </section>{{end}} + </div> + <button type="button" onclick="addNewStep();">add step</button> <button type="submit">save</button> <button onclick="window.location.href='/recipe/{{.Id}}';">cancel</button> </form> @@ -84,6 +87,18 @@ console.error('Network error:', error); }); } + + function addNewStep() { + var newStep = document.createElement("section"); + newStep.innerHTML = ` + <label>Text</label> + <textarea rows="4" cols="50"></textarea> + <button type="button" onclick="parentNode.remove();">remove</button> + `; + + var steps = document.querySelector("#steps"); + steps.appendChild(newStep); + } </script> </body> </html> |