Form with Repeatable Group using Vue JS and Google Sheets | Part-I

Поделиться
HTML-код
  • Опубликовано: 22 авг 2024
  • #googlesheets #vuejs #forms #appsscript #dynamicform
    In today's video, I'll walk you through creating forms with repeatable form groups-think nested forms for more complex data structures. This is super handy for things like event management or, as I'll demonstrate, creating invoices with multiple items.
    We'll use an Expense Entry form as an example, showcasing the repeatable feature. The form covers expense date, type, repeatable expense items with category and amount, payment methods, and notes. Dynamic computation of the sum total, conditional display of form elements, and even full form validation support are also part of the package.
    But wait, there's more! In the second part of this tutorial, we'll make the table view look sleek and add action buttons for viewing, editing, and deleting entries.
    Ready to dive in? I'll guide you step by step, starting from scratch. We'll deploy the script, add frameworks like Vue.js, Vue Formulate, and Buefy for a smoother development experience. You'll see the magic happen as we test deployments and tweak the HTML to incorporate these tools.
    By the end, we'll have a fully functional form, sending data seamlessly to a spreadsheet. I'll explain how Tamotsu ORM makes read-write operations a breeze, with the added bonus of a test deployment URL for continuous updates.
    Finally, we'll wrap up with a quick demo, showcasing the submitted data in a clean table view. I'll provide a code overview, detailing how the server-side and client-side code interact to make this happen.
    Links & References:
    Part-II
    • Form with Repeatable G...
    Demo Link:
    script.google....
    Spreadsheet Link:
    docs.google.co...
    Vue Formulate :
    vueformulate.c...
    Buefy Framework:
    buefy.org/
    Vue JS:
    vuejs.org/
    If you find this tutorial helpful, don't forget to subscribe for more content. Thanks for tuning in, and I'll catch you in the next one! 👩‍💻🚀

Комментарии • 10

  • @zohairdilawar116
    @zohairdilawar116 5 месяцев назад

    Good job, just can't wait for the next video

  • @zohairdilawar116
    @zohairdilawar116 5 месяцев назад

    Good job, just can't wait for the next video . Hope it has CRUD features.

  • @hic1802
    @hic1802 5 месяцев назад

    thêm phần đơn giá và tổng tiền nữa thì tuyệt vời

  • @user-hk2jb2js4v
    @user-hk2jb2js4v 5 месяцев назад

    Good work

    • @tech-lever
      @tech-lever  5 месяцев назад

      Thank you so much 😀

  • @user-sk7ci3sr8d
    @user-sk7ci3sr8d 5 месяцев назад +1

    Great 👍 Hope u will add delete action button with password
    And if possible admin and user login❤

  • @sarathkumar-gu7zx
    @sarathkumar-gu7zx 24 дня назад

    Please share how to hide the "the application was created by a google appscript user"

  • @bloggerkickstart9060
    @bloggerkickstart9060 4 месяца назад

    please share access public

  • @user-qz7lw1ip3b
    @user-qz7lw1ip3b 2 месяца назад

    give me code

  • @arjunshakya1396
    @arjunshakya1396 5 месяцев назад

    Source code provide pls