Now here in this tutorial, I’ll explain how to redirect page on button click or a URL on button click event from client-side using JavaScript or jQuery in asp.net.
In my previous tutorials, I’d explained how ot auto-refresh webpage in every 10 seconds, how to auto-redirect to a specific url or webpage in 10 seconds, gridview inline insert update delete and other more cracking tutorials on Asp.net, JavaScript, jQuery here.
Following is the code snippet that is use to redirect a specific webpage on button click event using JavaScript or jQuery.
Redirect page on Button Click Using JavaScript
<script type=”text/javascript”>
//Method using JavaScript
function Redirect() {
//specify your URL here..
window.location.href = ‘/AutoRefreshWebPage.aspx’;
}
</script>
//Method using JavaScript
function Redirect() {
//specify your URL here..
window.location.href = ‘/AutoRefreshWebPage.aspx’;
}
</script>
Redirect page on Button Click Using jQuery
<script type=”text/javascript”>
//Method using jQuery
$(document).ready(function () {
$(“#btnRedirectUsingjQuery”).click(function () {
//specify your URL here..
window.location.href = ‘/AutoRefreshWebPage.aspx’;
});
});
</script>
//Method using jQuery
$(document).ready(function () {
$(“#btnRedirectUsingjQuery”).click(function () {
//specify your URL here..
window.location.href = ‘/AutoRefreshWebPage.aspx’;
});
});
</script>
HTML Markup for Redirect Webpage – [.aspx]
Following is the complete HTML Markup code to redirect a webpage or url on a button click event:
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head id=”Head1″ runat=”server”>
<title>Redirect to another webpage on button click event</title>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js”>
</script>
<script type=”text/javascript”>
//Method using jQuery
$(document).ready(function () {
$(“#btnRedirectUsingjQuery”).click(function () {
//specify your URL here..
window.location.href = ‘/AutoRefreshWebPage.aspx’;
});
});//Method using JavaScript
function Redirect() {
//specify your URL here..
window.location.href = ‘/AutoRefreshWebPage.aspx’;
}
</script>
</head>
<body>
<form id=”form1″ runat=”server”>
<div>
<br />
<br />
<input id=”btnRedirectUsingJavascript” value=”Redirect Using JavaScript” type=”button”
onclick=”Redirect()” />
<input id=”btnRedirectUsingjQuery” value=”Redirect Using jQuery” type=”button” />
</div>
</form>
</body>
</html>
<head id=”Head1″ runat=”server”>
<title>Redirect to another webpage on button click event</title>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js”>
</script>
<script type=”text/javascript”>
//Method using jQuery
$(document).ready(function () {
$(“#btnRedirectUsingjQuery”).click(function () {
//specify your URL here..
window.location.href = ‘/AutoRefreshWebPage.aspx’;
});
});//Method using JavaScript
function Redirect() {
//specify your URL here..
window.location.href = ‘/AutoRefreshWebPage.aspx’;
}
</script>
</head>
<body>
<form id=”form1″ runat=”server”>
<div>
<br />
<br />
<input id=”btnRedirectUsingJavascript” value=”Redirect Using JavaScript” type=”button”
onclick=”Redirect()” />
<input id=”btnRedirectUsingjQuery” value=”Redirect Using jQuery” type=”button” />
</div>
</form>
</body>
</html>
Download Example
[wpdm_package id=’5429′]