Skip to content

Record Your Expenses in the Application

Note

This tutorial presupposes what done in Building Your First App: Personal Budget tutorial. If you have missed or skipped the previous tutorial or you want to experiment and go back, do not worry! You can import this .eap file to sync or restore with what you see in this documentation. Learn about resetting by using .eap files. If you don't use the .eap, what you see might differ slightly from the screenshots.

You will learn to record, save, delete, and browsing your expenses in "Personal Budget".

Entering and Saving Rows

You will learn to insert and save rows in the application.

What users see when they open an application is the Master Table: the table containing all the entries of an eLegere application. Users record and manipulate data by using the Master Table.

You can enter an eLegere application by clicking on the application's tile in Home > Applications. Open again the Personal Budget application from where you have left.

Help

Do not worry if you data differ from the documentation's application screenshots. They are just data examples to show functionalities.

Entering a Row

You can create an entry on the Master Table of an application by clicking on +Row button. You can find the +Row button on the upper-left corner of the table.

The Master Table highlights of green any new entry of the application not saved.

After the creation of the entry, click on any cell of the row to insert the data in the fields.

Saving a Row

Click on the Confirm Changes button () on the top bar to save any entry in a eLegere application.

The row becoming light blue means that the application has saved the row.

Modifying or Revert Changes on the Rows

You will learn to modify rows, delete rows or revert changes in the application.

Modify a Row

You can modify the data of a row by clicking on the cell that interests you and changing the information.

The table highlights changes on both new and modified saved entries with a red triangle in the upper-left corner of the cell.

The red triangle appears on the modified table's tab as well. (An application can have more than one table besides the Master. You will learn more in the tutorial on Details.)

Click on the Confirm Changes button () on the top bar to save any change in a eLegere application.

Info

If you want to reload all the table's data: click on the Refresh button ().

Delete a Row

You can delete a table entry in two ways.

First method

  1. Click on the checkboxes at the left side of the rows you want to delete.

  2. Click on the Delete icon () next to the Copy button.

  3. Click on the Confirm Changes icon () to save any change.

Hint

You can click on the checkbox at the top of the checkboxes' column to select all the rows.

If you want to deselect all the selected: click on the Deselect button () to deselect all the rows.

Second Method
  1. Click on the Row Settings icon () at the beginning of the row on the left side.
  2. Click on the red Delete Button on the pop-up strip that appears.
  3. Click on the Confirm Changes icon () to save any change.

Undo Changes

You will learn how to undo any changes to the Master Table.

Cancel All the Changes

Suppose one of the following cases:

  • You have deleted by mistake an entry.
  • You want to revert the changes on one or more entries.
  • You want to remove all the entries recorded so far.

For all the cases above, you can use the Revert Changes button.

The Revert Changes button () reverts all the changes made on the master table.

Click on the Revert Changes button () on the top bar.

Cancel Individual Changes

Suppose that you want to revert some changes while maintaining the rest of the changes.

For example:

  • You have entered a new expense and revised the cost of another entry.
  • You want to remove the expense and keep the cost update.

  • Click on the added and edited entries you want to remove.

  • Click on the Revert Changes button () on the top bar.
  • Click on Selected button to cancel only the changes selected.
  • Click on the Confirm Changes button to save the rest of the changes.

Overview of All Entries and Changes: Pending Changes

You can view the summary of all the changes on the table by clicking on the Pending Changes button.

Pending Changes lists all the changes made on the Master table.

  • Green rows are new entries.
  • Red rows are entries deleted.
  • Light blue rows are entries modified.

Pending Changes in the top bar mirrors the same color code. The number next to the green () icon counters the new entries. The number next to the yellow () icon counters the modified rows. The number next to the red () icon counters the deleted rows.

You can filter by type the different changes made in Personal Budget by clicking on the filter buttons.

If something goes wrong: Local Changes

eLegere manages your data in case you encounter an unexpected problem and you haven't saved the changes. (For example, your browser crashes or you lose your internet connection.)

eLegere tracks on your machine any modification before saving them on the server. The track is called Local Changes.

Suppose that you quit Personal Budget suddenly. Personal Budget will remind you about unsaved local changes in the applications when you return. You can decide either to restore or ignore the unsaved changes.

Clicking on the Yes button restores any change.

Applications always ask about unsaved changes when leaving.

You can decide to save the changes locally or erase them.

Click on the Yes button to save them. The application will ask to restore them at the next access.

Click on the No button to leave without saving.

Warning

eLegere saves Local Changes on the machine you were using before quitting. Accessing the application from another machine does not restore any unsaved changes. The same happens when your browser has the anonymous mode enabled during the navigation.

Searching and Sorting Rows

In this section, you will learn to search and sort rows in the application. Also, you will make acquaintance with Sessions: custom user-defined presets of search, filtering, and sorting options that you can recall with one click.

Sorting

By clicking on the Header

You can sort the entries by clicking on the header you want to sort by.

Each click makes a switch starting from ascending (), descending (), then no sorting.

If you have chosen a sorting for a column, a black tringle will appear next to the header.

You can have multiple sorting options active on the Master table. Applications order the sorting option labels from the oldest to the latest.

The list of sorting options active appears as tags on the right corner of the Master Table. The Master Table displays the sorting tags next to the View options to the upper-right corner.

By choosing the Options in the Menu

You can sort the entries of the Master table by clicking on the header's menu. Click on the icon next to a field's name and choose from the menu the order you prefer.

Removing the active Sorting options

You can delete a Sorting option by clicking on the Remove sort button () on the related tag on the upper-right corner of the table.

If you have multiple sorting options active: you can still click on the icon to remove a Sorting tag. But you can remove the sorting options all at once by clicking on the Clear Sort button ().

Set up the Sorting for Personal Budget by Descending BudgetDate and Descending BudgetTime fields.

Filtering

You can filter the entries of Personal Budget in different ways.

Search Bar and Filtering

You can search a value within a table field.

  1. Click on the search bar below a field's header.

  2. Type the value you would like to search. (E.g. "Pizza")

The Master table will display only the rows satisfying the search.

Hint

In case you have many columns in your table: you can search the table's columns as well.

You can search a particular column in the following way.

  1. In the upper-right corner of the table, click on the Search Columns button ().

  2. A textbox will appear. Type the name of the column you are looking for. The user interface will highlight the columns satisfying the search. The search will scroll to the first result.

Right-Click Filtering

As alternative, you can right-click on the table and filter by a value.

Right-Click filtering on the table is quick. But filters through the Filtering menu are more powerful and have more options.

Filtering Menu

Search Bar and Right-Clicking are fast ways to filter your entries. If you need powerful and flexible options for filtering, use the Filtering Menu of table headers.

For instance, suppose that you need to filter the entries of the table by BudgetValue, BudgetDate, and Notes field. In particular:

  • Showing only the expenses in BudgetValue.
  • Showing in BudgetDate only the entries of the current month.
  • Showing only the entries with non-empty Notes field.

Personal Budget must display all the data satisfying the filters above.

  1. Click on the icon next to BudgetValue. A drop-down list of filtering options will appear.
  2. Navigate to Filter, choose the option Less than and insert 0 as value.
  3. Click on the Filter button to apply the filter to BudgetValue.

  1. Click on the icon next to BudgetDate. A drop-down list of filtering options will appear.
  2. Navigate to Filter, choose the option After or equal to and insert the first of the current month as value.
  3. Click on the Filter button to apply the filter to BudgetDate.

  1. Click on the icon next to Notes. A drop-down list of filtering options will appear.
  2. Navigate to Null values, choose the option Exclude Null.

Removing Filters

You can apply multiple filters to the same table. Multiple filters enables to view only the data satisfying the criteria.

Remove a filtering option by clicking on the Remove filter button () on the related tag.

If you want to remove all the filters from a table: click on the Clear Filters button (). As alternative, click icon above textboxes to cancel the single filter.

Clicking on the icon of the top-left corner of the Master table offers more advanced filtering options.

This tutorial does not cover these advanced filtering options. (Refer to the Advanced Features section of eLegere Documentation to know more.)

View and Display Settings

In eLegere, you can customize the view and display settings of the table. For example: columns' size, items per page, row height, and font size.

Here some tools you can use to help you with displaying the entries in the table.

Columns Size

You can resize any column of the Master table. Drag & drop the column from the right side to choose the size.

Items per Page

You can choose how many entries the table shows in one page. (The default is 20 items.)

Click on the items counter in the upper-right corner of the table.

Row Height

If the cells are too small, you can modify the height.

  • Click on the icon to enlarge the cells
  • Click on the icon to shrink the cells.

Font Size

You can enlarge the font to improve the readability.

  • Click on the icon to enlarge the font.
  • Click on the icon to shrink the font.

Save your Searches and Sorts for the next time

What is a Session?

Sessions save sorting, filters, row heights, font and columns size (and much more) that you have applied to to the Master table for the next access.

Sessions are presets of sorting options, filters, and view settings that you can create and recall at any time within an application with one click. Using Sessions avoids to select all the filtering, viewing, and sorting options all over again at every access.

Work with Sessions

You can save your custom sorting, filters, and column resizes by clicking on the Save Session As button ().

You can find Save Session As button on the top-right corner of the top black bar.

Suppose that you have to save the sorting by BudgetDate and BudgetTime fields and the Notes column resize for the future. You can save such options by using a Session.

  1. Click on Save Session As button ().
  2. A window will appear where you can type the name of the Session and choose the color. Name the Session By Date and Time and choose a color.

  1. Click on Save to save the Session and exit.

Your session sorted by Date and Time is now saved.

After you have saved your first session in the application, other icons will appear next to Save Session As.

The buttons in the black top bar speed up your operations with Sessions.

The Sessions button () opens a drop-down list. You can select from the drop-down list the preferred Session without leaving the application.

The Save Session button () saves any changes to the Session you have made.

The Save Session As button () enables to save the current session with another name. Save Session As helps in case you want to duplicate or have a copy to be modified of the current Session.

The Reopen Current Application using an Empty Session button () reloads the application without any sorting or filters.

Sessions Page and Default Sessions

Suppose that you want to enter Personal Budget and find the Date and Time Session loaded automatically.

You can choose a Default Session through the Sessions Page.

  1. Click on the Sessions button () and open the drop-down list.

  2. Click on the Sessions Page button.

    You will access the Session Page. The Sessions Page shows all the Sessions available for Personal Budget and other options (e.g. Export and Sharing options). Also, you can select another Session to be loaded.

  3. On the By Date and Time Session tile, click on the Default toggle switch. The action makes the Session the default one when launching Personal Budget.

  4. Click on the Session's tile to go back to Personal Budget. This action reloads all the filtering and sorting options available that you have saved with the Session.

Congratulations, you have created the By Date and Time session for Personal Budget and set it as default.

Info

Sessions can save more than sorting, filtering, and column size options. This tutorial does not cover these advanced features of Sessions. Refer to the Advanced Features section of eLegere Documentation to know more.

Success

The next step is learning how to customize the appearance of Personal Budget application: Customizing the Application's Appearance