Arrow
Intermediate

Adding action elements to spreadsheets

Learn how to add buttons and input fields as well as the difference between a Form and a Table with live spreadsheets.

IntroAnchor Icon

So, you know how to publish your spreadsheet, but, it doesn’t really look like much. Let's see how to make it a bit more interactive for the user by adding some action elements. In this article, we'll learn how to use:

  • Buttons
  • Input fields
  • Forms and Tables

Let's go 🚀!

ButtonsAnchor Icon

Buttons let you execute a function only when you click them - a simple but very cool tool for any spreadsheet.

Let’s add one!

  1. In the spreadsheet you created, select cell D2.
  2. In the editor bar, go to More action elements and select Button. kb-action-elements-buttons-newUI
  3. Enter Find as the label, and click Create.

❇️ Done! Now to make the button actually do something, we need to use an IF() statement: if clicked, do this; if not, don’t do anything.

For this app, we want to execute SEARCH_COMPANIES_AT_EVENT_CRUNCHBASE() when someone clicks the button (so that they can find all the companies that attended a given event).

So, in cell E2, type in the following IF() statement:

kb-int-button-function

And now, let's try it out!

  1. In cell A2, type in Web Summit 2017.
  2. In cell B2, type in >50
  3. Click Find. You'll see that E2 now has a {companies} cell. Perfect!

Now, if you change A2 to Web Summit 2018, you'll see that nothing happens. That’s because the function will only execute when you click the button.

Tip IconLearn more about buttons

We don’t want to bore you on just how cool buttons are - but if you’d like to learn more about them, check out our Buttons article.

Input fieldsAnchor Icon

Input fields let users enter data themselves into a live spreadsheet. In our case, we want users to be able to enter events, employee ranges, and locations. To do that, all we need to do is:

  1. Select cells A2, B2, and C2.
  2. In the editor bar, go to More action elements and select Input field. kb-action-elements-input-boxes-newUI

✳️ Done! Now in the live spreadsheet, users will be able to enter data into your spreadsheet :).

Tip IconCheckboxes

If you're looking for checkboxes - don't fret. We do that too! We'll cover them in the last article of this course.

Publishing optionsAnchor Icon

Whenever you publish a spreadsheet, you can choose whether a table is a Form or a Table. What’s the difference?

Do you want your users to...Then choose...Good for...
See changes made by everyone?TableTeam reports
See only their own changes?FormCalculators and forms

In our case, we want each of our users to have a separate calculator (that is, we don't want them to see results of other users' searches). So what should we use, a Form or a Table?
📬 Answer: Form

To change whether your table is a Table or a Form, just click the drop-down menu next to the title of your table, and select which option you want.

kb-forms-and-tables-newUI

Caution IconForm limits

There's just a few things you need to know about Forms:

  • You can’t send data from a Table to a Form.
  • You can’t reference cells in a Form in a Table.
  • Forms do not support REPEAT(), REFRESH(), and SCHEDULE() functions.

But don’t worry - we detect these limitations in real time and let you know if you need to change something.

Up nextAnchor Icon

So, we’ve got that dynamic interactivity down. Great!. But now, you probably want to know what to do with that data in cell E2. So, in the next part of the course, we'll show you how to manually parse the data you get back.