JSONP not firing on IPad
After trying everything possible I've come to the conclusion this is an issue with IPad Safari. This works in FF, IE, Chrome, and Safari on MacBook. Below is my dumbed-down code. I have 2 separate JSONP calls, This first one works in all browsers including IPad. This simply calls a function based on a blur event
$('#gender').blur(function() { reTarget(); });
function reTarget() {
$.getJSON("http://host.com/Jsonpgm?jsoncallback=?", function() { } );
}
Below is where things break. On the same page as the above code is the following, which calls a function based on a submit button click.
$(':submit').bind('click', f开发者_开发百科unction(event) {
if (checkThis() == false) { return false; }; });
$('form').bind('submit', function(event) {
if (checkThis() == false) { return false; }; });
function checkThis() {
$.getJSON("http://host.com/Jsonpgm.aspx?jsoncallback=?", function() { } );
}
This code will not fire. I've put alerts right before it and they fire. I look at the web logs and there is no entry for this json call. I would take any suggestions on this. At this point I fear it's a problem with firing jsonp from a submit event.
It could be the selectors. Try selecting the form and submit button by ID to make sure.
I apologize for not being clear here. The checkThis() function is firing. It is that the getJSON is not. If I use the following code for the function it fires the alert but there is no log of the getJSON call. Again, this works in every other browser including Safari on Apple laptops.
function checkThis() { alert('got this far'); $.getJSON("http://host.com/Jsonpgm.aspx?jsoncallback=?", function() { } ); }
Here is the code at its simplest. On an IPad, when I select a gender I get the 'retarget' alert, and I see an entry in the web log. When I click submit I see the 'submit' alert, but there is no entry in the web log. Again everything works fine in all other browsers.
<div>
<table>
<tr><td>First Name:</td>
<td><input type="text" id="myFirstName" size="15" /></td>
</tr>
<tr>
<td>Gender:</td>
<td>
<select id="gender">
<option>Select</option>
<option value="M">Male</option>
<option value="F">Female</option>
</select>
</td>
</tr>
</table>
<input type="submit" id="btnSubmit" name="Go" />
</div>
<script type="text/javascript" src="my.com/jquery-min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(':submit').bind('click', function(event) {
if (checkThis() == false) { return false; }; });
$('#gender').blur(function() { reTarget(); });
});
function checkThis() {
alert('submit');
var parms = ' {"locationID" : "926", "success" : "1" } '
var takeUrl = "http://my.com/mypgm.aspx?jsoncallback=?";
$.getJSON(takeUrl, parms, function() { } );
}
function reTarget() {
alert('retarget');
var passVals
passVals = ' { "locationid": "926", "pubparms": "45" }'
var targetUrl = "http://my.com/Retarget.aspx?jsoncallback=?";
$.getJSON(targetUrl, passVals, function(data) { } );
}
</script>
</form>
This has been solved. After much google and forums it turns out the page tear-down was occurring before the json call was initiated. I changed the code to stop the button click propogation, fire the getJson call, then in the callback function trigger the button click. That solved the problem. The thing that did not work was setting to a synchronous call.
精彩评论