Post request gives error on submitting forms data to server

I have a form whose data I am submitting to server through post request. Here is my request code in controller:

        $scope.submitFormData = function (obj, html) {

        var posOptions = {timeout: 10000, enableHighAccuracy: false};
        $cordovaGeolocation
            .getCurrentPosition(posOptions)
            .then(function (position) {
                var lat = position.coords.latitude;
                var long = position.coords.longitude;
                var formId = html.Id;
                var url = base_url+"put/putFormFilledRawData.php?userid="+window.localStorage.userid+"&token="+window.localStorage.token+"&formid="+formId+"&lat="+lat+"&long="+long;
                var data = $(obj.target).serialize();
                $http.post(url, data).
                    success(function(data, status, headers, config) {
                        if(data.alert == 'SUCCESS'){
                            var myPopup = $ionicPopup.show({
                                title: 'Confirmation',
                                subTitle: 'Your data has been submitted successfully',
                                scope: $scope,
                                buttons: [
                                    {
                                        text: '<b>Ok</b>',
                                        type: 'button-calm',
                                        onTap: function(e) {
                                            $(this).hide();
                                        }
                                    },
                                ]
                            });
                        }
                    }).
                    error(function(data, status, headers, config) {
                        var myPopup = $ionicPopup.show({
                            title: 'Error',
                            subTitle: 'An error has been occured try again later!',
                            scope: $scope,
                            buttons: [
                                {
                                    text: '<b>Ok</b>',
                                    type: 'button-calm',
                                    onTap: function(e) {
                                        $(this).hide();
                                    }
                                },
                            ]
                        });
                    });

            }, function (err) {
                var myPopup = $ionicPopup.show({
                    title: 'Location Error',
                    subTitle: 'Not able to get the current location!!!',
                    scope: $scope,
                    buttons: [
                        {
                            text: '<b>Ok</b>',
                            type: 'button-calm',
                            onTap: function(e) {
                                $(this).hide();
                            }
                        },
                    ]
                });
            });
    }
})

When I run this on my web browser and submit the form data, the date is getting submitted with lat and longs, and I get a response with alert as SUCCESS. But when I build the app and try it on my Android mobile the request does not submit instead it executes the error branch and shows me a custom message in popup that An error has been occurred try again later! So the request does not getting submit from mobile device.

The app I am building uses Cordova with Ionic framework and AngularJS.

It is best to display / log the errors from the callback somewhere in your code like JB Nizet says in the comment.

Change:

title: 'Error',
subTitle: 'An error has been occured try again later!',

To:

title: 'HTTP Error: '+status,
subTitle: data,

In your error callback you can see these variables data and status are available.