Skip to content
Fix Code Error

How to get value of selected radio button?

March 13, 2021 by Code Error
Posted By: Anonymous

I want to get the selected value from a group of radio buttons.

Here’s my HTML:

<div id="rates">
  <input type="radio" id="r1" name="rate" value="Fixed Rate"> Fixed Rate
  <input type="radio" id="r2" name="rate" value="Variable Rate"> Variable Rate
  <input type="radio" id="r3" name="rate" value="Multi Rate" checked="checked"> Multi Rate  
</div>

Here’s my js:

var rates = document.getElementById('rates').value;
var rate_value;
if(rates =='Fixed Rate'){
    rate_value = document.getElementById('r1').value;
    
}else if(rates =='Variable Rate'){
    rate_value = document.getElementById('r2').value;
    
}else if(rates =='Multi Rate'){
    rate_value = document.getElementById('r3').value;
}  

document.getElementById('results').innerHTML = rate_value;

I keep getting undefined.

Solution

var rates = document.getElementById('rates').value;

The rates element is a div, so it won’t have a value. This is probably where the undefined is coming from.

The checked property will tell you whether the element is selected:

if (document.getElementById('r1').checked) {
  rate_value = document.getElementById('r1').value;
}
Answered By: Anonymous

Related Articles

  • How to properly do JSON API GET requests and assign…
  • How to parse JSON with XE2 dbxJSON
  • Azure Availability Zone ARM Config
  • The 'compilation' argument must be an instance of…
  • How do I limit the number of digits from 6 to 4 in…
  • Search match multiple values in single field in…
  • Event Snippet for Google only shows one event while…
  • Avoid creating new session on each axios request laravel
  • mongodb group values by multiple fields
  • NullpointerException error while working with…
  • Why does this Azure Resource Manager Template fail…
  • loop and eliminate unwanted lines with beautiful soup
  • Most effective way to parse JSON Objects
  • Octave using 'for' statement to show two animations…
  • Azure CLI - az deployment group create -…
  • Does moment.js allow me to derive a timezone…
  • How to traverse the complex nested Json in C# and…
  • Angular 12 - Generating browser application bundles…
  • Python JSON TypeError : list indices must be…
  • C# Get YouTube videoId from Json
  • Python scrape JS data
  • ./components/Avatar.tsx Error: Cannot find module…
  • How do I remove single children in a tree?
  • Can't upload files with Apollo-client GraphQL in…
  • How to build correlation matrix plot using specified…
  • error NG6002: Appears in the NgModule.imports of…
  • Siemens LOGO! PLC data in the wrong order
  • Js Calculation based on radio button, and some problems
  • One to many relationship in two JSON arrays, lookup…
  • Need constraints for y position or height when…
  • Error Stack Overflow when trying to hide buttons in…
  • TypeError: players.map is not a function
  • Function runs into an error after successfully…
  • Posting array of objects to REST API with ReactJS
  • Scraping text after a span in with Regex (and Requests)
  • Fix top buttons on scroll of list below
  • state data can not be set using useState in reactjs
  • Blazor Can't Update UI
  • How can I center all my contents in html?
  • How to blur the background after click on the button…
  • python pandas - add unique Ids in column from master…
  • C# parse FHIR bundle - read resources
  • How do I get currency exchange rates via an API such…
  • Python is not calling fucntions properly
  • How to query Json field so the keys are the column…
  • How do i update a javascript variable as its value changes?
  • Fragment Not Showing in the Activity
  • Remove Text from the edit text when edit text is focused
  • R - Apply function to list of lm summaries
  • Vega-lite data transformation to un-nest objects
  • How can i use `parse = T` and functions like round…
  • Python - Read JSON - TypeError: string indices must…
  • How to determine the current iPhone/device model?
  • What to change in circular barplot in R?
  • Form field border-radius is not working only on the…
  • How to reverse $unwind or re-assemble after $lookup?
  • Split JSON python string to pass to function
  • Need to split output into an javascript array
  • Combining pyOSC with pyQT5 / Threading?
  • MaterialCardView is in front of NavigationView. How…
  • Conditional render label Color base on another field value
  • Merge list of results into a single variable with Python
  • Generate sequence of dates for given frequency as…
  • How do we split words from a html file using string…
  • Video Poker How to make the combinations?
  • AWS CodeCommit With Multi-factor Authentication.…
  • JSON Schema - How to apply conditionals based on…
  • Errorbars and bar plots having different positions in ggplot
  • Javascript filtering a nested array to exclude…
  • Updating products with fetch and input value fields
  • React function keeps refreshing page causing huge…
  • how to transform a JSON coming from an API into…
  • Python Inserting headers for CSV file when…
  • ng serve is checking nodemodules in previous directory
  • Azure Sql : Unable to Replace HTML String
  • Install slick carousel in VueJS project
  • ggplot by group with filter()
  • Disabling a button upon condition in Google App script
  • display other inputs based on the value of another…
  • Why is my Shopify App built with Next.js (React) so…
  • Getting a "TypeError" when trying to validate a form
  • How to Insert cell reference in VBA code for…
  • Svelte application not working on android version…
  • How to loop through all the buttons to a click event…
  • How to use Servlets and Ajax?
  • Sorting A Table With Tabs & Javascript
  • Issues trying to install sylius/product-bundle to my…
  • My node.js json parse function throws error
  • Union of multiple Database queries with same parameters
  • onClick for buttons on custom CardView
  • How to read through or navigate through a json object?
  • How to get device make and model on iOS?
  • How to sort elasticsearch buckets by timestamp…
  • Why so much unused space, engine is skipping to a…
  • Active tab issue on page load HTML
  • JSONLD context for duplicate keys at nested level
  • I want to create a SQLite database like in the…
  • Adding a unique id to appended forms in Jquery or Javascript
  • React eslint error missing in props validation
  • Data not catching in multi step contact form

Disclaimer: This content is shared under creative common license cc-by-sa 3.0. It is generated from StackExchange Website Network.

Post navigation

Previous Post:

How do I check in JavaScript if a value exists at a certain array index?

Next Post:

Converting an integer to a string in PHP

Leave a Reply Cancel reply

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

.net ajax android angular arrays aurelia backbone.js bash c++ css dataframe ember-data ember.js excel git html ios java javascript jquery json laravel linux list mysql next.js node.js pandas php polymer polymer-1.0 python python-3.x r reactjs regex sql sql-server string svelte typescript vue-component vue.js vuejs2 vuetify.js

  • you shouldn’t need to use z-index
  • No column in target database, but getting “The schema update is terminating because data loss might occur”
  • Angular – expected call-signature: ‘changePassword’ to have a typedeftslint(typedef)
  • trying to implement NativeAdFactory imports deprecated method by default in flutter java project
  • What should I use to get an attribute out of my foreign table in Laravel?
© 2022 Fix Code Error