Javascript doesn't return a correct value

Question

I am working on HTML and Javascript.

I have a label which you can see below

<label for="optGender">Gender: </label> 
<input id="optGender" type="radio" name="optGender" value="F" onclick="changeGender(this.value)">
Female
<br>
<input id="optGender" type="radio" name="optGender" value="M" onclick="changeGender(this.value)">
Male
<br>
Where do you want to live?
<br>
<select id="txtCity" name="lstCity" size="5">
<option value="06">Ankara</option>
<option value="34">Istanbul</option>
<option value="35">Izmir</option>
<option value="27">Gaziantep</option>
</select>
<br>

and in my javascript file I have this function to check whether its checked or not

function changeGender(whichOne){

    var gender = document.forms["ProcessInfo"]["optGender"].value;
    var optGender = document.getElementById("optGender");
    var txtCity = document.getElementById("txtCity");

    if ( !document.getElementById('optGender').checked )
    {
    errMessage += "Please select your gender.\n";
    document.getElementById('optGender').checked = false;
    }
    //if ( gender == "M" ) { alert("lol");}

}

When I select "Female" button, it works, doesn't give an error. But when I choose male, it gives me an error that I havent selected any option. What is wrong with that?

Edit * What I actually want to do is, If I select F the list will have the cities which starts with I, for M its going to be G. I can easily handle this part, but I'm stuck at easiest part.

Provide jsFiddle examle here.

Khamidulla
– Khamidulla

2013-11-07 01:45:19 +00:00
Commented Nov 7, 2013 at 1:45 — Khamidulla
– Khamidulla, Commented Nov 7, 2013 at 1:45

deweyredman · Accepted Answer · 2013-11-07 02:11:34Z

3

you have the same ID for both inputs. That won't work... Document.getelementbyid returns the first instance it finds the id you provided, which is the male input. I think what you might want here is a select instead of an input...

Give me a second and I'll modify your code for you.

<label for="optGender">Gender: </label> 
<input id="Female" type="radio" name="optGender" value="F" onclick="changeGender(this)">
Female
<br>
<input id="Male" type="radio" name="optGender" value="M" onclick="changeGender(this)">
Male
<br>
Where do you want to live?
<br>
<select id="txtCity" name="lstCity" size="5">
<option value="06">Ankara</option>
<option value="34">Istanbul</option>
<option value="35">Izmir</option>
<option value="27">Gaziantep</option>
</select>
<br>


function changeGender(whichOne){
    var gender = whichOne.value;
    if ( gender == "M" ) { alert("lol");}
    if ( gender == "F" ) { alert("wat");}

}

edited Nov 7, 2013 at 2:11

answered Nov 7, 2013 at 1:43

deweyredman

1,4501 gold badge9 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

A. Mesut Konuklar Over a year ago

Edited my html file sir, I will remove options from "txtCity" but I still can't handle the select issue. It works for only female. @deweyredman

deweyredman Over a year ago

Alright...try that out. Let me know if you run into anything.

A. Mesut Konuklar Over a year ago

It works like a charm sir, If both cases == null, it gives an error for both cases now. Thanks! ( And /laughed at ("wat") part :)

Vinh · Accepted Answer · 2013-11-07 01:46:02Z

0

You need to change your radio's ID and keep the name. It'll work

answered Nov 7, 2013 at 1:46

Vinh

736 bronze badges

1 Comment

A. Mesut Konuklar Over a year ago

When I change the ID, it doesn't select the radio button

Subash · Accepted Answer · 2013-11-07 01:46:23Z

0

You cannot have 2 elements with the same id in HTML. You have 2 elements with same id ie optGender.

answered Nov 7, 2013 at 1:46

Subash

7,3068 gold badges47 silver badges73 bronze badges

Collectives™ on Stack Overflow

Javascript doesn't return a correct value

3 Answers 3

3 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related