开发者

Why am I not able to do a jQuery POST return to another domain?

When I use json in my $.ajax all I get is a red 200 in firebug and data is inserted in database, however I am not getting the JSON return.

When I use jsonp, I am not even able to submit the page.

Here is my code:

<html> 
    <head> 
    <title>Register</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
    <link rel="stylesheet" type="text/css" href="http://dev.jtsage.com/cdn/datebox/latest/jquery.mobile.datebox.min.css" /> 




    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
    <script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jquery.mobile.datebox.min.js"></script>



<script type="text/javascript">
    $(document).ready(function() {

                     $("#contactus").submit(function(event) {

                $.ajax({
                    type: "POST",
                    url: "http://apsessionmobile.mobi/index.php/api/apsessionmobile/user/",
                    data: $("#contactus").serialize(),
                    dataType: 'jsonp',

                    success: function(msg){
                     //   jQuery("#status").html(msg);
                    alert(msg);
                    }
        })
    })
});
</script>

</head> 
<body> 



<div data-role="page" data-theme="e">

    <div data-role="header" data-position="fixed">
        <h1>开发者_JS百科Register</h1>
        <a href="home.html" data-icon="back" class="ui-btn-left" data-rel="back">Back</a>
        <a href="home.html" data-icon="home" class="ui-btn-right">Home</a>
    </div><!-- /header -->

    <div data-role="content">   

    <div align="center">

    <form action="JavaScript:void(0);" name="contactus" id="contactus">


    <div id="fnameDiv" data-role="fieldcontain">


        <label for="username">Create User Name:</label>     
        <input id="username" name="username" type="text" />


        <label for="email">Email:</label>       
        <input id="email" name="email" type="text" />



        <label for="password">Password:</label>     
        <input id="password" name="password" type="password" />



        <label for="password2">Repeat Password:</label>     
        <input id="password2" name="password2" type="password" />




        <button type="submit">Register</button>



    </div>




    </form>

    </div>

    </div><!-- /content -->

    <div data-role="footer" data-id="thefooter" data-position="fixed">
        <h4></h4>
    </div><!-- /footer -->
</div><!-- /page -->

</body>


cross domain requests are not allowed through ajax. however, try to use network inspector to see if:
1) request is made when you submit form
2) what is sent
3) what content is returned (if any)

if there are cross domain access issues, or any other js error, console should tell you that.


  1. JSONP only works for GET requests, because JSONP simply includes a script element in the HTML that loads the page, which contains the JSON with padding (a callback) that handles said JSON data. And then removes the script element again.

  2. I'm not familiar enough with jQuery, so this is going to be a wild guess. But what's probably happening is a hidden form is submitted to a hidden iframe, with the external request. This works partially, as the data is sent succesfully, except because the hidden iframe now is used by another domain JavaScript is unable to read the content and thus is unable to parse the JSON response inside.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜