Skip to content

Latest commit

 

History

History
214 lines (110 loc) · 13.4 KB

sample-apps.md

File metadata and controls

214 lines (110 loc) · 13.4 KB
description
This section has a bunch of applications built on Appsmith to answer some common questions asked by our community. You can fork the application to access it in edit mode.

Sample Apps

Working with Tables

How to add data into a table from an API/Query?

How to populate a table from a JS Object?

How to implement a Search/Filter functionality in a table? (MongoDB)

How to add a server-side search to a table?

How to add a server-side filter to a table? (MongoDB)

How to add a server-side filter to a table? (PostgreSQL)

How to generate UUID for table data?

How to generate sequential IDs for table data?

How to trigger an action on row selection?

How to conditionally change a table cell color?

How to reset a table widget using the resetWidget() method?

How to use the editable table?

Server-side Pagination

How to do pagination with PostgreSQL?

How to do pagination with MongoDB?

How to do pagination with Google Sheet?

How to do pagination with GraphQL?

How to add pagination to a Table Widget?

How to add pagination to a List Widget?

How to add pagination to a Select?

Bulk insert/update

How to bulk insert data into MongoDB (Upload CSV)?

How to bulk update data from MongoDB?

How to bulk insert data into Postgres (Dynamic inputs)?

How to bulk update data from Postgres?

Queries/Apis

How to pass arguments to APIs/Queries' run() method?

How to run APIs/Queries in sequence?

How to run multiple queries on a click event?

How to use the params received by APIs/Queries?

How to use values of queryParams in an API/Query?

How to send dynamic header value to an API?

How to create a GraphQL (Hasura) query to fetch table data?

How to write a RAW MongoDB query to update the document?

JS Object & Promises/Async-Await

How to populate a table from JS Object?

How to pass arguments to a JS function?

How to handle JS Promises (Chaining)?

How to handle JS Promises (Callbacks)?

How to use JS Async-Await?

How to run an API/Query (action) from a JS function?

How to run multiple actions from a JS function?

How to insert values from MultiSelect into Separate Rows in Google Sheets using async/await?

Forms

How to do form field validation?

How to add dynamic input fields to a form?

Charts

How to create charts?

How to create a pie chart?

How to create a custom chart (using Fusion Charts)?

Appsmith Framework

How to use the Appsmith store - storeValue()?

How to add or delete a property from the Appsmith store?

How to work with Persistent Store vs Session Store?

How to open a modal on button click - openModal()?

How to close a modal on button click - closeModal()?

How to reset a widget - resetWidget()?

How to navigate to another page/website - navigateTo()?

How to use queryParams - {{appsmith.URL}}?

How to dynamically hide/show a widget?

How to dynamically change the value of a widget?

Date-Time

How to use date input (DatePicker Widget)?

How to build a custom time picker?

How to set a Min and Max date limit for a DatePicker?

How to manipulate the selected date?

How to format dates with the MomentJs library?

How to set the date of the Date Picker on a button click?

How to display the current date and time in real-time?

Widgets

How to populate a list widget from query/API response data?

How to trigger an action on list widget item selection?

How to get the Base64 string of a captured image from the camera widget?

How to get the image URL of a captured image from the camera widget?

How to upload camera widget output to a database (MongoDB)?

How to use the progress bar widget?

How to upload a file to your app (using Filepicker Widget)?

How to conditionally show an asset either in an Image or in a Video widget?

How to set selected values of a MultiSelect widget dynamically?

How to set custom markers on a map?

UI Components

How to create a custom header & footer for the app?

How to create a sidebar for navigation for the app?

How to create an Image Carousel?

Utility

How to build a simple counter app?

How to build a simple calculator app?

How to embed HTML in the app (using iframe Widget property srcDoc)?

How to parse XML data (using JS Object)?

How to read a CSV file?

How to convert a CSV file to JSON (using JS Object)?

How to merge data from two different queries (using JS Object)?

How to decode HTML entities?

How to create a basic HTML editor?

How to automatically update data on a table using setInterval() and clearInterval()?

How to merge the data of 2 CSV files by the ID column and display it in a Table widget?

How to download a PDF File From a URL?

How to generate and download a PDF from a Form widget using APITemplate.io?

How do I do X on Appsmith?

Live streams and apps of our community calls, where we discuss some of the frequently asked questions on our Discord, and Intercom.

Session #1: Video Link, Template Link | Topics Covered: Combining multiple queries, Dynamic queries, Switching between tabs, JS Promises, Dynamically adding widgets.

Session #2: Video Link, Template Link | Topics Covered: Pagination, Bulk Uploads, Appsmith Framework