--Ads--

JavaScript navigate to page

In this section, you will learn how to navigate from one page to another using JavaScript. For this purpose, we have created two html pages navigatePage.html and page.html. Here we are going to navigate from navigatePage.html to page.html. In navigatePage.html, we have created a button and used the href property of the location object with the onClick event which allows this page to navigate to page.html where we have created a simple form.

Here is the code of navigatePage.html:

<html>
<h2>Navigate Page</h2>
<input type="button" value="go to next page"
onclick="location.href='page.html' ">
</html>

Here is the code of page.html:

<html>
<h3>Form</h3>
<script>
function valid(){
if (document.form.name.value == ""){
alert ( "Please enter Name." );
return false;
}
if (document.form.address.value == ""){
alert ( "Please enter Address." );
return false;
}
alert("Thanks for filling the form.");
return true;
}
</script>
<form name="form" method="post" onSubmit="valid();">
<table>
<tr><td>Enter Name:</td><td><input type="text" name="name"></td></tr>
<tr><td>Enter Address:</td><td><input type="text" name="address"></td></tr>
<tr><td><input type="submit" value="Submit"></td></tr>
</table>
</form>
</html>

Output will be displayed as:

On clicking the button, you will navigate to next page:

Download Source Code:

JavaScript navigate to page

JavaScript navigate to page

JavaScript navigate to page

Tutorials