Button click function is not working

Question

I have a simple doubt over here, in below code I am trying to open different pages to my target frame according to the values selected in select option menu. But the pages are not redirecting to the frame , I know have done some silly error somewhere , can anybody please help me ?

<script type="text/javascript">

function showcity(select){


    if(select.value == 'maha')
    {
        show();
        }
    else
    {
        hide();
    }   

    }

function show(){
    var city=document.getElementById('city');
    city.style.display ='inline';
}

function hide(){
    var cityhide =document.getElementById('city');
    cityhide.style.display ='none';
}



function changemap(select){

    var maps=document.getElementById('city');
    if(maps.select.value == 'mumbai'){
        window.location = 'bank_atm_locator_mumbai.html';
    }
    else if(maps.select.value == 'aura'){
        window.location == 'bank_atm_locator_aurangabad.html'
    }
    else if(maps.select.value == 'pune'){
        window.location == 'bank_atm_locator_pune.html'
    }
}

</script>
</head>
<body>
<div data-role="page" id="pageone" data-theme="b" onload="hide(this)">


<div data-role="main" style="padding-top: 4em">
<div class="ui-field-contain" align="center" data-theme="a">
<form>
<select name="state" onchange="showcity(this)">

        <option value="1" selected="selected">Select State</option>
        <option value="maha">Maharashtra</option>
        <option value="3">Karnataka</option>
        <option value="4">Kerala</option>
        </select></form>
</div>
<div class="ui-field-contain" align="center" data-theme="a">
<form><select name="city" id="city" >

        <option value="1" selected="selected">Select City</option>
        <option value="mumbai" >Mumbai</option>
        <option value="aura">Aurangabad</option>
        <option value="pune">Pune</option>
        </select> </form>
</div>
<a href="#" target="mapview" data-role="button" data-theme="a" onclick="changemap(this)">Go</a> 

</div>
</div>

</body>

ashishmaurya · Accepted Answer · 2014-05-02 14:03:25Z

1

use window.location.href to redirect

function changemap(select){
 event.preventDefault();
var maps=document.getElementById('city');
if(maps.value == 'mumbai'){
    window.location.href = 'bank_atm_locator_mumbai.html';
}
else if(maps.value == 'aura'){
    window.location.href == 'bank_atm_locator_aurangabad.html'
}
else if(maps.value == 'pune'){
    window.location.href == 'bank_atm_locator_pune.html'
}
}

edited May 2, 2014 at 14:03

answered May 2, 2014 at 13:33

ashishmaurya

1,19610 silver badges18 bronze badges

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

4 Comments

Hawk Over a year ago

it would be better to use window.location.assign because location.href is also used in returning url value, just suggesting.. :)

Gokul Over a year ago

is there any change in the syntax of button to call function?

ashishmaurya Over a year ago

@Code_Man I have edited the answer. as you are calling change(select) through anchor tag you have to use preventDefault()

ashishmaurya Over a year ago

@Code_Man I have edited it again. it's a maps.value not maps.select.value

Gwenc37 · Accepted Answer · 2014-05-02 13:36:02Z

0

start by keeping the var city out of the show and hide scope as so

function showCity(select)
{
    //code
    var city = document.getElementById('city');

    function show()
    {
        city.style.display = 'inline';
    }

    function hide()
    {
        city.style.display = 'none';
    }
}

edited May 2, 2014 at 13:36

Gwenc37

2,0467 gold badges19 silver badges22 bronze badges

answered May 2, 2014 at 13:34

Hawk

7811 gold badge7 silver badges19 bronze badges

Collectives™ on Stack Overflow

Button click function is not working

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related