Change input value when i press <a> Attribute - php

Question

Ok guys already search for it but no results at all, and cant figured it out how to do this, so my problem is:
I have this form:
<form method="POST" action="search.php" name="form" id="form">
<input type="text" name="search" id="search" placeholder="Introduza a sua Localização">
<input type="submit" name="Submit" value="Pesquisar">
</form>
And what i would like to is when i press this:
<a onClick="">City</a>
The input value change to what i want in this case "City" and then automatically submit the form.
I already made a research about this and theres nothing i could take, any help would be appreciated.
Cumps.
Guys thanks to your help now its working but someone tell me please what the problem in this code:
<?php if (mysql_num_rows($tournaments) !=0){
do { ?>
<div id="mainContainer">
<div id="leftContainer"><img src="images/tournaments/<?php echo $row_tournaments['logo']; ?>.png"></div>
<div id="rightContainer">
<div id="rightContent">
<p><?php echo $row_tournaments['description']; ?></p>
<div id="galleryButton"><p>Entrar no torneio</p></div>
</div>
<div id="rightDetails">
<i class="fa fa-gamepad"></i> <?php echo $row_tournaments['game']; ?><br>
<i class="fa fa-calendar-o"></i> <?php echo $row_tournaments['date']; ?><br>
<i class="fa fa-pencil-square-o"></i> Sem comentários<br>
<script type="text/javascript">
function giveThatInputAValue(){
var elem = document.getElementById("search");
elem.value = "<?php echo $row_tournaments['city']; ?>";
/*document.forms["form"].submit();
*/}
</script>
<i class="fa fa-map-marker"></i> <a onClick="giveThatInputAValue()"><?php echo $row_tournaments['city']; ?></a><br>
<img src="images/<?php echo $row_tournaments['online']; ?>.png"> <?php echo $row_tournaments['online']; ?>
</div>
</div>
</div>
<?php } while ($row_tournaments = mysql_fetch_assoc($tournaments));
} else {
?>
<div id="noresults"><p>Sem torneios</p></div>
<?php
}
?>
Everything is looped fine but that part:
<script type="text/javascript">
function giveThatInputAValue(){
var elem = document.getElementById("search");
elem.value = "<?php echo $row_tournaments['city']; ?>";
/*document.forms["form"].submit();
*/}
</script>
Its not looping it only shows the first record why is it?
Any help would be appreciated.

Answer 1

in your js file you can check if the value of the textbox is equal to the cityname you want. if it is then submit the form. Attach the function to your a tag
function SubmitRightCity(){
if(document.getElementById('search').value == "citynamehere"){
document.forms["form"].submit();
}
}
in html
<a onClick="submitRightCity()">City</a>
In the case where you want your a tag to give the input a value, you attach a function to your tag, once the link is clicked, then the function will give your input a value.
<a onClick="giveThatInputAValue()"> City</a>
in javascript file you will have
<script>
function giveThatInputAValue(){
var elem = document.getElementById("search");
elem.value = "My city value";
//if you want to submit the form right after, you add the line below
document.forms["form"].submit();
}
</script>