Display text based on 'value'

I am trying to populate a drop down filter based on clicking on a row of a table. I got the value to change but am trying to figure out how to make that value actually display. I am using a binding to change the value but cant figure out how to add that text field to it

I am trying to learn ignition for the first time and working on fixing some projects that some people have left me

Do you have a script that changes the props.value property on the dropdown, or a binding on it that derives it from something else?

Yes I do, I have a props.data[value]

Nice, and does this value property match one of the objects in the props.options list?

I do not have anything in the options list

Assuming you are talking about the Perspective dropdown component, you must have the options in the dropdown be all of the selectable options for the user. If that options property is empty, nothing will display no matter what the value is. Below is a link for the documentation on the component.

Perspective - Dropdown | Ignition User Manual

Thank you so much

1 Like

I have created a binding on the options to populate the array but it does not switch. The text on it remains as the placeholder. I can see that the props.value is set to the correct option but it doesnt actually display it

Find your dropdown in the Project Browser, right-click, copy and paste it in here so we can see the full setup. Please see Wiki - how to post code on this forum.

[
  {
    "type": "ia.input.dropdown",
    "version": 0,
    "props": {
      "placeholder": {
        "text": "Select a line..."
      },
      "style": {
        "color": "#000000",
        "marginBottom": 10,
        "marginTop": 10
      }
    },
    "meta": {
      "name": "NameDropdown"
    },
    "position": {
      "basis": "225px"
    },
    "custom": {},
    "propConfig": {
      "props.enabled": {
        "binding": {
          "config": {
            "path": "...../LocationCategoryContainer/AssetDisplay.custom.Editable"
          },
          "type": "property"
        }
      },
      "props.options": {
        "binding": {
          "config": {
            "path": "...../LocationCategoryContainer/AssetDisplay.props.data"
          },
          "transforms": [
            {
              "code": "\tlines = []\n\tcheck_for_duplicates = set()\n\tfor row in value:\n\t\tline = row['Line_Name']\n\t\tlineID = row['Line_ID']\n\t\tif line not in check_for_duplicates:\n\t\t\tnew_entry = {'label': line, 'value': lineID}\n\t\t\tlines.append(new_entry)\n\t\t\tcheck_for_duplicates.add(line)\n\treturn lines",
              "type": "script"
            }
          ],
          "type": "property"
        }
      },
      "props.value": {
        "binding": {
          "config": {
            "path": "...../LocationCategoryContainer/AssetDisplay.props.selection.selectedRow"
          },
          "transforms": [
            {
              "code": "\tif value > -1:\n\t\treturn self.parent.parent.parent.parent.getChild(\"LocationCategoryContainer\").getChild(\"AssetDisplay\").props.data[value]['Line_Name']\n\treturn ''",
              "type": "script"
            }
          ],
          "type": "property"
        },
        "onChange": {
          "enabled": null,
          "script": "\tself.getSibling(\"IDDisplay\").props.text = self.props.value"
        }
      }
    }
  }
]

You didn't read the link as requested, did you?

1 Like

I thought I had set it to code but I didnt, my mistake

You're generating the options from a binding which we can't replicate. Can you post the contents of ...../LocationCategoryContainer/AssetDisplay.props.data (formatted as code)?

This. But also reading your code, looks like you are referencing the Line_Name as the selected value, where you need to have it be the Line_ID since that is what you are setting as the value in your options binding here:

new_entry = {'label': line, 'value': lineID}

The value is not going to be linked to a label.

Does this work? Should be able to copy this and then paste it into your designer

Potentially Fixed Dropdown Component
[
  {
    "type": "ia.input.dropdown",
    "version": 0,
    "props": {
      "placeholder": {
        "text": "Select a line..."
      },
      "style": {
        "color": "#000000",
        "marginBottom": 10,
        "marginTop": 10
      }
    },
    "meta": {
      "name": "NameDropdown"
    },
    "position": {
      "basis": "225px"
    },
    "custom": {},
    "propConfig": {
      "props.enabled": {
        "binding": {
          "type": "property",
          "config": {
            "path": "...../LocationCategoryContainer/AssetDisplay.custom.Editable"
          }
        }
      },
      "props.options": {
        "binding": {
          "type": "property",
          "config": {
            "path": "...../LocationCategoryContainer/AssetDisplay.props.data"
          },
          "transforms": [
            {
              "code": "\tlines = []\n\tcheck_for_duplicates = set()\n\tfor row in value:\n\t\tline = row['Line_Name']\n\t\tlineID = row['Line_ID']\n\t\tif line not in check_for_duplicates:\n\t\t\tnew_entry = {'label': line, 'value': lineID}\n\t\t\tlines.append(new_entry)\n\t\t\tcheck_for_duplicates.add(line)\n\treturn lines",
              "type": "script"
            }
          ]
        }
      },
      "props.value": {
        "binding": {
          "type": "property",
          "config": {
            "path": "...../LocationCategoryContainer/AssetDisplay.props.selection.selectedRow"
          },
          "transforms": [
            {
              "code": "\tif value > -1:\n\t\treturn self.parent.parent.parent.parent.getChild(\"LocationCategoryContainer\").getChild(\"AssetDisplay\").props.data[value]['Line_ID']\n\treturn ''",
              "type": "script"
            }
          ]
        },
        "onChange": {
          "script": "\tself.getSibling(\"IDDisplay\").props.text = self.props.value",
          "enabled": null
        }
      }
    }
  }
]

Im afraid I cant post the contents of the options themselves

That worked! Thank you so much for the help