I have a fairly simple jQuery mobile app, which works fine as a web app (tested in browsers on desktops/smartphones) but when porting it to android using phonegap, I have one major issue. It occurs both on a real phone and in an AVD.
there's a form in the app, like:
<div data-theme="a" data-role="dialog" id="a-form">
<div data-role="content">
<h3>...</h3>
<form action="http://a-live-site.com/a-form.php" method="post">
...
<div data-role="fieldcontain">
<button type="submit">Submit</button>
</div>
</form>
</div>
</div>
Its response content loads perfectly in the browser (the action is a relative link there), but within phonegap I just get a white screen and the hardware back button exits the app instead of the usual step back in history. The puzzling thing is that the request actually gets through. The server side code triggers an email, so I know the server is getting the request. I have added the appropriate <access /> rules in the phonegap.xml file, but I'm not sure that's enough.
EDIT: the form is in static content so, in phonegap, it's loaded by file:// and shouldn't have cross-domain issues.
The problem was due to data-role="dialog" in the result. Using page fixed it. It only broke in phonegap and phonegap's logs made it look like it was something else. A real PITA.
Related
I'm working on a website redesign based on the Bootstrap 3 framework.
In configuring the site's contact form, and implementing a captcha, I've run into an issue with my CSS.
Everything works well in Chrome, but in Firefox, the captcha overflows the form boundaries, and is off to the side, whereas in Chrome, it's under the form and integrated more normally. To attempt to fix this, I put the captcha (which was outside of the form's div tags originally) inside it's own div group. That fixed part of the issue, in properly aligning the captcha under the rest of the form.
However, now that I've done that, the captcha (and the form label it's associated with) overruns the form boundaries on both sides, and doesn't display properly in either Chrome or Firefox. Further, it doesn't space properly, despite being in its own div.
http://www.weatherworks.com/contact/contact.php
I'm not sure how - or if - I can fix this. I'm a student and web design is more of a hobby for me; I'm actually doing this redesign as part of a weather-related internship. I'm fairly knowledgeable on HTML and CSS, but am pretty lost with this issue. Was hoping someone here who's worked with forms and/or Bootstrap might have some insight for me.
Thanks!
You missed a closing tag of the <div class="form-group" id="commentTxt">. Place a close tag above the next <div class="form-group">
<div class="form-group" id="commentTxt">
.
.
.
</div> <!-- Add this div -->
<div class="form-group">
<label class="col-lg-2 control-label">Verify Humanity</label>
I am trying out serving DFP ads in email. I'm following the guidelines here.
I have an ad unit set up just for email
I have a line item targeting that ad unit with just an image creative
The line item doesn't have any targeting restrictions or anything like that
The ad will show up in the email, at least the first time. The strange thing that I'm seeing is, after the first click, clicking on the ad again will often bring me to a blank page rather than the click-through page of the creative. Also, when I reopen the message, occasionally the image will not load. The code in the email looks like this:
<a href="https://pubads.g.doubleclick.net/gampad/jump?iu=/{my_pub_id}/300x250_email&sz=300x250&c={cachebuster}&tile=1">
<img src="https://pubads.g.doubleclick.net/gampad/ad?iu=/{my_pub_id}/300x250_email&sz=300x250&c={cachebuster}&tile=1" />
</a>
We've solved this by turning off cookies in the standard tag using the co= option; adding co=1 to the tag.
<a href="https://pubads.g.doubleclick.net/gampad/jump?co=1&iu=/{my_pub_id}/300x250_email&sz=300x250&c={cachebuster}&tile=1">
<img src="https://pubads.g.doubleclick.net/gampad/ad?co=1&iu=/{my_pub_id}/300x250_email&sz=300x250&c={cachebuster}&tile=1" />
</a>
The only problem (for us) that this creates is that we're unable to serve 3rd party tags, even ones that resolve directly to .gifs, using the standard tag.
Had the same problem and I solved it by using script to redirect click via script on my web server where ad is shown again so that all the cookies can be set.
Link looks like this:
http://www.mysite.com/dfpclick.php?adunit=mailing&cbuster=1369608725
Script dfpclick.php:
<?php
/* Google DFP url redirect*/
if ($_REQUEST['adunit']) {
$sUrl = 'http://pubads.g.doubleclick.net/gampad/jump?iu=/%mygoogleid%/'.$_REQUEST['adunit'].'&sz=1x1&c='.$_REQUEST['cbuster'];
}
?>
<html>
<head>
<meta HTTP-EQUIV="REFRESH" content="0; url=<?=$sUrl?>">
</head>
<body>
<?php
if ($_REQUEST['adunit']) {
echo '<img src="http://pubads.g.doubleclick.net/gampad/ad?iu=/%mygoogleid%/'.$_REQUEST['adunit'].'&sz=1x1&c='.$_REQUEST['cbuster'].'" width="0" height="0" border="0" style="width:0px; height:0px;" alt=""/>';
}
?>
</body>
</html>
It turns out that DFP for small business requires cookie support to work, even when using the non-JavaScript method of calling ads. So it works fine in web-based clients like Gmail, but it doesn't work in Outlook and the like. DFP Premium can supposedly serve ads in email without requiring cookies.
Using the co= option doesn't work for DFP Small Business. My workaround is:
Use the same code for img <img src="https://pubads.g.doubleclick.net/gampad/ad?iu=/{my_pub_id}/300x250_email&sz=300x250&c={cachebuster}" />
And build a redirect link on your website <a href="http://yourwebsite.com/adunit/300x250_email">. This page reads and filters the response from http://pubads.g.doubleclick.net/gampad/adx?iu=/{my_pub_id}/300x250_email&sz=300x250&c={cachebuster} in order to get the click-tracking link using javascript link=$(xmlDoc).find('a').attr('href'); and redirect.
This workaround doesn't work for rotation (more than one creative/line item is competing for the same ad unit at the same time).
I'd like to know how to serve email ads in rotation using DFP SB
I am using jQTouch and Phonegap and it perfectly runs in my Xcode and iPhone simulator. What I am trying to develop is to dynamically display external webpages within my application.
For example, when you first run the application it shows table with data "User Interface", "Animations" ... etc. What I want to make is when user taps on "User Interface" it should display some external web pages ( lets say google's home page).
I wrote the following code and this is inside User Interface->Edge to Edge->(here I want to dispaly the home page of google). The width:340 and height:420 will be the display area of google's home page. Please help me to make it.
<div id="edge">
<div class="toolbar">
<h1>Edge to Edge</h1>
back
</div>
<div style="width:340px; height:420px; background:red;">
<ul class="edgetoedge scroll">
<li class="sep">under construction...</li>
</ul>
</div>
</div>
Thank you
You will need to load an <iframe> into the div you want to display the content of the external page.
http://www.w3schools.com/tags/tag_iframe.asp
Make sure to add the external URL to the whitelist (ExternalHosts entry in PhoneGap.plist as per the PhoneGap for iOS FAQ: http://wiki.phonegap.com/w/page/41631150/PhoneGap%20for%20iOS%20FAQ) and set the Boolean for OpenAllWhitelistURLsInWebView to YES.
I'm trying to use Jquery Mobile for a web-app, and depending on what button the user clicks, redirect them to a new web page.
Example:
A user visits foo.com/index.php.
When they click login it takes them to foo.com/login.php.
That much I've been able to figure out using:
<a class="ui-block-a" data-role="button" type="submit" onclick="window.location.replace('./login.php');">Login</a>`
When I try setting href to "./login.php", it sends me to foo.com/#./login.php.
That is all well and good, but the web browser is really going to:
foo.com/index.php
foo.com/index.php#undefined
foo.com/login.php
which is causing a problem because the user has to click the back button twice.
How can I send the user from index.php to login.php without the browser trying to go to #undefined first?
I also tried:
<a class="ui-block-a" data-role="button" type="submit" onclick="window.location.replace('./login.php');" href="">Login</a>
but it still sends the viewer to foo.com/index.php# before redirecting properly.
<a href="javascript:location.replace('./login.php');" class="ui-block-a" data-role="button" type="submit" >Login</a>
Also, have you considered just simply linking to the page normally but with an attribute of rel="external" ?
try making it window.location.replace('login.php');
or window.location.replace('/login.php');
I'm writing a Facebook iframe/Facebook Connect application and one of the pages includes a multi-friend-selector. It renders perfectly in every browser I tried (FF/Mac, Safari/Mac, IE8/Win) but does not render at all in IE7/Win. I waited and waited (in case it was just being slow) and it never appeared.
Here's my code.
<fb:serverfbml style="width:750px;height:700px">
<script type="text/fbml">
<fb:fbml>
<fb:request-form
action="<? echo $invite_href; ?>"
method="post"
type="<? echo $app_name; ?>"
content="<? echo htmlentities($content,ENT_COMPAT,'UTF-8'); ?>">
<div class="clearfix" style="padding-right:20px;" height="500" width="750">
<fb:multi-friend-selector
actiontext="Here are your friends who don't have <? echo $app_name; ?> yet. Invite your friends and let them help too - it's free!"
exclude_ids="<? echo $friends; ?>" />
</div>
</fb:request-form>
</fb:fbml>
</script>
</fb:serverfbml>
The other required things (FeatureLoader.js and all that) are (must be) properly included, since the friend selector and every other fb tag I use around the application works perfectly. The serverfbml tag is the ONLY thing giving me trouble in IE7. Most people seem to have a problem with the selector rendering at an annoying 150px tall - I can't seem to find anyone else who has a problem with it not rendering at all.
You do not need the closing tags because you're rendering FBML insdie the serverfbml tag, not xfbml. Another thing I noticed is you're passing PHP variables into it, whereas I'm pretty sure Facebook strips out all your php from within the server fbml, I may be wrong though.
Daniel
Another SO post, which solved my problem: Why does this XFBML markup embedded within an iframe'd facebook application not display anything?
Are you using IE Tester to test ie6? If so it fails to render, this is an IE Tester bug.
Facebook is encouraging developers to switch to Requests 2.0. FBML is being deprecated and so reliance on fb:serverFbml will likely by phased out at some point this year. Fortunately there is a MUCH easier way to do this using the JavaScript SDK and it even works on websites.
FB.ui({method:'apprequests',...});
Learn more about using this here: http://af-design.com/blog/2011/02/17/using-facebook-requests-to-promote-a-website/