Clicking a button to escape an iframe and navigate to a new URL within the same domain

What is the proper JavaScript syntax for breaking out of an iframe and redirecting to a different URL within the same domain? I have a page inside an iframe with a form, and once that form is submitted, I want to open a separate page on the site in the parent window instead of the iframe. This is what I've attempted:

protected void ReplacePageClick(object sender, EventArgs e)
{
    string url = "Contact.aspx";

    ClientScriptManager cs = Page.ClientScript;

    cs.RegisterClientScriptBlock(this.GetType(), "RedirectScript", "top.document.location.href = " + url, true);
    //top.document.parent.location.href?
    //top.document.location.replace?
    //window.parent.location?
    //window.top.location.href?
    //window.top.location.replace?
    //parent.window.location.href?
    //top.location.href?

    // The code below works, indicating that javascript registration is successful
    //cs.RegisterClientScriptBlock(this.GetType(), "Alert", "alert('hello')", true);
}

Answer №1

For proper syntax, use:

top.location = "url"

Alternatively, you can use:

top.location.replace("url") 

Replace 'top' with 'parent' depending on how high up the hierarchy you need to go.

If you are encountering an "Access denied" error in Internet Explorer's console (F12) due to cross-domain security restrictions preventing access from one domain to another, consider:

window.open("url","_top")

A better approach is to initially target the form to "_top", as most browsers will allow this action when triggered by a user click event.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

javascript the debate between inline and traditional registration

Hey there, I'm a JavaScript beginner and currently learning about inline vs. traditional registration. I've managed to get code block 1 (inline) working perfectly fine, but unfortunately, code block 2 (traditional) isn't cooperating. Can som ...

Develop a unique custom dictionary using C# that can serialize and deserialize JSON

I need to create a C# class to handle a dynamic JSON response from an external API. The JSON structure is as follows: { "id": "dataset0", "properties": { "createtime": "datetime format" ...

Headers permitted for CORS blocking

Greetings, I have recently developed an API and frontend using React, utilizing axios for making requests. I implemented an authorization header with axios and authenticated it on the PHP server-side. However, there seems to be an issue where the Authoriza ...

Alter the style attribute using JavaScript

I have a calendar table row that needs to be displayed or hidden based on the month. HTML: <tr id="bottomrow" class="week" valign="top" style="display:none;"> <td class="day" id="d36"> <div class="daynumb" id="x36">& ...

Switch the values between two TextFields using Reactjs with material-ui

I am facing a challenge with my React components. I have a functional component that handles user input and it is nested within a class component that manages the state containing the input data. The issue arises when I try to implement a function in the c ...

As time passes, the Azure Service Bus Consumer experiences a decline in performance

My issue involves managing different topics with subscriptions, each tied to a consumer. Over time, I've noticed a decline in the number of messages received. Despite trying to utilize maxconcurrentcalls, it seems to only be effective at the start. My ...

Switching out the month name with its corresponding numerical representation

I recently transformed the date format from "24 Feb 2014" to "Feb-24-2014" using this code snippet: var dateStart = date; var arr = dateStart.split(' '); console.log(arr[1]+"-"+arr[0]+"-"+arr[2]); Now I'm trying to figure out h ...

Aurelia's numerous applications spread across various pages

Currently, I am in the process of finalizing the initial release of a large-scale website built using PHP (Phalcon), MySQL, and JQuery. The technology stack may be a bit outdated, but it was originally prototyped years ago and due to various circumstances, ...

Guide to using Vue.js and Vue Router to create a sub menu for the children of the current route

I am currently working on customizing the navigation for my Vue application. My goal is to create a main menu at the top that displays all the root level routes, and a side menu that appears when navigating through child routes. Here is an example of what ...

Rediscovering the magic of Vue.js HTML parsing

I have a template with Vue.js attributes and bindings. For instance: <a v-on:click="loadAdditionalBusinesses()" v-if="!additionalBusinesses" class="btn btn-info btn-sm btn-block">Load additional profiles</a> <div v-if="addi ...

Getting the iframe onload event in an ASP.NET application

I have integrated ReportViewer to display SSRS reports on my .aspx page. However, since the ReportViewer is rendered as an iframe in the browser, I am looking for a way to trigger a JavaScript function every time the iframe loads. Using window.onload w ...

Incorporate the value of a JQuery variable within an HTML form

When the Submit button is clicked, I am attempting to pass the value of currentDate to a REST GET service. However, there are two things that I don't understand. Is it possible to include the URL of the REST service in the action attribute of the fo ...

Obtaining a variety of data points from an XMLHttpRequest

I recently discovered a technique for sending multiple variables on SO. Here is the code snippet I used: xmlhttp = new XMLHttpRequest(); xmlhttp.open("GET","http://127.0.0.1:3000?var1=" + name + "&var2=test", true); xmlhttp.send(); xmlhttp.onreadystat ...

Guide to displaying a solitary mathjax equation?

I am currently developing a webpage that MathJax is not compatible with. There are hidden display:none elements, latex text embedded within svgs, and various other challenges. Instead of relying on MathJax to automatically scan my site for equations and de ...

Tips for incorporating a 'load additional' feature into a React application using Redux?

Our current method for displaying listings on the page follows this flow: To retrieve a listing of items, I utilize an action reducer (getListing()) through mapDispatchToProps class Listing extends Component { constructor(props) { super(props ...

Tips for hiding the calendar icon once a form has been submitted

Below is the HTML code snippet for the date field. <asp:TextBox ID="txtExpiryDate" runat="server" Width="80px" MaxLength="10" CssClass="fromDate" /> And here is the HTML code snippet for the Submit button. <asp:Button ID="cmdSubmit" runat=" ...

Ways to prevent the jQuery simple slider from transitioning slides while it is in an invisible state

There is a jQuery slider on my website that behaves strangely when I navigate away from the Chrome browser and return later. It seems to speed through all pending slides quickly when it was not visible. Now, I want the slider to pause when it becomes invi ...

Encountered an AngularJS error: [$injector:modulerr] issue following the implementation of gulp-concat

My Angular app functions properly when I manually load all the scripts, but encounters issues when I attempt to use gulp-concat to consolidate them into a single bundle.js file. Currently, I am loading AngularJS and jQuery from a CDN before the other scri ...

Activate the select tag using jQuery or JavaScript

I have a question regarding triggering my label and select tag. The structure is as follows: <label class="label"></label> <select class="select"> </select> Here is my jQuery code: $(".label").click(function(){ $(".select").cl ...

Attempting to eliminate the readonly attribute from HTML using Python

Seeking assistance with removing the readonly tag from an input field using Python and Selenium. Can anyone lend a hand? Datepicker Image: HTML: <input id="startDate" name="START_DATE" type="text" class="date hasDate ...