Submitting a form inside an iframe using javascript - javascript

I have a link created by the following html/javascript:
Copy Item
myDoc is: top.frames[0].document;
This is supposed to post the form. It works fine in all browsers when run outside an iframe, but, once I get it inside the iframe, it only works in IE and not in Firefox.
What am I doing wrong?
Ok: A follow-up. I got this to work, but now I'm wondering why I was able to. I set myDoc = top.frames[0].document; further up in the form creation and then I try to use it in the link declaration. It works fine in IE. But, when I'm in Firefox, I can't use myDoc. I have to explicitly use top.frames[0].document instead. Why is this?

That's probably because of some security issues. I would suggest putting the form inside the root-document and setting form.target to the name of the iframe.

Related

Bookmarklets doesnt work when run from bookmark, but works from console

I am trying to create a bookmarklet that will insert some text in a textarea on a webpage (webpage is for internal use so no point in linking).
Here is example of javascript code i tried:
(function(){document.getElementById("textareaID").value="Some text";})();
I'd like to point out that i tried different element selectors (byClass, query...) and different attributes (even tabindex) to the same result. Also tried in both Chrome and IE11.
So, for some weird reason my javascript runs when i run it from console (or as a snippet) but i get an error "Cannot set property 'value' of null" when i try to run it from bookmark menu.
I tried creating a bookmarklet by myself
javascript:(function(){document.getElementById("textareaID").value="Some text";})();
and tried using online bookmarklet creators to encode special characters
javascript:(function(){document.getElementById(%22textareaID%22).value=%22Some%20text%22;})();
but no luck.
Bookmarklets definitely work on a page (tried with alert "Hello") but i seem to have a problem "capturing" elements.
Also i noticed that ID's of some elements change sometimes (not sure why though), but i always inspect to make sure that ID i try to use exists or i use some fixed value like tabindex. Besides, as i said it works when run from console, so i couldn't have screwed it up somehow... or could have i?
So the problem was execution context.
Because IDs of elements were changing i had to inspect them before running js from console and inspecting changes the execution context from top to wherever the element is. That's why it was working from console and not from bookmark...
So, to write into a textbox inside specific frame:
let Iframe = document.getElementById('yourIframe').contentWindow.document
let value = Iframe.getElementById("textboxID").value = "Some Text"
After that only thing left is to wrap everything inside a javascript:(function(){..your code here..})(); to create a bookmarklet.

Error when using js in href ie 11

I have a link:
someText
it works fine everywhere except ie(i try ie11) i have this error
This page can’t be displayed.
Make sure the web address //ieframe.dll/dnserror.htm# is correct.
How can i solve this?
If you use a javascript URI scheme in a HTML href attribute, this is different to using an onclick event handler.
In IE, the result of executing that JavaScript will replace the currently loaded document.
To avoid this (without refactoring your code to not do things this way), you can end your href with the javascript operator void, which tells your javascript to return nothing, at all (well, undefined).
Then IE will stay on the current page.
<a href="javascript:someObject.someFunction(); void 0" ...
...and you probably don't want the target="_blank" since you're telling a new window to run your JavaScript code, and your function is not available in that window.
I would do this instead:
someText
It will open a new tab as you intended, and it works in chrome, firefox and IE.

javascript not loading in firefox alone

I have added a piece of javascript code and it is not getting reflected in some of my peer's machine. Don't know whats going wrong.
This is what I did.
OnClick of a button, there was an existing JS function and I added an overlay feature inside the click event like,
function existing() {
var testDate = document.getElementById('test');
......
.....
newOverlay(); // This is the newly added function
}
I defined the newOverlay() as
function newOverlay(){
document.getElementbyId('divId').style.display = 'block';
}
I have defined the new function above the existing() and both the functions are inside the head tag
When I check this change in my local environment, it was working fine and there was no issues. When I deployed to the server, it was working fine for me and my peer could not see the change in firefox. But, he can verify the change in IE and Chrome.
We were thinking of some cache in the browser and we cleared the cache (ctrl+shft+del --> Everything) and tried. The issues occurred again. The part I added was not in the DOM itself. We tried Ctrl+F5, but it was not helpful.
When we reset the firefox browser and tried, the change got reflected and it was working fine. Don't know what was exactly happening. The issue is still occurring in some of our machines. Kindly share your thoughts.
Note: The entire JavaScript is inside a JSP and all are using the same version of Firefox (latest)
Try double quoting in the getElementById(). "id_name" instead of 'id_name'. Sometimes browsers are prone to this kind of bugs.

In IE, when binding to the 'load' event of an IFRAME, this.contentDocument is undefined

Ok, bear with me folks, the setup on this one is long.
I have a simple page. It loads an iframe. Inside that iframe is a form. I want the form inside the iframe to interact with the parent page via jQuery.
This works correctly in Firefox, Chrome, and Safari. See for yourself here:
http://dl.dropbox.com/u/58785/iframe-example/index.htm
However, in Internet Explorer 6/7/8/9, it does not work. The load event fires, but jQuery cannot get a handle on elements inside the iframe.
I'm using the second 'context' argument of the jQuery function to set the context of the selector, like this: var form = $('#myform'), this.contentDocument)
Here's what is batty. Using the F12 Developer Tools in IE9, I can set a breakpoint in my JavaScript and look at how IE is evaluating the JavaScript. If I hover over this, I can see that it does have a contentDocument property. BUT, if I hover over this.contentDocument, it tells me it's undefined.
Because it's undefined, the jQuery selector returns no elements. Again, this is only in IE. And the IFRAME is on the same domain, so it's not a same-origin issue.
Any pointers?
Not to trample on Roatin's answer, but this issue can also be fixed by specifying a DOCTYPE declaraction. Internet Explorer 8 and over require it for contentDocument. Otherwise, as he said, contentWindow can be used (for earlier versions of IE, too). See the information at W3Schools.

What's wrong with this Javascript code?

Insert Table
The code works perfectly fine in Google Chrome but in Internet Explorer and Firefox it just redirects to a page with the text "block"
You should never use the javascript: pseudoprotocol. Use the click event for this. Besides, also watch the quotes.
Here's the correct approach:
Insert Table
Note that I (optionally) returned false here to block the default action.
Your qoutes are wrong:
javascript:document.getElementById('create_table').style.display=''block
It must be:
javascript:document.getElementById('create_table').style.display='block'
But you shouldn’t use javascript: pseudo-protocol anyway. Better use JavaScript to only enrich your document.

Categories

Resources