3

I have built a website for a client in asp.net 4 which uses jQuery (1.7.2) fairly heavily. The site works fine in all modern browsers, mobile clients etc.

The client has a twitter account for his business, when someone follows them they get an automated response message that contains a link to the site. He has raised an issue that when customers are clicking that link whist using the twitter app on an iOS device the site did not work correctly.

I have nailed this down to the fact that twitter uses a webview to display the site and not safari and it seems within this webview there is some sort of error when I try to get the asp.net scriptmanager instance via javascript and so the document never becomes ready so no more jQuery document.ready events fire! If I put subsequent scripts in window.load then they works fine.

I created a very simple page to test this which in its entirety looks like this:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    </head>
    <body>
        <form id="form1" runat="server">

            <asp:ScriptManager ID="sm" runat="server"></asp:ScriptManager>

            <script type="text/javascript">

                $(document).ready(function () {
                    if (typeof (Sys) === "object") {
                        var manager = Sys.WebForms.PageRequestManager.getInstance();
                    }
                });

                $(document).ready(function () {
                    alert("staging1");
                });
                $(window).load(function () {
                    alert("staging2");
                });
            </script>
        </form>
    </body>
</html>

So if I load that page in the webview, I only get the second alert from within the window.load. If I take out the line that declares the variable manager. I get both alerts as the second document.ready event fires.

If I run the page in any browser, I get both alerts always.

Has anyone come across this or have any reason why this wouldn't work?

Any help/expertise greatly welcome!

Thanks

Steve
  • 8,153
  • 9
  • 44
  • 91
user1793938
  • 41
  • 1
  • 5
  • 1
    It is great that you have narrowed it down! I would not have thought of that webview vs safari difference. Here are two links that might be helpful http://stackoverflow.com/questions/10996028/uiwebview-when-did-a-page-really-finish-loading http://stackoverflow.com/questions/908367/uiwebview-how-to-identify-the-last-webviewdidfinishload-message?rq=1 – JP Hellemons Nov 02 '12 at 12:38
  • i think write your jquery document.ready in your form head section – Rajpurohit Nov 02 '12 at 12:41
  • thanks for the links JP... see the solution below – user1793938 Nov 02 '12 at 13:46

1 Answers1

3

You must do this:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

     <script type="text/javascript">

    $(document).ready(function() {
        if (typeof (Sys) === "object") {
        var manager = Sys.WebForms.PageRequestManager.getInstance();
        }
    });

         $(document).ready(function () {
             alert("staging1");
         });
         $(window).load(function () {
             alert("staging2");
         });
    </script>
</head>
<body>
    <form id="form1" runat="server">

    <asp:ScriptManager ID="sm" runat="server"></asp:ScriptManager>

    </form>
</body>
</html>
mram888
  • 4,899
  • 5
  • 33
  • 59
  • in case anyone has the same problem... see the bug in the microsoft runtime which doesn't correctly identify the webview browser so does not serve any Javascript. I followed the solution in this article and it now works fine... http://connect.microsoft.com/VisualStudio/feedback/details/631438/asp-net-4-0-issue-with-browsercap-incorrectly-detecting-safari – user1793938 Nov 02 '12 at 13:48