lookininward lookininward - 23 days ago 5x
HTML Question

Why is the value of a checked radio input correctly accessed, but defaults to first value in the group when accesed within a "for" loop?


<div class="col-md-6 parameter">
<h3>Property Type</h3><br>
<input type="radio" value="residential" name="property_type" id="residential-property"><label for="residential-property">Residential</label><br>
<input type="radio" value="commercial" name="property_type" id="commercial-property"><label for="commercial-property">Commercial</label><br>


// Get Property Type
var property_type = document.querySelector('[name=property_type]:checked').value || "";

if (property_type = "residential") {
hello.innerHTML = "<div class='answer'>" + property_type + "</div>";

console.log(property_type) correctly identifies the radio button that is checked and returns the value, either "residential" or "commercial". However, when I attempt to use this selected value, it always defaults to "residential".

For example, if I select the "Commercial" radio button and hit submit, the 'property_type' value in 'hello.innerHTML' always defaults to "residential". The strange this is that if I take the "property_type" value out of the "if" loop, it then returns the correct value whenever I submit, either 'residential' or 'commercial' according to the radio button I checked.

Any help is appreciated!


is Equal,

you need to use == instead of = in if (...) {}

if( property_type == "residential")