I have a HTML form which changes its form action based on the drop down selection but input name remains same.
Here is my HTML:
<form action="car.php" method="GET">
Select Your Option :
<select onChange="this.form.action=this.options[this.selectedIndex].value;">
<option value='car.php'>Car Name</option>
<option value='bike.php'>Bike Name</option>
<option value='laptop.php'>Laptop Name</option>
<option value='place.php'>Place Name</option>
<option value='mobile.php'>Mobile Name</option>
</select>
Enter your query // I want to change this also
<input id="Value" name="Value" type="text">
<button id="submit" type="submit" value="Submit">Submit Query</button>
If I select Car Name
and enter Maruti
then value is passed like this:
http://www.mywebsite.com/car.php?Value=Maruti
If I select Bike Name
and enter Honda
then value is passed like this :
http://www.mywebsite.com/bike.php?Value=Honda
My problem is I have to name the column as "Value" in all the 5 database which stores all the information regarding all this, which I want to avoid.
I want, If I select Car Name
and enter Maruti
then value should pass like this
http://www.mywebsite.com/car.php?car=Maruti
If I select Bike Name
and enter Honda
then value should pass like this
http://www.mywebsite.com/bike.php?bike=Honda
What changes should be made in the code to achieve this goal?
If this can also happen then its very nice otherwise no problem.
In the form it is written Enter your query
. I want the same change to happen here. If I select Car Name then it should be Enter you car
. If I select Bike Name then it should be Enter your bike
... and so on.
UPDATE
Little modification I need. When selecting car, the input name is changing to car, the form action is changing to car.php and query to Enter your car. But If I want to change the name like this then what should I do? When I will select anything say bike then form action will be changed to bike.php, But I want input name to be different say USY and Enter your bike to Enter your Serial No. What should I do ?
I have updated the code now and got ur exact requirement now and i hope this will help you
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("select").change(function(){
var str=$(this).val(); // On Change get the option value
$("form").attr("action",str);
var res=str.split(".");
$("#input1").attr("name",res[0]);
$(".title").html("Enter your "+res[0]+" Name."); // Add this below $("input").attr("name",res[0]);
if(res[0]=='bike')
{
var title2="XYZ";
var title3="Serial No";
}
else if(res[0]=='laptop')
{
var title2="ABC";
var title3="Model No";
}
else if(res[0]=='place')
{
var title2="KLM";
var title3="Area";
}
else if(res[0]=='mobile')
{
var title2="FGH";
var title3="Brand";
}
$("#input2").attr("name",title2);
$("#input3").attr("name",title3);
$(".title2").html("Enter your "+title3);
});
});
</script>
<form action="car.php" method="GET">
Select Your Option :
<select value="car.php">
<option value='car.php'>Car Name</option>
<option value='bike.php'>Bike Name</option>
<option value='laptop.php'>Laptop Name</option>
<option value='place.php'>Place Name</option>
<option value='mobile.php'>Mobile Name</option>
</select>
<span class="title2">Enter your Color</span>
<input name="WER" id="input2" type="text">
<button id="submit" type="submit" value="Submit">Submit Query</button>
</form>