API form checkbox input value on button click to set value to set session

I have a question regarding the checkbox input when used within an API form.

Currently I have two checkbox’s, each one if selected will trigger the next set of questions associated with the box selected. Currently, I show and hide based on values applied to the session manager. Right now, no matter what I do, the values associated with both boxes when check either send both values to the session manager or do not send their value to the session manager. I need to have only the value of the selected box send its value at the time of the submit click.

Attached is a quick video of how I have set up the buttons.

                    <div class="col" id="calcQAS" dmx-hide="session1.data.userName">


                    <h5>please enter your name</h5>

                    <input id="userName" name="userName" type="text" class="form-control" placeholder="Enter your first and last name">
                    <h5>Choose the footprint profile you would like to start</h5>
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="1" id="userBusiness" name="UserBusiness" dmx-bind:checked="value">
                        <label class="form-check-label" for="userBusiness">Personal Profile</label>
                    </div>
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="2" id="userPersonal" name="userPersonal" dmx-bind:checked="value">
                        <label class="form-check-label" for="userPersonal">Business Profile</label>
                    </div><button id="btn5" class="btn btn-primary btn-sm" dmx-on:click="session1.set('userName',userName.value);session1.set('userBusiness',userBusiness.value);session1.set('userPersonal',userPersonal.value)" type="submit">Step 1</button>


                </div>

Here is what the data looks like via the developer tools.

Community Page
Last updated: