I want to access the image which is in Iframe using javascript / jQuery / AngularJS.
I tried with
window.frames['myIFrame'].contentDocument
but it did not work for me.
Related
Is there anyway to embed an iFrame in the RTE in typo3 backend?
I want to embed google maps and not have to use an extension, so is there any way to do this?
I tried using
RTE.default {
proc {
allowTags := addToList(iframe,embed,script)
allowTagsOutside := addToList(iframe,embed,script)
entryHTMLparser_db.allowTags < RTE.default.proc.allowTags
}
}
in my Page.typoscript but unfortunately it didn't work.
Does anyone have an idea on how to do this?
Apart from the first answer, it is possible to use the iframe CKEditor plugin which is shipped with TYPO3, in this way:
In your .yaml config (Just relevant parts):
editor:
config:
# add the toolbargroup if needed (e.g. default.yaml and full.yaml configurations already have it.)
toolbarGroups:
- { name: insert }
extraPlugins:
- iframe
processing:
allowTags:
- iframe
Then in your TypoScript Setup:
lib.parseFunc_RTE.allowTags :=addToList(iframe)
There is a downsize in this method that I was not able to circumvent so far: the <iframe> gets surrounded by a <p> tag in the CKEditor;
If you also add
lib.parseFunc_RTE.externalBlocks:=addToList(iframe)
The <iframe> if no more surrounded by paragraphs, but a couple of empty paragraphs appear before the iframe
I always use the HTML content element to add iframes. It works like expected and you don't need to arrange the RTE (which is not designed for putting iframes into it).
I'm using Xam.Plugins.WebView with static HTML on multiple pages of a carousel. I find that when a carousel page first shows a page the HTML takes a while to render and there's an ugly flash. This doesn't happen when using the default Forms WebView but I'm not using that because it doesn't do Javascript integration. Is there a way to trigger a rendering of HTML before it's visible? (Under the covers it's using WkWebView instead of UIWebView, which is what Forms WebView uses.)
I have a asp.net website with some header links in master page. For some of them I added link to jQuery mobile script to format those specific pages (forms) to look good on phones/tablets.
But after I load one of those pages and then click on some other page, it somehow caches the current page and although I can see the correct page being loaded for split second, it then reloads previous page. I don't know why this happens, but I know that culprit is the jQm link, because if I remove it, it works like expected (without the mobile design though).
I don't use data-role="page" attribute or anything, just classic asp.net page.
jQuery Mobile uses it's own kind of navigation model by default. It injects multiple specifically formatted pages into current page using AJAX. You probably need to disable it using code snippet below:
$( document ).on( "mobileinit", function() {
$.mobile.ajaxEnabled = false;
});
For more information check jQuery Mobile documentation navigation model and global configuration pages.
I am currently using Durandal 2.0 to produce a modal dialog box to display an HTML file. I am successfully doing it using IFRAME tag. Its needed for the application. SSRS produces these files daily and the user needs to see the content of these files on an intranet app. I was wondering is there a more preferred way of displaying the content of an external HTML file other than using IFRAME tags or is IFRAME tags are still the preferred way?
Thanks in advance for the answers.
If your HTML views has nothing to do with your view models then I think there is no point of making that HTML files to a Durandal view.
Because the actions/navigations happening in those HTML files are independent from your Durandal application it is better to use an IFrame.
I have one jQuery plugin (colorbox) that loads a modal popup window (with an external html file). <-- works perfectly by itself. I have another jQuery plugin (jScrollPane) that loads custom scroll bars for divs. <-- it too works perfectly by itself. Both have a JS component and a CSS component.
My process thus far:
I tried to load and initialize the scroll bar jQuery and CSS from the eternal html (popup) and my div disappeared.
Then I tried to load the scroll bar jQuery in the parent window and initialize it in the colorbox callback...this time my div didn't disappear but the scroll bar and arrows (even OS standard arrows) did disappear.
Finally, I put the scroll bar CSS in <style> tags and shoved it inside the eternal html file's <body> tags. That works on all major browsers, however, now you can't exit the popup window. Arg!
So I think my question is: how do you get jQuery plugins and their CSS files to initialize on dynamically loaded content? What goes where (incl. the jQuery library itself)?
Thanks!
If you are using the "window.open" type of popup, then I would say make it a little simpler and bring it into your page as a JQueryUI Dialog box that pulls in your external html file are the content, loading it in the DIV and accessible within the general page context, inheriting the JQuery and CSS as well. The simple form of this should be like:
$("#id").load(url).dialog();
Where #id is the DIV that is hidden and will contain your dialog data, and URL is the external url to the html file in your popup.
Found the solution....
My question was specifically on integrating colorbox (a jQuery lightbox plugin) with jScrollPane (a jQuery custom scrollbar plugin). My ajax call to load content with the colorbox worked, however, the jScrollPane could not initiate because the required wasn't loaded (because the ajax call didn't pull any info from the head tags).
If other Stack Overflowers stumble across a similar issue this is what I did to solve it: used iframes instead of an ajax call. Ooops. duh.
I don't know if colorbox is the only plugin that pulls info only from body tags and not the head but I imagine many plugins work this way when working with external files. If this is your problem, use iframes to ensure that the data in your head tag is pulled.
Thanks Stack Overflow anyhoo! I still love you.