Button Selection to remain pressed

Hello,
I am using the below widget which is an OPEN / CLOSE button. What I want it when you press the OPEN or CLOSE to keep the selection “filled”. Basically to make it work like a toggle. One of the the 2 options should always be selected. Any ideas what I am missing out here?

uid: ButtonSwitch
tags: []
props:
  parameters:
    - context: item
      description: Item to use with this button.
      label: Item
      name: item
      required: true
      type: TEXT
      groupName: general
    - description: Text to show as title.
      label: Title
      name: Title
      required: false
      type: TEXT
    - description: Text to show as footer.
      label: Footer
      name: Footer
      required: false
      type: TEXT
    - description: Text to show on the 'ON' button.
      label: OnButton
      name: OnButton
      required: false
      type: TEXT
    - description: Text to show on the 'OFF' button.
      label: OffButton
      name: OffButton
      required: false
      type: TEXT
  parameterGroups:
    - name: general
      label: Display options
timestamp: Mar 8, 2023, 4:00:43 PM
component: f7-card
config:
  title: '=(props.Title) ? props.Title : ""'
  footer: '=(props.Footer) ? props.Footer : ""'
  style:
    min-width: 180px
slots:
  default:
    - component: f7-block
      config:
        class: bog
        style:
          display: flex
          justify-content: center
          align-content: center
          padding: 10px
      slots:
        default:
          - component: f7-segmented
            slots:
              default:
                - component: oh-button
                  config:
                    text: '=(props.OnButton) ? props.OnButton : "UP"'
                    outline: true
                    fill: false
                    action: command
                    actionItem: =props.item
                    actionCommand: UP
                    active: "=(items[props.item].state === 'UP') ? true : false"
                    style:
                      width: 150px
                      height: 40px
                      display: flex
                      flex-wrap: wrap
                      justify-content: center
                - component: oh-button
                  config:
                    text: '=(props.OffButton) ? props.OffButton : "DOWN"'
                    outline: true
                    fill: false
                    action: command
                    actionItem: =props.item
                    actionCommand: DOWN
                    active: "=(items[props.item].state === 'DOWN') ? true : false"
                    style:
                      width: 150px
                      height: 40px
                      display: flex
                      flex-wrap: wrap
                      justify-content: center

This topic was automatically closed 41 days after the last reply. New replies are no longer allowed.