I have two iframes on my page, frameOne and frameTwo.
I'm trying to refresh/reload frameOne from a script running in frameTwo.
function reload(){
srcLink = parent.document.getElementById('frameOne').src;
parent.document.getElementById('frameOne').src=srcLink;
}
This works but it refreshes to the initial value of the iframe.
IE:
If the parent page loaded with that iframe's src set to 'google.com' but then changed to (due to a user action) 'yahoo.com' my code will refresh that page to 'google.com', the link it was set to when the page was loaded. I would like to take into account the change of link and refresh that one.
Try this from frames[1] (the 2nd iframe page):
function changeFrameSrc(becauseURL, changeURL){
var bc = new RegExp(becauseURL, 'i');
if(bc.test(location)){
parent.frames[0].src = changeURL;
}
}
Related
I have this page on my website:
https://www.lior.vip/chat
When this page loads, there is an iframe in the center of the page that runs video chat system that works like zoom.
Before the page loads, I want a popup to appear that asks the user to enter his name with two buttons: "ok / continue without name"
When user enters his name and hits "ok",
I want this name to be added to the iframe src.
For example,
if the iframe src is: "https://www.videoconf.com/room1"
I want the source to be: "https://www.videoconf.com/room1/displayName=what user entered at name prompt.
And if user hitted "continue without name",
I want the iframe src stay the regular (https://www.videoconf.com/room1).
How can I do it?
The most simple way is use prompt comand. For example, you can write this code right after body tag in your page.
<script>
let displayName = "";
const namePrompt = prompt("If you want to enter anonymous you can click 'Cancel' button, else insert your name here:");
if (namePrompt !== null) {
displayName = "/displayName="+namePrompt;
}
document.getElementById("Iframe Id").src = "your url source"+displayName;
</script>
If you prefer you can create dinamically a popup window with javascript. Or put the code inside a function and get the name as return value.
Scenario:-
I've a local asp.net website directory :- "http://localhost/DemoWebsite/". A "Secure" folder is inside it. Two webpages are inside that folder :- Page1.aspx and Page2.aspx. And one more webpage:- Page3.aspx is outside the folder.
Requirement:-
Now 'Page2.aspx' is opening in a RadWindow from the parent page 'Page1.aspx'. A button 'Cancel' is there in 'Page2.aspx' and on-click of that button I want to come out of RadWindow and directly move to 'Page3.aspx'.
Attempted Solution:-
Button's 'OnClientClick' event is set to a JS function 'LogOff()'.
Definition is:-
function LogOff()
{
top.location.href = "http://localhost/DemoWebsite/Page3.aspx";
}
The Problem is that since I can't give the above mentioned enitre link when I want this website to push in some other server. So if I give the link as:-
top.location.href = "~/Page3.aspx"; OR Just, top.location.href = "Page3.aspx";
And when I run the website and click the Cancel Button. It throws error "Resource can't be found." It is because after button click it tries the link "/DemoWebsite/Secure/Page3.aspx".
Question:- what to assign for top.location.hrefso that it tries the link "/DemoWebsite/Page3.aspx". As Page3.aspx is NOT in Secure folder.
You could do something like.... GetRadWindow().BrowserWindow.location.href = '../page3.aspx';
GetRadWindow() is a function that gets a reference to your radwindow....
function GetRadWindow()
{
var oWindow = null; if (window.radWindow)
oWindow = window.radWindow; else if (window.frameElement.radWindow)
oWindow = window.frameElement.radWindow; return oWindow;
}
The BrowserWindow part will get a reference to your window that the radwindow opened from. The rest just redirects the opening window to the location that you want.
EDIT: after looking at your question again i think you just need to know how to get to the relative path through javascript? if that is the case it is like this... document.location.href = '../'; //Up one level. The ../ will jump you back one level. If you just use /path then it will assume you are going from the same folder level that your current page is on.
On an ASP.NET page with a tabstrip, I'm using the hash code in the URL to keep track of what tab I'm on (using the BBQ jQuery plugin). For example:
http://mysite.com/foo/home#tab=budget
Unfortunately, I've just realized that there are a couple of places on the page where I'm using an old-fashioned ASP.NET postback to do stuff, and when the postback is complete, the hash is gone:
http://mysite.com/foo/home
... so I'm whisked away to a different tab. No good.
This is a webforms site (not MVC) using .NET 4.0. As you can see, though, I am using URL routing.
Is there a way to tell ASP.NET to keep the hash in the URL following a postback?
The problem is that the postback goes to the url of the current page, which is set in the action of the form on the page. By default this url is without #hash in asp.net, and its automatically set by asp.net, you have no control over it.
You could add the #hash to the forms action attribute with javascript:
document.getElementById("aspnetForm").action += location.hash
or, if updating an action with a hash already in it:
var form = document.getElementById("aspnetForm");
form.action = form.action.split('#')[0] + location.hash
just make sure you execute this code on window.load and you target the right ID
I tried to put the code from Willem's answer into a JS function that got called everytime a new tab was activated. This didn't work because it kept appending an additional #hash part to the URL every time I switched tabs.
My URL ended up looking like http://myurl.example.com/home#tab1#tab2#tab3#tab2 (etc.)
I modified the code slightly to remove any existing #hash component from the URL in the <form> element's action attribute, before appending on the new one. It also uses jQuery to find the element.
$('.nav-tabs a').on('shown', function (e) {
// ensure the browser URL properly reflects the active Tab
window.location.hash = e.target.hash;
// ensure ASP.NET postback comes back to correct tab
var aspnetForm = $('#aspnetForm')[0];
if (aspnetForm.action.indexOf('#') >= 0) {
aspnetForm.action = aspnetForm.action.substr(0, aspnetForm.action.indexOf('#'));
}
aspnetForm.action += e.target.hash;
});
Hope this helps someone!
I have another solution, implemented and tested with chrome, IE and safari.
I am using the "localStorage" object and it suppose to work all the browsers which support localStorage.
On the click event of tab, I am storing the currentTab value to local storage.
$(document).ready(function() {
jQuery('.ctabs .ctab-links a').on('click', function(e) {
var currentAttrValue = jQuery(this).attr('href');
localStorage["currentTab"] = currentAttrValue;
// Show/Hide Tabs
jQuery('.ctabs ' + currentAttrValue).show().siblings().hide();
// Change/remove current tab to active
jQuery(this).parent('li').addClass('active').siblings().removeClass('active');
e.preventDefault();
});
if (localStorage["currentTab"]) {
// Show/Hide Tabs
jQuery('.ctabs ' + localStorage["currentTab"]).show().siblings().hide();
// Change/remove current tab to active
jQuery('.ctabs .ctab-links a[href$="' + localStorage["currentTab"] + '"]').parent('li').addClass('active').siblings().removeClass('active');
}
});
I have the following JQuery code in a external JS file linked into a
usercontrol in .Net 1.1 webapp.
The usercontrol is a timesheet.
When the page loads it calls MonthChange and works fine in one page.
But now I want to load the timesheet/usercontrol into aother
webpage that pops up a in a new browser window for printing.
Problem is my MonthChange is not firing.
Any ideas why???
$(function() {
MonthChange();
//TestData();
$('[class^=TSGridTB]').blur(function() {
var day = GetDay($(this).attr('id'));
var date = GetRowDate(day);
var bgcolor = GetInputFieldColor(date, false);
$(this).css("background-color", bgcolor);
$(this).parent().css("background-color", bgcolor);
//CalcHours($(this).get(0));
});
$('[class^=TSGridTB]').focus(function() {
var day = GetDay($(this).attr('id'));
var date = GetRowDate(day);
var bgcolor = GetInputFieldColor(date, true);
$(this).css("background-color", bgcolor);
$(this).parent().css("background-color", bgcolor);
});
$('[id$=lstMonth]').change(function() {
MonthChange();
});
});
without seeing further code, ensure that the selector is correct for the control in the new page.
The problem may be that the DOM has changed for the new page/window and JQuery does not yet know about it.
The change event
fires when a control loses the input
focus and its value has been modified
since gaining focus.
You might want to use the live event:
Binds a handler to an event (like
click) for all current - and future -
matched element.
When you bind a "live" event it will
bind to all current and future
elements on the page (using event
delegation). For example if you bound
a live click to all "li" elements on
the page then added another li at a
later time - that click event would
continue to work for the new element
(this is not the case with bind which
must be re-bound on all new elements).
Did you make sure that the new web page has jQuery script includes?
ensure you're using:
$(document).ready(
);
around your entire code block. The $ alone often does not do the trick.
I have a page which work like a navigation and a iframe in this page which show the content.
Now there are some situation when the inner page is directly shown in the browser.
eg: if somebody types the inner page's url in the browser address bar, the page is displayed in the window.
I want to prevent this.
Better still, I would like to redirect to any other page.
window.parent: The window object that contains the frame. If the the window is the top level window then window.parent refers the window itself. (It is never null.)
window.top: The top level window object, even if the current window is the top level window object.
window.self: The current window object. (It is a synonym of window.)
So, I'd write my check like this:
if (window.top == window.self) {
window.location = "index.html";
}
Which would be identical to the slightly more ambiguous:
if (window.top == window) {
window.location = "index.html";
}
<script language="Javascript"><!--
if (top.location == self.location) {
top.location = "index.html" // must be viewed in main index
}
//--></script>
modified it from a situation where an an iframe decides to become the main frame.