Get radio button selected text from SharePoint choice field on page layout – JQuery, bind to change event

So I couldn't find anything obvious for this so chucked this together, hopefully useful for someone else 🙂

Page layout:

<div class="featured-breaking">
        <SharePoint:RadioButtonChoiceField FieldName="FeaturedBreaking" runat="server"></SharePoint:RadioButtonChoiceField>
</div>

JavaScript:

var selectedVal = "";
var selected = $(".featured-breaking input[type='radio']:checked");
if (selected.length > 0) {
    selectedVal = selected.parent().attr('title');
}
console.log(selectedVal);

On load, bind to change event:

<script type="text/javascript">
	_spBodyOnLoadFunctionNames.push("LoadNewsEntryPage");
	function LoadNewsEntryPage() {
		$(".jsFeaturedBreaking input[type='radio']").bind("change", FeaturedBreakingChanged);
		FeaturedBreakingChanged();
	}

	function FeaturedBreakingChanged() {
		var selectedVal = "";
		var selected = $(".jsFeaturedBreaking input[type='radio']:checked");
		if (selected.length > 0) {
			selectedVal = selected.parent().attr('title');
		}
		if (selectedVal == "N/A") {
			$('.jsExpiresOn').hide();
		}
		else {
			$('.jsExpiresOn').show();
		}
	}
</script>

 

Leave a Reply

Your email address will not be published. Required fields are marked *