Listen so you want to get the value from the input field. Then there are some cases by which you can gather input mentioning some:
- Do you want Live typing results
- or want results when the user clicks somewhere else other than the input box
- or you want to get value on form submission
Formal Way of Gathering Data is On Submission(3). As the user is giving its concern to Give his data. HTML
<input type="text" name="name" id="uniquestring" value="value" />
Javascript Function
var variablename = document.getElementById("uniquestring").value;
So, What You want Means You want to redirect users to a particular website I understand this use Form
<form action="/action_page.php"> <label for="fname">First name:</label> <input type="text" id="fname" name="fname"><br><br> <label for="lname">Last name:</label> <input type="text" id="lname" name="lname"><br><br> <input type="submit" value="Submit"> <input type="submit" formaction="/action_page2.php" value="Submit to another page"> </form>
And then create a variable to change form Value
function select_change(){ var z = document.getElementById("form_action").selectedIndex; var z1 = document.getElementsByTagName("option")[z].value; alert ("Form action changed to "+z1); }
function select_change() { var z = document.getElementById("form_action").selectedIndex; var z1 = document.getElementsByTagName("option")[z].value; alert("Form action changed to " + z1); } function myfunction() { if (validation()) { // Calling Validation function. //select option value from select tag and storing it in a variable. var x = document.getElementById("form_action").selectedIndex; var action = document.getElementsByTagName("option")[x].value; if (action !== "") { document.getElementById("form_id").action = action; document.getElementById("form_id").submit(); } else { alert("Please set form action"); } } } // Name and Email validation Function. function validation() { var name = document.getElementById("name").value; var email = document.getElementById("email").value; var emailReg = ''; if (name === '' || email === '') { alert("Please fill all fields...!!!!!!"); return false; } else if (!(email).match(emailReg)) { alert("Invalid Email...!!!!!!"); return false; } else { return true; } }
<!DOCTYPE html> <html> <head> <title>Dynamically Change Form Action Using Javascript</title> <!-- Include jQuery Library and File Here --> <script type="text/javascript" src="js/form_action.js"></script> <!-- Include CSS File Here --> <link rel="stylesheet" href="css/style.css"/> </head> <body> <div class="container"> <div class="main"> <h2>Dynamically Change Form Action Using Javascript</h2> <form id="form_id" method="post" name="myform"> <label>Name :</label> <input type="text" name="name" id="name"/> <label>Email :</label> <input type="text" name="email" id="email"/> <label>Set Form Action :</label> <select id="form_action" onChange="select_change()" > <option value="">--- Set Form Action ---</option> <option value="first.php">first.php</option> <option value="second.php">second.php</option> <option value="third.php">third.php</option> </select> <input type="button" value="Submit" onclick="myfunction()"/> </form> </div> </div> </body> </html>
