Home

Finding Radio Buttons JQuery

Be sure to look up "closest()" if parent() isn't quite there for you.

      Be <b>SURE</b> to check a radio button otherwise it won't work.
        <div class="myWrapper">
            <div data-id="button-1">
                <input type="radio" class="myClass" name="radioButtons">
            </div>
            <div data-id="button-2">
                <input type="radio" class="myClass" name="radioButtons">
            </div>
            <div data-id="button-3">
                <input type="radio" class="myClass" name="radioButtons">
            </div>
            <div data-id="button-4">
                <input type="radio" class="myClass" name="radioButtons">
            </div>
        </div>

        <script>

            $(document).on('click', '.myWrapper', function () {
                console.log('We found the outer div "myWrapper"')
                var checkedRadioButton = $("input[name='radioButtons']:checked")
                console.log(checkedRadioButton.length + " - If this is above 0 we found the checked radio button")
                var parentOfCheckedButton = checkedRadioButton.parent()
                console.log(parentOfCheckedButton.length + " - If this is above 0 we found the parent of the checked button")
                var attributeOfParent = parentOfCheckedButton.attr('data-id')
                console.log(attributeOfParent)

                console.log('-----------------------------------------')

                var shortHand = $("input[name='radioButtons']:checked").parent().attr('data-id')
                console.log(shortHand)
            })

        </script>

Reader's Comments

Post Your Comment Posts/Links Rules

Name

Comment

Add a RELEVANT link (not required)

Upload an image (not required)

No uploaded image
Real person number
Please enter the above number below




Home
Admin Ren's Biking Blog