🏠
Property Directory Template
  • Overview
  • Quick Start
    • Quick Start Overview
    • Removing Demo Workflows
    • Uploading Custom Logo
    • Deleting Demo Property Listings
    • Adding Google API Keys
  • Pages
    • Pages Overview
    • Index (homepage)
    • Property
    • Sign in
    • Dashboard
  • Reusable Elements
    • Views-add-listing
Powered by GitBook
On this page
  • Overview
  • Page components
  • Functionality
  1. Reusable Elements

Views-add-listing

PreviousDashboard

Last updated 2 years ago

Overview

This is the section of the dashboard where real estate agents add new property listings.

Page components

The views-add-listing reusable element has a number of inputs/checkboxes(icons)/uploaders that allow the real estate agent to add details on the property listing they are creating.

Functionality

Most of the functionality is relatively straightforward - the user inputs data into the various inputs and when the "create listing" button is clicked a workflow is triggered that creates a new property type.

However, there are two pieces of functionality that are a bit more complex:

Selecting a Category

The user has the option to choose categories for the property listing they are creating.

These choices are based on the Categories option set. You can change any of the categories, or add a new one, but editing the option set in the Data tab of your bubble editor.

When an unselected category is clicked on the views-add-listing reusable element, the below workflow is triggered (second one in the image).

This workflow adds the category selected to a custom state on the reusable element (custom state name: categories). When a category is in the custom state categories, a conditional statement changes the associated icon from an empty circle, to one with a tick in it.

Similarly, when a selected category is "unticked", the category is removed from the custom state and the icon changes back to an empty circle.

When the "Create Listing" button is clicked, a workflow adds the categories selected to the Categories field associated with that property listing.

Uploading Images

Each property listing has 3 images associated with it. The real estate agent can upload images by clicking on the "uploader" elements on the views-create-listing reusable element.

Once an image is uploaded, the below workflow is triggered:

It saves the uploaded image to a custom state on the parent group, hides the uploader and shows a group element that displays the image that has just been uploaded.

This workflow also shows a "close" icon, that is used to remove the image if the user wishes to upload an alternative one.

Selecting a category
Categories option set in bubble.io database
Conditional statement on icon circle for choosing categories
3 uploader elements
When FileUploader Image1's value is changed