Vfrdtyky

So I am forced to use two different bidningstrings because of a tool we use to create a pdf. My goal here is when a user clicks a Yes or No button that the other corresponding bindingstring will be turned "Off" and the one clicked turned to "Yes" I created a Jquery way of doing this but that will become insane because I would have to do this like 100x Is there a way to do this inline with knockout I like I did with the knockout way of styling the opacity of the buttons?

<div class="row" style="margin-top: 80px">

    <div class="col-xs-6 EntDisorderTrue"  data-bind="style:{ 'opacity' : EntDisorderTrue()=='Off' ? '.5' : '' }" >

        <label class="btn btn-success yesbtn">

            <input type="radio" value="Yes" data-bind=" checked: EntDisorderTrue " />@Global.Yes

        </label>

    </div>

    <div class="col-xs-6 EntDisorderFalse"  data-bind="style:{ 'opacity' : EntDisorderFalse()=='Off' ? '.5' : '' }" >

        <label class="btn btn-success nobtn">

            <input type="radio"  value="Yes" data-bind="checked: EntDisorderFalse" />@Global.No

        </label>

    </div>

</div>

Jquery way of switching the values

        $(".EntDisorderFalse").click(function () {

        if (self.EntDisorderFalse() == "") {

            self.EntDisorderFalse("Yes")

            self.EntDisorderTrue("Off")

        } else if (self.EntDisorderFalse() == "Off") {

            self.EntDisorderFalse("Yes")

            self.EntDisorderTrue("Off")



        } 

    });



    $(".EntDisorderTrue").click(function () {

        if (self.EntDisorderTrue() == "") {

            self.EntDisorderTrue("Yes").css

            self.EntDisorderFalse("Off")

        } else if (self.EntDisorderTrue() == "Off") {

            self.EntDisorderTrue("Yes")

            self.EntDisorderFalse("Off")

        }

    });

I haven't use knockout in many years but can show you a generic approach.

Use a common class for the False/True elements and a data attribute for the entity name

<div class="col-xs-6 true" data-entity="EntDisorder"...

Then use notation to dynamically access the appropriate method

$(".true").click(function () {

    var ent = $(this).data('entity'),

        trueMethodName = ent + 'True',

        falseMethodName = ent + 'False';

    if (self[trueMethodName]() == "") {

        self[trueMethodName]("Yes").css

        self[falseMethodName]("Off")

    } else if (self[trueMethodName]() == "Off") {

        self[trueMethodName]("Yes")

        self[falseMethodName]("Off")

    }

});