I have a form that sends the value of my input box to search.php where I cature it using POST:

<form method="post" name="boxsearchform" action="search.php">
<input name="INPUT" id="INPUT" type="text" value=""  />
<input type="image" name="search" src="searchboxgo.gif" />
<select name="choosevar">
  <option value="title">Title</option>
  <option value="colour">Colour</option>
</select>
</form>

What I would like is to use JavaScript to change the id of the input box to either 'title' or 'colour' depending on whether the drop down 'choosevar' is selected to either title or colour respectively.

Is this possible?

On search.php I will then use

$title = $_POST['title'];
$colour = $_POST['colour'];

to capture either variable no matter which one is sent.

Try this code...

<html>
<head>
<title>Some title</title>
<script type="text/javascript">
<!--
function changeId() {
var myform = (document.all) ? document.forms['boxsearchform'] : document.getElementById('boxsearchform');

var ids = myform.choosevar.selectedIndex;

if ( myform ) {

myform.iNPUT.id = myform.choosevar.options[ids].value; }

else { document.getElementById('iNPUT').id = document.getElementById('choosevar').options[document.getElementById('choosevar').selectedIndex].value; 
  }
}
//-->
</script>
</head>
<body>

<form action="search.php" method="post" id="boxsearchform">
<div>
<input type="text" name="iNPUT" id="iNPUT" value="" />
<select name="choosevar" id="choosevar" size="1" onchange="changeId();">
<option value="title">Title</option>
<option value="colour">Colour</option>
</select><br />
<input type="submit" name="btn" id="btn" value="Submit" />
</div>
</form>
</body>
</html>
This article has been dead for over six months. Start a new discussion instead.