We are loading Extjs Web app from our existing web app. We done something like this below
<iframe width="100%" height="400px" src="http://examples.sencha.com/extjs/6.2.0/examples/kitchensink/"></iframe>
When we open this localhost link iPad safari. iFrame is loaded fine, but when I click on buttons or links it is not responding.
If I replace iframe src link to something else, it works fine. Is it know Extjs issue or is there any workaround for this.
Thank you.
I got the same issue. Eventually, it turns out that this is an iOS iframe problem that doesn't pass "touchstart" event to iframe.
To solve problem put this code to the parent window :
function dummy() {
// console.log("A bug? Where?");
}
addEventListener("touchstart", dummy, false);
You can see original post from this link
Related
I have a WebView which loads a web form containing within an iframe as shown below.
It should go to the next step (again an iframe similar to the screenshot where the url remains the same) once the "next" button is pressed with valid credentials. However, in iOS it keep refreshing the page, but it works successfully in Android and also if I launch the page independently in Safari browser in iOS, it works just fine.
Additionally I integrated the Safari browser using "SafariServices" to the app but ended up refreshing the page again as before.
Can someone help me figuring out how to get it to work?
I am using the WebView as below
<WebView
style={styles.WebViewStyle}
source={{uri: newStudentUrl}}
javaScriptEnabled={true}
domStorageEnabled={true}
scalesPageToFit={true}
renderLoading={this.ActivityIndicatorLoadingView}
startInLoadingState={true}
/>
Thanks. Your help is greatly appreciated
I am using cordova-plugin-wkwebview-engine in a phonegap app to open a web page:
ref = window.open(url, '_self', 'location=no,toolbar=no');
All is working fine thus far, page displays properly, iOS log says the app is using wkWebView, and the display is much faster than when using UIWebView.
I want to send a postmessage from the page in the WkWebView and handle the message in my index.js running on the device. From the WkWebView issues pages, I copied the following code into the webpage:
<button type="button" name="button" onclick="sayHello()">Say hello</button>
<script type="text/javascript">
window.addEventListener("message",function(event){
console.log("IFRAME");
console.log(event);
}, false);
function sayHello(){
parent.postMessage("Hello!","*")
}
</script>
I compile/install the app and run. I tap the button and the debugger says that parent.postMessage executes. So now I'm ready to code the message handler on the device side.
The copied code obviously assumes that it is running inside an iframe on what I assume is the main index.html launched by Phonegap.
Before I try the iframe approach, I want to know: Has anyone has found a way to use postmessage to communicate between index.js and the WkWebView WITHOUT resorting to iframes?
For example, my window.open creates object 'ref'. Can I simply add an event listener on 'ref' to capture the message? If so, then I suspect I'll need to use something other than 'parent' when calling 'parent.postmessage'. What would that be?
Suggestions are good, examples are better.
Note that this app has not yet required delving into native code... Phonegap Build has been doing just fine to create my installables. I'd like to keep it that way if possible.
My IOS (tested on 9.2) web application (apple-mobile-web-app-capable) avoids <a href="xxx" />
links and uses only Javascript navigation functions like windows.location.replace(url) to navigate to the pages.
The root of my application is not www.xxx.com but www.xxx.com/mysite. Some of the navigate operations to /mysite/xxx are working, but other navigations to /mysite/yyy open the Safari window.
Beside the <a href="xxx" /> links, are there other situations which can cause the web app to open the link in a separate Safari window ?
I do not use target Attribute. All my links look like
<a ng-click="vm.replace('/mysite/xxx') class="navbar-brand">Contact</a>
...
replace(url:string) {
this.$window.location.replace(url);
}
I also tried the different variations (location.href = url, location = url) all with same result. Maybe the Problem is IOS 9.2 related, I am sure that the same construct was working in web apps I created some month ago.
Is it possible that the content of the target page is responsible for this behavior ? Navigating from /mysite/Home to to /mysite/Media works, navigating to /mysite/EPG opens the Safari browser. Maybe something bad in the browser cache ? So I cleared the cache, but same result.
Based on your description, it sounds like target="_blank" is being used, which is what causes web links to open in a new window. As you're using JavaScript for all your links, this should be relatively easy to check.
I'm using PhoneGap with AngularJS framework.
I want to display a web page. I tried to use iframe but scroll isn't working.
I want to keep this page inside my app and not as a in app browser or external browser.
My app is running on iOS, Android and WP8 both.
Some help please :)
Thanks in advance
function loadWebView(pid)
{
var url = "http://dummysite.com/index.php/catalog/product/view/id/"+pid;
$("#div_load_page").html('<object data='+url+' class="webview"/>');
};
This is simple jQuery I've applied in my phonegap application which gives me the desired result. Scroll bars are visible and depend on site's responsiveness and size.
See Result.
I am developing an app using Appcelerators Titanium. The app consists of a webview. The webview shows i local page, iframe.html, and this iframe's src is pointed to a remote page.
However, this doesn't work out as i expected since it doesn't seem like the remote page can't store cookies when wrapped in an iframe. It works great on desktop and other devices. This seems to be an issue exclusive to iOS. I need the iframe, and i need cookies. What can i do to solve this?