Buttons instead of selection [SOLVED]

[TheBnl 0]

I'm working on a site and i want to use icons to select travel modes,i have an working function but it only works with a selection input.Is there a way to modify it to be used with buttons? Thanks in advance! Function:

  function calcRoute() {  var selectedMode = document.getElementById("mode").value;  var request = {	  origin: thuis,	  destination: kabk,	  // Note that Javascript allows us to access the constant	  // using square brackets and a string value as its	  // "property."	  travelMode: google.maps.TravelMode[selectedMode]  };  directionsService.route(request, function(response, status) {	if (status == google.maps.DirectionsStatus.OK) {	  directionsDisplay.setDirections(response);	}  });

HTML - Select input

 <select id="mode" onchange="calcRoute();">	<option value="DRIVING">Driving</option>	<option value="WALKING">Walking</option></select>

HTML - Button input (?)

<form id="mode">	<input type="button" onchange="calcRoute();" value="DRIVING">	<input type="button" onchange="calcRoute();" value="WALKING"></form>

Edited May 28, 2012 by TheB

[Ingolme 1,027]

Pass a parameter to the function instead of accessing the element from the function. Buttons use the onclick event, not the onchange event.

<input type="button" onclick="calcRoute('DRIVING');"><input type="button" onclick="calcRoute('WALKING');"> 

Don't forget to erase the line that's currently setting the selectedMode variable.

function calcRoute(selectedMode) {...

[TheBnl 0]

It works great! it is so logical to, onClick and onChange Thanks!