1. "Fabrik 4" helpers needed!

    You are invited to join other community members active in coding, maintaining and improving Fabrik. Please visit https://fabrik.help for more information!
    Dismiss Notice

Autofill form plugin

Sep 21, 2020
Autofill form plugin
  • The autofill plugin allows you to fill in fields based on a look up on a different list.

    Use appropriate field types. E.g. don't "fill" a calc element, it won't store the value but calculate your code.

    The data entered from the list is NOT dynamic, so if your form observers a user list, and you create a record autofilled in from the user 'John', and then later on you change that user's name to 'John Smith' then this form's record will still contain the value 'John'

    If you are looking for dynamic links between data you should be using list joins


    • Connection - The fabrik connection that contains the lookup list
    • List- the Fabrik list that contains the data to insert into the form's elements. This will usually be a different list, but it can be the same one your form is on, allowing you to select other row data from the same list to either base a new row on, or edit (see "Edit original Record" below).
    • Lookup field - A field in the lookup list. The autofill will return a record from the lookup list where this fields value matches the observed field's value.
      If left empty the plugin presumes that the record to use has a primary key value the same as the 'Field to observes' current value
    • Field to observe - the field which should contain the primary key of the list specified in the 'List' dropdown. If no trigger element specified, the autofill lookup will be performed when this element blurs or changes
    • Map data - a JSON object, where the key value is the lookup table's full element name, and the value a full element name of one of the current form's elements. So in the image, data will be taken from 'countries___label' and placed in 'elementtest___name'

    • Trigger - If selected, this should be a button element, when clicked the autofill lookup will occur
    • Edit original record - If set to yes, then when the auto fill lookup is performed and a match found the form's row id is changed to that of the matched record, meaning that you will edit the original record. NOTE - you should only ever set this to Yes if the list you are using to take the autofill data from is the same list your form is built on.
    • confirm - When the trigger element blurs or is clicked, do you want a confirmation box to appear asking the user if they want the fields to be auto-filled
    • Autofill on load - If creating a new record, and this option is set to yes then the autofill will be performed when the form is loaded. In addition trigger events will still be used

    Advanced map features(top)

    To fill fullname with both first name and last name from the lookup list:
    Code (Text):

    {"{h1qku_comprofiler___firstname} {h1qku_comprofiler___lastname}":"form_plugin_autofill___fullname"}
    In case of multiple fields to be updated you could add several mappings so that a multiple update could be perform in a single call. Just add all the mappings in the following form :
    Code (Text):


    Javascript Events(top)

    The plugin fires two events, fabrik.form.autofill.update.start and .end. The start event can be used to modify data before inserting it into the form. For example, if you are autofilling a field which has number formatting applied, you will need to manually format the data, because the string you get from autofill will not have the field's formatting applied. So you would create a ./components/com_fabrik/js/form_X.js file (where X is the numeric ID of your form), and do this:

    Code (Text):

    requirejs(['fab/fabrik'], function() {
        Fabrik.addEvent('fabrik.form.autofill.update.start', function(form, data) {
           data.table___element = Number(data.table___element).toLocaleString("es-ES", {minimumFractionDigits: 2});
           data.table___element_raw =  data.table___element;
    Modify the table___element names to suite, and use the locale string you need.
  • Loading...
algiz, rongame, ae2c2 and 1 other person like this.