Skip to main content
Data Source binding lets a flow component pull values from a record stored in MileApp’s Data Source menu. When a worker picks an entry on the mobile app — for example a store, customer, or SKU — the form’s other fields auto-fill from that record, so the worker does not have to re-type information that already exists in master data. Only three component types can bind to a Data Source: Input, List, and Bill. Each one uses the same workflow but with slightly different reserved keys.

When to Use Data Source Binding

  • Master data lookups — Customer details, store info, product catalogs, staff records
  • Auto-fill on selection — Pick a customer once and have phone, address, and coordinate populate automatically
  • Consistent data entry — Field workers select from a validated list instead of typing free text
A Data Source must exist in the Data Source menu before it can be bound to a component. See Data Sources for how to define one.

Binding an Input Component

Data Source binding for an Input component is configured inside the component’s own settings panel, not in the Configuration tab. The settings appear after you turn the Use data source toggle on.
Input component data source binding

Data Source settings on an Input component

Input Data Source settings:
  1. Use data source — Toggle on to enable Data Source binding. The Data Source section appears underneath the Required/Visible/Use data source row.
  2. Data Type — Dropdown listing every Data Source defined in your organization. Pick the one to bind to (e.g., Data_Toko, staff_data).
  3. Search From Column — Column on the Data Source that the worker searches by. This is the column the mobile app shows in the lookup dropdown — for example “Order ID” lets the worker type or scan an order number to find the row.
  4. Field Mappings — Each row maps one Data Field (column on the Data Source) to a Component in the current flow. When the worker selects a record, every mapped field’s value is written into the corresponding component on the form. Click Add Mapping to add another row.

How to Configure an Input Data Source

  1. Open the Input component in the Flow Builder.
  2. Turn on Use data source.
  3. In Data Type, select the Data Source to bind to.
  4. In Search From Column, pick the column the worker will use to find a record. The component the worker is currently editing is the lookup trigger — typing or scanning here opens the Data Source picker.
  5. Under Field Mappings, click Add Mapping for each value you want auto-filled, then choose a Data Field and the Component to receive its value.
  6. Click Save.
When a task is created, the worker types or scans into the Input field, picks a record from the suggestion list, and every mapped component is populated from that record automatically.

Binding a List Component

The List component binds to a Data Source so the worker can pick items from a master product list (instead of typing each item by hand). The mapping uses two reserved keys.
List component data source binding

Data Source settings on a List component

List Data Source settings:
  1. Data Type — Pick the Data Source to bind to. It must have at least one Text field and one Number field.
  2. Search From Column — Column on the Data Source that the worker searches by when adding a new list row.
  3. Field Mappings — Two reserved keys must be mapped before the binding works:
Reserved KeyMaps ToRequired Data Source Field Type
Item TitleThe name displayed for each list rowText
Item QtyThe quantity entered for that rowNumber

How to Configure a List Data Source

  1. Open the List component in the Flow Builder and turn on Use data source.
  2. In Data Type, select the Data Source to bind to.
  3. In Search From Column, pick the column the worker will use to find a record.
  4. Under Field Mappings, map Item Title to a Text field on the Data Source and Item Qty to a Number field.
  5. Click Save.
On the mobile app, the worker picks a row from the Data Source and the list row’s title and quantity prefill from that record.

Real-World Example: Warehouse Stock Picking

A warehouse operator runs a daily picking task to fulfill outbound orders. Typing every SKU by hand is slow and error-prone, so the flow uses a List component bound to the data_barang (product master) Data Source. Data Source — data_barang:
ColumnTypeExample
sku_codeTextSKU-1042
product_nameTextMie Goreng 85g
stock_availableNumber250
List component setup:
  • Data Typedata_barang
  • Search From Columnsku_code (operator scans the SKU barcode)
  • Field Mappings:
    • Item Titleproduct_name
    • Item Qtystock_available
Result on the mobile app:
  1. The operator scans the product barcode SKU-1042.
  2. The list automatically adds a new row with the product name Mie Goreng 85g and a default quantity of 250 (the current available stock).
  3. The operator changes the quantity to match the actual amount picked from the warehouse shelf.
  4. The operator scans the next SKU and repeats the same steps until every item on the order is collected.
Because every product name comes directly from the master data, the list is always consistent — there is no risk of typos like “mi goreng” or “Mie Gorengg” that would make later reporting difficult.

Other Common List Use Cases

  • Field sales canvassing — Sales rep picks products from the company catalog into a daily call list, defaulting each row’s qty to the recommended order size
  • Asset inventory — Technician opens a checklist of equipment at a site and confirms the count on hand
  • Inspection survey — Auditor uses a fixed list of inspection items pulled from a quality-control master Data Source

Binding a Bill Component

The Bill component is similar to List, with one extra reserved key for pricing. Bill also has an Add-on section where you define discounts or surcharges separately from the Data Source.
Bill component data source binding

Data Source settings on a Bill component

Bill Data Source settings:
  1. Data Type — Pick the Data Source to bind to. It must have one Text field and two Number fields.
  2. Search From Column — Column on the Data Source that the worker searches by when adding a new bill line.
  3. Field Mappings — Three reserved keys must be mapped before the binding works:
Reserved KeyMaps ToRequired Data Source Field Type
Item NameThe name displayed for each bill lineText
Item QtyThe quantity entered for that lineNumber
Item PriceThe unit price used for the total calculationNumber
  1. Add-on — Optional discounts or surcharges that adjust the bill total. Add-ons are defined directly on the component (not pulled from the Data Source); pick the Add-on Type, name it, and set the price/surcharge.

How to Configure a Bill Data Source

  1. Open the Bill component in the Flow Builder and turn on Use data source.
  2. In Data Type, select the Data Source to bind to.
  3. In Search From Column, pick the column the worker will use to find a record.
  4. Under Field Mappings, map Item Name to a Text field on the Data Source, and both Item Qty and Item Price to Number fields.
  5. (Optional) Add any Add-on rows for discounts or surcharges that should apply to every bill created from this flow.
  6. Click Save.
Each bill line then prefills the name, quantity, and unit price from the selected Data Source record, and the total recalculates automatically (including any configured add-ons).

Real-World Example: Retail Sales Order

A field sales rep visits a retail store and writes a sales order on the mobile app. Prices and product names must come from the company’s authoritative price list — not be typed by hand — so the flow uses a Bill component bound to the data_barang Data Source. Data Source — data_barang:
ColumnTypeExample
sku_codeTextSKU-1042
product_nameTextMie Goreng 85g
default_qtyNumber12
unit_priceNumber3500
Bill component setup:
  • Data Typedata_barang
  • Search From Columnsku_code
  • Field Mappings:
    • Item Nameproduct_name
    • Item Qtydefault_qty
    • Item Priceunit_price
  • Add-on:
    • DiscountLoyal Customer Discount-5000
    • SurchargeDelivery Fee15000
Result on the mobile app:
  1. The sales rep scans the product barcode SKU-1042.
  2. The bill automatically adds a new line with the product name Mie Goreng 85g, quantity 12, and unit price 3500. The line subtotal becomes 42.000 (qty × price).
  3. The rep can edit the quantity if the customer orders more or less than the default.
  4. The bill total sums up every line, then applies the configured Add-ons: subtracts 5.000 for the Loyal Customer Discount and adds 15.000 for the Delivery Fee.
  5. When the rep finishes the task, the final bill total and every line item are saved on the task and exported with the rest of the task data.

Other Common Bill Use Cases

  • Service technician callouts — Technician picks repair services from a price list; total is calculated for the customer to pay on the spot, with a fixed call-out fee added via an Add-on
  • Restaurant / food delivery — Driver records the items delivered, with prices pulled from the menu master; a packaging surcharge can be applied as an Add-on
  • Field installation billing — Installer selects parts used from a parts catalog; labor is added as an Add-on surcharge per visit