--- title: "How to: Add Key/Value Pairs With a Conditional Value Using the Create Field Operator" slug: "create-field-operator-adding-keyvalue-pairs-with-a-conditional-value" updated: 2025-12-23T15:45:59Z published: 2025-12-23T15:45:59Z canonical: "docs.unqork.io/create-field-operator-adding-keyvalue-pairs-with-a-conditional-value" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.unqork.io/llms.txt > Use this file to discover all available pages before exploring further. # How to: Add Key/Value Pairs With a Conditional Value Using the Create Field Operator UDesignerClassic Designer The **Create Field operator** can be used with conditional expressions to add values to each row of a table based on existing data. In this example, you’ll add two key/value pairs, each with two possible values determined by conditions applied to the data. ## Configuration In this how-to guide, you’ll add rows to a data table based on an end-user's annual income. The first key/value pair you’ll use is `"lowIncome" : "yes"` or `"lowIncome" : "no"`. The condition is based on the `incomeAnnual` field. If the annual income is less than 24,000, the pair `"lowIncome":"yes"` is added to the row. If the annual income is greater than or equal to 24,000, the pair `"lowIncome":"no"` is added instead. Conditional logic in the Create Field operator follows the format of the Excel IF function: `key=IF(condition,valueIfTrue,valueIfFalse)`. For the first key/value pair, the expression is the following: `lowIncome=IF(incomeAnnual<24000,”yes”,”no”)`. The second key/value pair is `"applicationFee" : 5` or `"applicationFee" : 15.` The corresponding expression is the following: `applicationFee=IF(lowIncome="yes",5,15)`. In this case, if the `lowIncome` status is `"yes"`, the application fee is `5`. If the `lowIncome` status is `"no"`, the application fee is `15`. > [!NOTE] > These instructions assume you have a new module open, saved, and with a title. ### Configure the Data Table Component You’ll create a table using a [Data Table](/v1/docs/data-table-component) component to add your key/value pairs. Begin by setting up a three‑row object table (array). This table will include one column named `incomeAnnual`. The values in this column will determine whether `"yes"` or `"no"` is assigned to the `lowIncome` key. 1. In the Module Builder, drag and drop a **Data Table** component onto your canvas. 2. In the **Property ID** and **Label Text** fields, enter `dtTable`. 3. In the data table, enter the following: | name | age | incomeAnnual | | --- | --- | --- | | Ezekiel | 58 | 23400 | | Lenna | 32 | 48000 | | Sage | 29 | 66700 | ![A static image displaying the configuration of the dtTable Data Table component in UDesigner.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/UD_Create%20Field%20op_Data%20Table_dtTable.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) 4. Click **Save Component**. ### Configure the Data Workflow Component Configure the [Data Workflow](/v1/docs/data-workflow-component) component to add two new key/value pairs to each row (object) in your table (array). 1. Drag and drop a **Data Workflow** component onto your canvas, placing it below the `dtTable` **Data Table** component. 2. In the **Property ID** and **Canvas Label Text**, enter `dwfCreateField`. #### Configure the Input Operator Connect your [Data Table](/v1/docs/data-table-component) component to your [Data Workflow](/v1/docs/data-workflow-component) component using an [Input](/v1/docs/input-operator) operator. 1. Drag and drop an **Input** operator onto your Data Workflow canvas. 2. Configure the operator's **Info** window as follows: | Setting | Value | | --- | --- | | Category | Input | | Component | dtTable | | Required | Yes | | Source | Default | #### Configure the Create Field Operator Set up the [Create Field](/v1/docs/create-field-operator) operator to add two new key/value pairs to each row (object) in your table (array). 1. Drag and drop a **Create Field** operator onto your Data Workflow canvas. 2. Configure the operator's **Info** window as follows: | Setting | Value | | --- | --- | | Category | Create Field | | Label | lowIncome | | Do Not Sanitize Formula | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/icon_unchecked(1).png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) (unchecked) | | Preserve Argument Type | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/icon_unchecked(1).png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) (unchecked) | | Field 1 | lowIncome=IF(incomeAnnual<24000,"yes","no") | | Field 2 | applicationFee=IF(lowIncome="yes",5,15) | 3. Connect the output port (right) of the `dtTable` **Input** operator to the input port (left) of the `lowIncome` **Create Field** operator. #### Configure the Console Operators Next, add two [Console](https://docs.unqork.io/docs/console-operator) operators to view the data before and after your Create Field operator. > [!NOTE] > You'll notice that the Create Field operator only outputs to a Console operator. When creating applications, you might also want to use a dedicated [Output](/v1/docs/output-operator) operator. Then, you could connect that Output operator to a [Hidden](/v1/docs/hidden-component) component. This would let you store the final table and reference it elsewhere in your application. 1. Drag and drop two **Console** operators onto your Data Workflow canvas. 2. Configure the first **Console** operator's **Info** window as follows: | Setting | Value | | --- | --- | | Category | Console | | Label | Before Create Field | 3. Connect the output port (right) of the `dtTable` **Input** operator to the input port (left) of this `Before Create Field` **Console** operator. 4. Configure the second **Console** operator's **Info** window as follows: | Setting | Value | | --- | --- | | Category | Console | | Label | After Create Field | 5. Connect the output port (right) of the `lowIncome` **Create Field** operator to the input port (left) of this `After Create Field` **Console** operator. ![A static image displaying the configuration of the dwfCreateField Data Workflow component in UDesigner.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/UD_Create%20Field%20op_DWF_dwfCreateField.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) 6. Click **Save Component**. ### Configure the Button Component Lastly, configure a [Button](/v1/docs/button-component) component to trigger your Data Workflow. 1. Drag and drop a **Button** component onto your canvas, placing it below the `dwfCreateField` **Data Workflow** component. 2. In the **Property ID** field, enter `btnRunDWF`. 3. In the **Label Text** field, enter `Run Create Field`. 4. From the **Action Type** drop-down, select **Event**. 5. From the **On Click** drop-down, select **dwfCreateField**. ![A static image displaying the configuration of the btnRunDWF Data Workflow component in UDesigner.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/UD_Create%20Field%20op_Button_btnRunDWF.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) 6. Click **Save Component**. 7. **Save** your module. Here's how the completed example looks in the Module Builder: ![A static image displaying the configuration of the module in the UDesigner.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/UD_Create%20Field%20op_module.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) Preview your module in Express View and open the DevTools Console. Click the **Run Create Field** button, and you’ll see that the `lowIncome` field was created. ![A static image displaying the Express View and the DevTools Console.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_Create%20Field%20op_DevTools%20Console.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) The **Create Field operator** can be used with conditional expressions to add values to each row of a table based on existing data. In this example, you’ll add two key/value pairs, each with two possible values determined by conditions applied to the data. ## Configuration In this how-to guide, you’ll add rows to a data table based on an end-user's annual income. The first key/value pair you’ll use is `"lowIncome" : "yes"` or `"lowIncome" : "no"`. The condition is based on the `incomeAnnual` field. If the annual income is less than 24,000, the pair `"lowIncome":"yes"` is added to the row. If the annual income is greater than or equal to 24,000, the pair `"lowIncome":"no"` is added instead. Conditional logic in the Create Field operator follows the format of the Excel IF function: `key=IF(condition,valueIfTrue,valueIfFalse)`. For the first key/value pair, the expression is the following: `lowIncome=IF(incomeAnnual<24000,”yes”,”no”)`. The second key/value pair is `"applicationFee" : 5` or `"applicationFee" : 15.` The corresponding expression is the following: `applicationFee=IF(lowIncome="yes",5,15)`. In this case, if the `lowIncome` status is `"yes"`, the application fee is `5`. If the `lowIncome` status is `"no"`, the application fee is `15`. > [!NOTE] > These instructions assume you have a new module open, saved, and with a title. ### Configure the Data Table Component You’ll create a table using a [Data Table](/v1/docs/data-table-component) component to add your key/value pairs. Begin by setting up a three‑row object table (array). This table will include one column named `incomeAnnual`. The values in this column will determine whether `"yes"` or `"no"` is assigned to the `lowIncome` key. 1. In the Module Builder, drag and drop a **Data Table** component onto your canvas. 2. In the **Property ID** and **Canvas Label Text** fields, enter `dtTable`. 3. In the data table, enter the following: | name | age | incomeAnnual | | --- | --- | --- | | Ezekiel | 58 | 23400 | | Lenna | 32 | 48000 | | Sage | 29 | 66700 | ![A static image displaying the configuration of the dtTable Data Table component in Classic Designer.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_Create%20Field%20op_Data%20Table_dtTable.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) 4. Click **Save & Close**. ### Configure the Data Workflow Component Configure the [Data Workflow](/v1/docs/data-workflow-component) component to add two new key/value pairs to each row (object) in your table (array). 1. Drag and drop a [Data Workflow](https://docs.unqork.io/docs/data-workflow-component) component onto your canvas, placing it below the `dtTable` **Data Table** component. 2. In the **Canvas Label Text** and **Property Name** fields, enter `dwfCreateField`. #### Configure the Input Operator Connect your [Data Table](/v1/docs/data-table-component) component to your [Data Workflow](/v1/docs/data-workflow-component) component using an [Input](/v1/docs/input-operator) operator. 1. Drag and drop an **Input** operator onto your Data Workflow canvas. 2. Configure the operator's **Info** window as follows: | Setting | Value | | --- | --- | | Category | Input | | Component | dtTable | | Required | Yes | | Source | Default | #### Configure the Create Field Operator Set up the [Create Field](/v1/docs/create-field-operator) operator to add two new key/value pairs to each row (object) in your table (array). 1. Drag and drop a **Create Field** operator onto your Data Workflow canvas. 2. Configure the operator's **Info** window as follows: | Setting | Value | | --- | --- | | Category | Create Field | | Label | lowIncome | | Do Not Sanitize Formula | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/icon_unchecked(1).png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) (unchecked) | | Preserve Argument Type | ![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/icon_unchecked(1).png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) (unchecked) | | Field 1 | lowIncome=IF(incomeAnnual<24000,"yes","no") | | Field 2 | applicationFee=IF(lowIncome="yes",5,15) | 3. Connect the output port (right) of the `dtTable` **Input** operator to the input port (left) of the `lowIncome` **Create Field** operator. #### Configure the Console Operators Next, add two [Console](https://docs.unqork.io/docs/console-operator) operators to view the data before and after your Create Field operator. > [!NOTE] > You'll notice that the Create Field operator only outputs to a Console operator. When creating applications, you might also want to use a dedicated [Output](/v1/docs/output-operator) operator. Then, you could connect that Output operator to a [Hidden](/v1/docs/hidden-component) component. This would let you store the final table and reference it elsewhere in your application. 1. Drag and drop two **Console** operators onto your Data Workflow canvas. 2. Configure the first **Console** operator's **Info** window as follows: | Setting | Value | | --- | --- | | Category | Console | | Label | Before Create Field | 3. Connect the output port (right) of the `dtTable` **Input** operator to the input port (left) of this `Before Create Field` **Console** operator. 4. Configure the second **Console** operator's **Info** window as follows: | Setting | Value | | --- | --- | | Category | Console | | Label | After Create Field | 5. Connect the output port (right) of the `lowIncome` **Create Field** operator to the input port (left) of this `After Create Field` **Console** operator. ![A static image displaying the configuration of the dwfCreateField Data Workflow component in Classic Designer.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_Create%20Field%20op_DWF_dwfCreateField.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) 6. Click **Save**. ### Configure the Button Component Lastly, configure a [Button](/v1/docs/button-component) component to trigger your Data Workflow. 1. Drag and drop a **Button** component onto your canvas, placing it below the `dwfCreateField` **Data Workflow** component. 2. In the **Property ID** field, enter `btnRunDWF`. 3. In the **Label Text** field, enter `Run Create Field`. 4. Set the **Action Type** as **Event**. 5. From the **On Click** drop-down, select **dwfCreateField**. ![A static image displaying the configuration of the btnRunDWF Data Workflow component in Classic Designer.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_Create%20Field%20op_Button_btnRunDWF.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) 6. Click **Save & Close**. 7. **Save** your module. Here's how the completed example looks in the Module Builder: ![A static image displaying the configuration of the module in Classic Designer.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_Create%20Field%20op_module.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) Preview your module in Express View and open the DevTools Console. Click the **Run Create Field** button, and you’ll see that the `lowIncome` field was created. ![A static image displaying the Express View and the DevTools Console.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/CD_Create%20Field%20op_DevTools%20Console.png?sv=2026-02-06&spr=https&st=2026-11-09T03%3A51%3A15Z&se=2026-11-09T04%3A51%3A15Z&sr=c&sp=r&sig=CpLZaF%2FJkZNn2q6psQlU%2BvQNkZRXm%2FlCHQzN0UAxjOI%3D) A key-value pair is a fundamental data structure where a unique "key" is associated with a specific "value," used for organizing and retrieving data efficiently, like in dictionaries or databases. End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product. An object is a type of data structure that represents a single, self-contained entity that acts as a container for the characteristics of that entity. An array is a type of object that stores one or more data types. Data types supported in arrays include numbers, strings, and objects. Express View is how your end-user views your application. Express View also lets you preview your applications to test your configuration and view the styling. This is also the view your end-users will see when interacting with your application. After configuring a module, click Preview in the Module Builder to interact with the module in Express View. The DevTools Console helps you securely store, build, test, and deploy your software.