在phonegap中提交表单后获取JSON对象

时间:2013-07-02 04:59:55

标签: android html5 forms jquery-mobile cordova

我是android中的phonegap开发新手。 我正在开发phonegap应用程序。我使用form标签在服务器上提交了代码。现在我想得到结果。所以请告诉我如何获取服务器返回的结果。结果是以JSON的形式。

这是我用来在我的html文件中提交表单的代码。

    <form id="signUpform" action="http://web1.xxx.com/sss/signup.php" method="post" 
    onsubmit="return( validate() );">
    <div style="float:left; width: 100%; height: inherit;">
        <h3>New Client</h3>
    </div>
    <br />
    <div style="float:left; width: 80%; height: inherit; margin-top: 5px;">
        <div style="float:left; width: 40%; height: inherit; margin-top: 5px; padding-top: 8px;">
             <label>UserName </label></div>
        <div style="float:right; width: 60%; height: inherit;">
            <input id="UserUsername" type="text" name="username" /></div>
    </div>
    <br />  
    <div style="float:left; width: 80%; height: inherit; margin-top: 5px;">
        <div style="float:left; width: 40%; height: inherit; margin-top: 5px; padding-top: 8px;">
            <label>Password </label></div>
        <div style="float:right; width: 60%; height: inherit;">
            <input id="pass" type="text" name="password" /></div>
    </div>
    <br />
    <div style="float:left; width: 80%; height: inherit; margin-top: 5px;;">
        <div style="float:left; width: 40%; height: inherit; margin-top: 5px; padding-top: 8px;">
            <label>   Confirm Password </label></div>
        <div style="float:right; width: 60%; height: inherit;">
            <input id="cpass" type="text" name="confirm_password" /></div>
    </div>
    <br />
    <div style="vertical-align:middle; float:left; width: 80%; height: inherit; margin-top: 5px;">
        <div style="float:left; width: 40%; height: inherit; margin-top: 5px; padding-top: 8px;">
            <label> Email ID </label></div>
        <div style="float:right; width: 60%; height: inherit;">
            <input id="UserEmail" type="text" name="email" /></div>
    </div>
    <br />
    <div style="float:left; width: 80%; height: inherit; margin-top: 5px;">
        <div style="float:right; width: 100%; height: inherit;">
            <input type="submit" value="Get Started"/> </div>
    </div>
</form>   

表单在服务器上提交。然后我在JSON fromat中找回结果。 结果是:

{"UserID":"220"} 

我提交表格后会在设备上打印。

所以请帮助我如何获得这个价值。

提前致谢

3 个答案:

答案 0 :(得分:2)

 var urlStr = URL1 + "username=" + username + "&password=" + password;

 jQuery.support.cors = true;
 $.ajax({
     type: "GET",
     crossDomain: true,
     contentType: "application/json; charset=utf-8",
     url: urlStr,
     data: "{}",
     dataType: "json",
     timeout: 5000,
     success: ajaxCallSucceed,
     error: ajaxCallFailed
 });

function ajaxCallSucceed(json){
 //  success
 }

function ajaxCallFailed(json){
 // failed
}

答案 1 :(得分:1)

      jQuery.ajax({
                    url : MyPostUrl,
                    type : "GET",
                    dataType : "json",
                    success : function(resultvalue) {

                        var val = JSON.stringify(resultvalue);
                        for ( var i = 0; i < resultvalue.Result.length; i++) {
                            finalresult = resultvalue.Result[i].result;
                            //alert(finalresult);
          //u can get your value here.
          //u need to use this loop to get value.
          //As it gives here {"result":"1"}
          //If your  "userID" is within "result" in json.Then u need to set another loop here.else just replace "result" with your "userID" key at (resultvalue.Result[i].result;). 
                        }
                        $.mobile.hidePageLoadingMsg();


                    },
                    error : function(e) {
                        //navigator.notification.alert("Request Failed.Please check Net connection");
                        navigator.notification.confirm(
                                'Request Failed.Please check Net connection', // message
                                alertDismissed, // callback to invoke with index of button pressed
                                'Title', // title
                                'OK' // buttonLabels
                        );

                        $.mobile.hidePageLoadingMsg();
                    }

                });

答案 2 :(得分:1)

要向远程服务器发送请求,请使用 jQuery.ajax

示例代码是

function FetchData() {
    $.ajax({
        async: false,
        type: "POST",
        url: "Your_URL",
        dataType: "json",
        success: function (data, textStatus, jqXHR) {


            $.each(data, function (i, object) {
                alert(obj.Data);
            });

        },
        error: function () {
            alert("There was an error loading the feed");
        }
    });
}

调用按钮的此功能onclick

希望有所帮助。