Create a widget button

Introduction

Welcome to the tutorial where you will create your very first interactive buttons with Casewhere.

In this tutorial, you will learn how to make three button named "Add New Book", "Edit Book", and "Delete Book" on the top of your page interface.

Every time a user clicks those button, a pop-up will appear and allow the user to fill in a new record of book's info with title, genre, price, and purchase date.

Guide

  • Step 1. In Casewhere Admin site, navigate to Pages

Choose the pages name "book-list" that you already made in create a page step.

  • Step 2. In the Main grid widget, click New Action to...

image-20211110091556052

Select Trigger a workflow

Field name Actions
Name Fill in "Add New Book"
Label Fill in "Add new book"
Workflow Definition Select "Add New Book"
Supported Processes Select "Cw Book Management"

image-20211112111947156

Click Save image-20211112112137473

Voilà! You just added the very first button to your page.

Reload your page and you should see the button now.

image-20211112112358295

Test

  • Step 1: Reload your page

    Click Add New Book button

  • Step 2: Fill in a data set

Title Genre Price Purchase Date
War and Peace Fiction 60.000 20/05/2021

image-20211110095124182

Click Save and close

Voilà! "War and Peace" was added in your book list. image-20211112112650621

Try it! Add a few more books to your list. image-20211112112722595

Ready to continue? You are ready to move to the next step - Create edit-object workflow